\n// - Bold/italics \n// - Small text \n// - Headings -\n// - Anchors \n// - Dividers \n// - Lists \n// - Blockquotes \n// - Code blocks \n// - Abbreviations \n// - Citations \n// - Keystrokes \n\n/// Font family for header elements.\n/// @type String | List\n$header-font-family: $body-font-family !default;\n\n/// Font weight of headers.\n/// @type String\n$header-font-weight: $global-weight-normal !default;\n\n/// Font style (e.g. italicized) of headers.\n/// @type String\n$header-font-style: normal !default;\n\n/// Font stack used for elements that use monospaced type, such as code samples\n/// @type String | List\n$font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace !default;\n\n/// Color of headers.\n/// @type Color\n$header-color: inherit !default;\n\n/// Line height of headers.\n/// @type Number\n$header-lineheight: 1.4 !default;\n\n/// Bottom margin of headers.\n/// @type Number\n$header-margin-bottom: 0.5rem !default;\n\n/// Styles for headings at various screen sizes. Each key is a breakpoint, and each value is a map of heading styles.\n/// @type Map\n$header-styles: (\n small: (\n 'h1': ('font-size': 24),\n 'h2': ('font-size': 20),\n 'h3': ('font-size': 19),\n 'h4': ('font-size': 18),\n 'h5': ('font-size': 17),\n 'h6': ('font-size': 16),\n ),\n medium: (\n 'h1': ('font-size': 48),\n 'h2': ('font-size': 40),\n 'h3': ('font-size': 31),\n 'h4': ('font-size': 25),\n 'h5': ('font-size': 20),\n 'h6': ('font-size': 16),\n ),\n) !default;\n\n// $header-styles map is built from $header-sizes in order to ensure downward compatibility\n// when $header-sizes is depreciated, $header-styles needs to get !default values like settings.scss\n@function build-from-header-sizes($header-sizes) {\n @warn 'Note, that $header-sizes has been replaced with $header-styles. $header-sizes still works, but it is going to be depreciated.';\n $header-styles: ();\n @each $size, $headers in $header-sizes {\n $header-map: ();\n @each $header, $font-size in $headers {\n $header-map: map-merge($header-map, ($header: ('font-size': $font-size)));\n }\n $header-styles: map-merge($header-styles, ($size: $header-map));\n }\n @return $header-styles;\n}\n\n// If it exists $headers-sizes is used to build $header-styles. See the documentation.\n@if variable-exists(header-sizes) {\n $header-styles: build-from-header-sizes($header-sizes);\n}\n\n/// Text rendering method of headers.\n/// @type String\n$header-text-rendering: optimizeLegibility !default;\n\n/// Font size of `` elements.\n/// @type Number\n$small-font-size: 80% !default;\n\n/// Color of `` elements when placed inside headers.\n/// @type Color\n$header-small-font-color: $medium-gray !default;\n\n/// Line height of text inside `` elements.\n/// @type Number\n$paragraph-lineheight: 1.6 !default;\n\n/// Bottom margin of paragraphs.\n/// @type Number\n$paragraph-margin-bottom: 1rem !default;\n\n/// Text rendering method for paragraph text.\n/// @type String\n$paragraph-text-rendering: optimizeLegibility !default;\n\n/// Use the `.code-inline` component as default for `` elements.\n/// @type Boolean\n$enable-code-inline: true !default;\n\n/// Default color for links.\n/// @type Color\n$anchor-color: $primary-color !default;\n\n/// Default color for links on hover.\n/// @type Color\n$anchor-color-hover: scale-color($anchor-color, $lightness: -14%) !default;\n\n/// Default text decoration for links.\n/// @type String\n$anchor-text-decoration: none !default;\n\n/// Default text decoration for links on hover.\n/// @type String\n$anchor-text-decoration-hover: none !default;\n\n/// Maximum width of a divider.\n/// @type Number\n$hr-width: $global-width !default;\n\n/// Default border for a divider.\n/// @type List\n$hr-border: 1px solid $medium-gray !default;\n\n/// Default margin for a divider.\n/// @type Number | List\n$hr-margin: rem-calc(20) auto !default;\n\n/// Line height for items in a list.\n/// @type Number\n$list-lineheight: $paragraph-lineheight !default;\n\n/// Bottom margin for items in a list.\n/// @type Number\n$list-margin-bottom: $paragraph-margin-bottom !default;\n\n/// Bullet type to use for unordered lists (e.g., `square`, `circle`, `disc`).\n/// @type String\n$list-style-type: disc !default;\n\n/// Positioning for bullets on unordered list items.\n/// @type String\n$list-style-position: outside !default;\n\n/// Left (or right) margin for lists.\n/// @type Number\n$list-side-margin: 1.25rem !default;\n\n/// Left (or right) margin for a list inside a list.\n/// @type Number\n$list-nested-side-margin: 1.25rem !default;\n\n/// Bottom margin for `` elements.\n/// @type Number\n$defnlist-margin-bottom: 1rem !default;\n\n/// Font weight for `` elements.\n/// @type String\n$defnlist-term-weight: $global-weight-bold !default;\n\n/// Spacing between `` and `` elements.\n/// @type Number\n$defnlist-term-margin-bottom: 0.3rem !default;\n\n/// Text color of `` elements.\n/// @type Color\n$blockquote-color: $dark-gray !default;\n\n/// Padding inside a `` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
\n// - Code blocks \n// - Abbreviations \n// - Citations \n// - Keystrokes \n\n/// Font family for header elements.\n/// @type String | List\n$header-font-family: $body-font-family !default;\n\n/// Font weight of headers.\n/// @type String\n$header-font-weight: $global-weight-normal !default;\n\n/// Font style (e.g. italicized) of headers.\n/// @type String\n$header-font-style: normal !default;\n\n/// Font stack used for elements that use monospaced type, such as code samples\n/// @type String | List\n$font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace !default;\n\n/// Color of headers.\n/// @type Color\n$header-color: inherit !default;\n\n/// Line height of headers.\n/// @type Number\n$header-lineheight: 1.4 !default;\n\n/// Bottom margin of headers.\n/// @type Number\n$header-margin-bottom: 0.5rem !default;\n\n/// Styles for headings at various screen sizes. Each key is a breakpoint, and each value is a map of heading styles.\n/// @type Map\n$header-styles: (\n small: (\n 'h1': ('font-size': 24),\n 'h2': ('font-size': 20),\n 'h3': ('font-size': 19),\n 'h4': ('font-size': 18),\n 'h5': ('font-size': 17),\n 'h6': ('font-size': 16),\n ),\n medium: (\n 'h1': ('font-size': 48),\n 'h2': ('font-size': 40),\n 'h3': ('font-size': 31),\n 'h4': ('font-size': 25),\n 'h5': ('font-size': 20),\n 'h6': ('font-size': 16),\n ),\n) !default;\n\n// $header-styles map is built from $header-sizes in order to ensure downward compatibility\n// when $header-sizes is depreciated, $header-styles needs to get !default values like settings.scss\n@function build-from-header-sizes($header-sizes) {\n @warn 'Note, that $header-sizes has been replaced with $header-styles. $header-sizes still works, but it is going to be depreciated.';\n $header-styles: ();\n @each $size, $headers in $header-sizes {\n $header-map: ();\n @each $header, $font-size in $headers {\n $header-map: map-merge($header-map, ($header: ('font-size': $font-size)));\n }\n $header-styles: map-merge($header-styles, ($size: $header-map));\n }\n @return $header-styles;\n}\n\n// If it exists $headers-sizes is used to build $header-styles. See the documentation.\n@if variable-exists(header-sizes) {\n $header-styles: build-from-header-sizes($header-sizes);\n}\n\n/// Text rendering method of headers.\n/// @type String\n$header-text-rendering: optimizeLegibility !default;\n\n/// Font size of `` elements.\n/// @type Number\n$small-font-size: 80% !default;\n\n/// Color of `` elements when placed inside headers.\n/// @type Color\n$header-small-font-color: $medium-gray !default;\n\n/// Line height of text inside `` elements.\n/// @type Number\n$paragraph-lineheight: 1.6 !default;\n\n/// Bottom margin of paragraphs.\n/// @type Number\n$paragraph-margin-bottom: 1rem !default;\n\n/// Text rendering method for paragraph text.\n/// @type String\n$paragraph-text-rendering: optimizeLegibility !default;\n\n/// Use the `.code-inline` component as default for `` elements.\n/// @type Boolean\n$enable-code-inline: true !default;\n\n/// Default color for links.\n/// @type Color\n$anchor-color: $primary-color !default;\n\n/// Default color for links on hover.\n/// @type Color\n$anchor-color-hover: scale-color($anchor-color, $lightness: -14%) !default;\n\n/// Default text decoration for links.\n/// @type String\n$anchor-text-decoration: none !default;\n\n/// Default text decoration for links on hover.\n/// @type String\n$anchor-text-decoration-hover: none !default;\n\n/// Maximum width of a divider.\n/// @type Number\n$hr-width: $global-width !default;\n\n/// Default border for a divider.\n/// @type List\n$hr-border: 1px solid $medium-gray !default;\n\n/// Default margin for a divider.\n/// @type Number | List\n$hr-margin: rem-calc(20) auto !default;\n\n/// Line height for items in a list.\n/// @type Number\n$list-lineheight: $paragraph-lineheight !default;\n\n/// Bottom margin for items in a list.\n/// @type Number\n$list-margin-bottom: $paragraph-margin-bottom !default;\n\n/// Bullet type to use for unordered lists (e.g., `square`, `circle`, `disc`).\n/// @type String\n$list-style-type: disc !default;\n\n/// Positioning for bullets on unordered list items.\n/// @type String\n$list-style-position: outside !default;\n\n/// Left (or right) margin for lists.\n/// @type Number\n$list-side-margin: 1.25rem !default;\n\n/// Left (or right) margin for a list inside a list.\n/// @type Number\n$list-nested-side-margin: 1.25rem !default;\n\n/// Bottom margin for `` elements.\n/// @type Number\n$defnlist-margin-bottom: 1rem !default;\n\n/// Font weight for `` elements.\n/// @type String\n$defnlist-term-weight: $global-weight-bold !default;\n\n/// Spacing between `` and `` elements.\n/// @type Number\n$defnlist-term-margin-bottom: 0.3rem !default;\n\n/// Text color of `` elements.\n/// @type Color\n$blockquote-color: $dark-gray !default;\n\n/// Padding inside a `` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
\n// - Abbreviations \n// - Citations \n// - Keystrokes \n\n/// Font family for header elements.\n/// @type String | List\n$header-font-family: $body-font-family !default;\n\n/// Font weight of headers.\n/// @type String\n$header-font-weight: $global-weight-normal !default;\n\n/// Font style (e.g. italicized) of headers.\n/// @type String\n$header-font-style: normal !default;\n\n/// Font stack used for elements that use monospaced type, such as code samples\n/// @type String | List\n$font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace !default;\n\n/// Color of headers.\n/// @type Color\n$header-color: inherit !default;\n\n/// Line height of headers.\n/// @type Number\n$header-lineheight: 1.4 !default;\n\n/// Bottom margin of headers.\n/// @type Number\n$header-margin-bottom: 0.5rem !default;\n\n/// Styles for headings at various screen sizes. Each key is a breakpoint, and each value is a map of heading styles.\n/// @type Map\n$header-styles: (\n small: (\n 'h1': ('font-size': 24),\n 'h2': ('font-size': 20),\n 'h3': ('font-size': 19),\n 'h4': ('font-size': 18),\n 'h5': ('font-size': 17),\n 'h6': ('font-size': 16),\n ),\n medium: (\n 'h1': ('font-size': 48),\n 'h2': ('font-size': 40),\n 'h3': ('font-size': 31),\n 'h4': ('font-size': 25),\n 'h5': ('font-size': 20),\n 'h6': ('font-size': 16),\n ),\n) !default;\n\n// $header-styles map is built from $header-sizes in order to ensure downward compatibility\n// when $header-sizes is depreciated, $header-styles needs to get !default values like settings.scss\n@function build-from-header-sizes($header-sizes) {\n @warn 'Note, that $header-sizes has been replaced with $header-styles. $header-sizes still works, but it is going to be depreciated.';\n $header-styles: ();\n @each $size, $headers in $header-sizes {\n $header-map: ();\n @each $header, $font-size in $headers {\n $header-map: map-merge($header-map, ($header: ('font-size': $font-size)));\n }\n $header-styles: map-merge($header-styles, ($size: $header-map));\n }\n @return $header-styles;\n}\n\n// If it exists $headers-sizes is used to build $header-styles. See the documentation.\n@if variable-exists(header-sizes) {\n $header-styles: build-from-header-sizes($header-sizes);\n}\n\n/// Text rendering method of headers.\n/// @type String\n$header-text-rendering: optimizeLegibility !default;\n\n/// Font size of `` elements.\n/// @type Number\n$small-font-size: 80% !default;\n\n/// Color of `` elements when placed inside headers.\n/// @type Color\n$header-small-font-color: $medium-gray !default;\n\n/// Line height of text inside `` elements.\n/// @type Number\n$paragraph-lineheight: 1.6 !default;\n\n/// Bottom margin of paragraphs.\n/// @type Number\n$paragraph-margin-bottom: 1rem !default;\n\n/// Text rendering method for paragraph text.\n/// @type String\n$paragraph-text-rendering: optimizeLegibility !default;\n\n/// Use the `.code-inline` component as default for `` elements.\n/// @type Boolean\n$enable-code-inline: true !default;\n\n/// Default color for links.\n/// @type Color\n$anchor-color: $primary-color !default;\n\n/// Default color for links on hover.\n/// @type Color\n$anchor-color-hover: scale-color($anchor-color, $lightness: -14%) !default;\n\n/// Default text decoration for links.\n/// @type String\n$anchor-text-decoration: none !default;\n\n/// Default text decoration for links on hover.\n/// @type String\n$anchor-text-decoration-hover: none !default;\n\n/// Maximum width of a divider.\n/// @type Number\n$hr-width: $global-width !default;\n\n/// Default border for a divider.\n/// @type List\n$hr-border: 1px solid $medium-gray !default;\n\n/// Default margin for a divider.\n/// @type Number | List\n$hr-margin: rem-calc(20) auto !default;\n\n/// Line height for items in a list.\n/// @type Number\n$list-lineheight: $paragraph-lineheight !default;\n\n/// Bottom margin for items in a list.\n/// @type Number\n$list-margin-bottom: $paragraph-margin-bottom !default;\n\n/// Bullet type to use for unordered lists (e.g., `square`, `circle`, `disc`).\n/// @type String\n$list-style-type: disc !default;\n\n/// Positioning for bullets on unordered list items.\n/// @type String\n$list-style-position: outside !default;\n\n/// Left (or right) margin for lists.\n/// @type Number\n$list-side-margin: 1.25rem !default;\n\n/// Left (or right) margin for a list inside a list.\n/// @type Number\n$list-nested-side-margin: 1.25rem !default;\n\n/// Bottom margin for `` elements.\n/// @type Number\n$defnlist-margin-bottom: 1rem !default;\n\n/// Font weight for `` elements.\n/// @type String\n$defnlist-term-weight: $global-weight-bold !default;\n\n/// Spacing between `` and `` elements.\n/// @type Number\n$defnlist-term-margin-bottom: 0.3rem !default;\n\n/// Text color of `` elements.\n/// @type Color\n$blockquote-color: $dark-gray !default;\n\n/// Padding inside a `` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
` elements.\n/// @type Number\n$paragraph-lineheight: 1.6 !default;\n\n/// Bottom margin of paragraphs.\n/// @type Number\n$paragraph-margin-bottom: 1rem !default;\n\n/// Text rendering method for paragraph text.\n/// @type String\n$paragraph-text-rendering: optimizeLegibility !default;\n\n/// Use the `.code-inline` component as default for `` elements.\n/// @type Boolean\n$enable-code-inline: true !default;\n\n/// Default color for links.\n/// @type Color\n$anchor-color: $primary-color !default;\n\n/// Default color for links on hover.\n/// @type Color\n$anchor-color-hover: scale-color($anchor-color, $lightness: -14%) !default;\n\n/// Default text decoration for links.\n/// @type String\n$anchor-text-decoration: none !default;\n\n/// Default text decoration for links on hover.\n/// @type String\n$anchor-text-decoration-hover: none !default;\n\n/// Maximum width of a divider.\n/// @type Number\n$hr-width: $global-width !default;\n\n/// Default border for a divider.\n/// @type List\n$hr-border: 1px solid $medium-gray !default;\n\n/// Default margin for a divider.\n/// @type Number | List\n$hr-margin: rem-calc(20) auto !default;\n\n/// Line height for items in a list.\n/// @type Number\n$list-lineheight: $paragraph-lineheight !default;\n\n/// Bottom margin for items in a list.\n/// @type Number\n$list-margin-bottom: $paragraph-margin-bottom !default;\n\n/// Bullet type to use for unordered lists (e.g., `square`, `circle`, `disc`).\n/// @type String\n$list-style-type: disc !default;\n\n/// Positioning for bullets on unordered list items.\n/// @type String\n$list-style-position: outside !default;\n\n/// Left (or right) margin for lists.\n/// @type Number\n$list-side-margin: 1.25rem !default;\n\n/// Left (or right) margin for a list inside a list.\n/// @type Number\n$list-nested-side-margin: 1.25rem !default;\n\n/// Bottom margin for `` elements.\n/// @type Number\n$defnlist-margin-bottom: 1rem !default;\n\n/// Font weight for `` elements.\n/// @type String\n$defnlist-term-weight: $global-weight-bold !default;\n\n/// Spacing between `` and `` elements.\n/// @type Number\n$defnlist-term-margin-bottom: 0.3rem !default;\n\n/// Text color of `` elements.\n/// @type Color\n$blockquote-color: $dark-gray !default;\n\n/// Padding inside a `` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
` elements.\n/// @type Boolean\n$enable-code-inline: true !default;\n\n/// Default color for links.\n/// @type Color\n$anchor-color: $primary-color !default;\n\n/// Default color for links on hover.\n/// @type Color\n$anchor-color-hover: scale-color($anchor-color, $lightness: -14%) !default;\n\n/// Default text decoration for links.\n/// @type String\n$anchor-text-decoration: none !default;\n\n/// Default text decoration for links on hover.\n/// @type String\n$anchor-text-decoration-hover: none !default;\n\n/// Maximum width of a divider.\n/// @type Number\n$hr-width: $global-width !default;\n\n/// Default border for a divider.\n/// @type List\n$hr-border: 1px solid $medium-gray !default;\n\n/// Default margin for a divider.\n/// @type Number | List\n$hr-margin: rem-calc(20) auto !default;\n\n/// Line height for items in a list.\n/// @type Number\n$list-lineheight: $paragraph-lineheight !default;\n\n/// Bottom margin for items in a list.\n/// @type Number\n$list-margin-bottom: $paragraph-margin-bottom !default;\n\n/// Bullet type to use for unordered lists (e.g., `square`, `circle`, `disc`).\n/// @type String\n$list-style-type: disc !default;\n\n/// Positioning for bullets on unordered list items.\n/// @type String\n$list-style-position: outside !default;\n\n/// Left (or right) margin for lists.\n/// @type Number\n$list-side-margin: 1.25rem !default;\n\n/// Left (or right) margin for a list inside a list.\n/// @type Number\n$list-nested-side-margin: 1.25rem !default;\n\n/// Bottom margin for `` elements.\n/// @type Number\n$defnlist-margin-bottom: 1rem !default;\n\n/// Font weight for `` elements.\n/// @type String\n$defnlist-term-weight: $global-weight-bold !default;\n\n/// Spacing between `` and `` elements.\n/// @type Number\n$defnlist-term-margin-bottom: 0.3rem !default;\n\n/// Text color of `` elements.\n/// @type Color\n$blockquote-color: $dark-gray !default;\n\n/// Padding inside a `` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
` elements.\n/// @type Color\n$blockquote-color: $dark-gray !default;\n\n/// Padding inside a `` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
` element.\n/// @type Number | List\n$blockquote-padding: rem-calc(9 20 0 19) !default;\n\n/// Side border for `` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */
` elements.\n/// @type List\n$blockquote-border: 1px solid $medium-gray !default;\n\n/// Use the `.cite-block` component as default for `` elements.\n/// @type Boolean\n$enable-cite-block: true !default;\n\n/// Font family for `` elements.\n/// @type String | List\n$keystroke-font: $font-family-monospace !default;\n\n/// Text color for `` elements.\n/// @type Color\n$keystroke-color: $black !default;\n\n/// Background color for `` elements.\n/// @type Color\n$keystroke-background: $light-gray !default;\n\n/// Padding for `` elements.\n/// @type Number | List\n$keystroke-padding: rem-calc(2 4 0) !default;\n\n/// Border radius for `` elements.\n/// @type Number | List\n$keystroke-radius: $global-radius !default;\n\n/// Bottom border style for `` elements.\n/// @type List\n$abbr-underline: 1px dotted $black !default;\n\n@mixin foundation-typography-base {\n // Typography resets\n div,\n dl,\n dt,\n dd,\n ul,\n ol,\n li,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n pre,\n form,\n p,\n blockquote,\n th,\n td {\n margin: 0;\n padding: 0;\n }\n\n // Paragraphs\n p {\n margin-bottom: $paragraph-margin-bottom;\n\n font-size: inherit;\n line-height: $paragraph-lineheight;\n text-rendering: $paragraph-text-rendering;\n }\n\n // Emphasized text\n em,\n i {\n font-style: italic;\n line-height: inherit;\n }\n\n // Strong text\n strong,\n b {\n font-weight: $global-weight-bold;\n line-height: inherit;\n }\n\n // Small text\n small {\n font-size: $small-font-size;\n line-height: inherit;\n }\n\n // Headings\n h1, .h1,\n h2, .h2,\n h3, .h3,\n h4, .h4,\n h5, .h5,\n h6, .h6 {\n font-family: $header-font-family;\n font-style: $header-font-style;\n font-weight: $header-font-weight;\n color: $header-color;\n text-rendering: $header-text-rendering;\n\n small {\n line-height: 0;\n color: $header-small-font-color;\n }\n }\n\n // Heading styles\n @each $size, $headers in $header-styles {\n @include breakpoint($size) {\n @each $header, $header-defs in $headers {\n $font-size-temp: 1rem;\n #{$header}, .#{$header} {\n\n @if map-has-key($header-defs, font-size) {\n $font-size-temp: rem-calc(map-get($header-defs, font-size));\n font-size: $font-size-temp;\n } @else if map-has-key($header-defs, fs) {\n $font-size-temp: rem-calc(map-get($header-defs, fs));\n font-size: $font-size-temp;\n } @else if $size == $-zf-zero-breakpoint {\n font-size: $font-size-temp;\n }\n @if map-has-key($header-defs, line-height) {\n line-height: unitless-calc(map-get($header-defs, line-height), $font-size-temp);\n } @else if map-has-key($header-defs, lh) {\n line-height: unitless-calc(map-get($header-defs, lh), $font-size-temp);\n } @else if $size == $-zf-zero-breakpoint {\n line-height: unitless-calc($header-lineheight, $font-size-temp);\n }\n\n @if map-has-key($header-defs, margin-top) {\n margin-top: rem-calc(map-get($header-defs, margin-top));\n } @else if map-has-key($header-defs, mt) {\n margin-top: rem-calc(map-get($header-defs, mt));\n } @else if $size == $-zf-zero-breakpoint {\n margin-top: 0;\n }\n @if map-has-key($header-defs, margin-bottom) {\n margin-bottom: rem-calc(map-get($header-defs, margin-bottom));\n } @else if map-has-key($header-defs, mb) {\n margin-bottom: rem-calc(map-get($header-defs, mb));\n } @else if $size == $-zf-zero-breakpoint {\n margin-bottom: rem-calc($header-margin-bottom);\n }\n }\n }\n }\n }\n\n // Links\n a {\n line-height: inherit;\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $anchor-color-hover;\n @if $anchor-text-decoration-hover != $anchor-text-decoration {\n text-decoration: $anchor-text-decoration-hover;\n }\n }\n\n img {\n border: 0;\n }\n }\n\n // Horizontal rule\n hr {\n clear: both;\n\n max-width: $hr-width;\n height: 0;\n margin: $hr-margin;\n\n border-top: 0;\n border-right: 0;\n border-bottom: $hr-border;\n border-left: 0;\n }\n\n // Lists\n ul,\n ol,\n dl {\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n line-height: $list-lineheight;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n margin-#{$global-left}: $list-side-margin;\n list-style-type: $list-style-type;\n }\n\n // Ordered lists\n ol {\n margin-#{$global-left}: $list-side-margin;\n }\n\n // Nested unordered/ordered lists\n ul, ol {\n & & {\n margin-#{$global-left}: $list-nested-side-margin;\n margin-bottom: 0;\n }\n }\n\n // Definition lists\n dl {\n margin-bottom: $defnlist-margin-bottom;\n\n dt {\n margin-bottom: $defnlist-term-margin-bottom;\n font-weight: $defnlist-term-weight;\n }\n }\n\n // Blockquotes\n blockquote {\n margin: 0 0 $paragraph-margin-bottom;\n padding: $blockquote-padding;\n border-#{$global-left}: $blockquote-border;\n\n &, p {\n line-height: $paragraph-lineheight;\n color: $blockquote-color;\n }\n }\n\n // Inline Citations\n @if ($enable-cite-block == true) {\n cite {\n // Extending a class is not recommended.\n // TODO: Break the typography-base/typography-helpers separation\n @extend %cite-block;\n }\n }\n\n // Abbreviations\n abbr, abbr[title] {\n border-bottom: $abbr-underline;\n cursor: help;\n text-decoration: none;\n }\n\n // Figures\n figure {\n margin: 0;\n }\n\n // Code\n @if ($enable-code-inline == true) {\n code {\n @extend %code-inline;\n }\n }\n\n // Keystrokes\n kbd {\n margin: 0;\n padding: $keystroke-padding;\n\n background-color: $keystroke-background;\n\n font-family: $keystroke-font;\n color: $keystroke-color;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group typography-helpers\n////\n\n/// Default font size for lead paragraphs.\n/// @type Number\n$lead-font-size: $global-font-size * 1.25 !default;\n\n/// Default line height for lead paragraphs.\n/// @type String\n$lead-lineheight: 1.6 !default;\n\n/// Default line height for subheaders.\n/// @type Number\n$subheader-lineheight: 1.4 !default;\n\n/// Default font color for subheaders.\n/// @type Color\n$subheader-color: $dark-gray !default;\n\n/// Default font weight for subheaders.\n/// @type String\n$subheader-font-weight: $global-weight-normal !default;\n\n/// Default top margin for subheaders.\n/// @type Number\n$subheader-margin-top: 0.2rem !default;\n\n/// Default bottom margin for subheaders.\n/// @type Number\n$subheader-margin-bottom: 0.5rem !default;\n\n/// Default font size for statistic numbers.\n/// @type Number\n$stat-font-size: 2.5rem !default;\n\n/// Text color for `.cite-block` component.\n/// @type Color\n$cite-color: $dark-gray !default;\n\n/// Font size for `.cite-block` component.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Pseudo content for `.cite-block` component.\n/// @type String\n$cite-pseudo-content: '\\2014 \\0020' !default;\n\n/// Text color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of `.code-inline` and `.code-block` components.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in `.code-inline` and `.code-block` components.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of `.code-inline` and `.code-block` components.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around `.code-inline` and `.code-block` components.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of the `.code-inline` component.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !default;\n\n/// Padding around text of the `.code-block` component.\n/// @type Number | List\n$code-block-padding: 1rem !default;\n\n/// Margin under the `.code-block` component.\n/// @type Number\n$code-block-margin-bottom: 1.5rem !default;\n\n@mixin cite-block {\n display: block;\n color: $cite-color;\n font-size: $cite-font-size;\n\n &:before {\n content: $cite-pseudo-content;\n }\n}\n\n/// Add basic styles for a code helper.\n/// See `code-inline` and `code-block` mixins.\n@mixin code-style {\n border: $code-border;\n background-color: $code-background;\n\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n}\n\n/// Make code helper from the `code-style` mixin inline.\n/// Used to generate `.code-inline`\n@mixin code-inline {\n display: inline;\n max-width: 100%;\n word-wrap: break-word;\n\n padding: $code-padding;\n}\n\n/// Make code helper from the `code-style` mixin a block.\n/// Used to generate `.code-block`\n@mixin code-block {\n display: block;\n overflow: auto;\n white-space: pre;\n\n padding: $code-block-padding;\n margin-bottom: $code-block-margin-bottom;\n}\n\n@mixin foundation-typography-helpers {\n // Use to create a subheading under a main header\n // Make sure you pair the two elements in a element, like this:\n // \n // Heading\n // Subheading\n // \n .subheader {\n margin-top: $subheader-margin-top;\n margin-bottom: $subheader-margin-bottom;\n\n font-weight: $subheader-font-weight;\n line-height: $subheader-lineheight;\n color: $subheader-color;\n }\n\n // Use to style an introductory lead, deck, blurb, etc.\n .lead {\n font-size: $lead-font-size;\n line-height: $lead-lineheight;\n }\n\n // Use to style a large number to display a statistic\n .stat {\n font-size: $stat-font-size;\n line-height: 1;\n\n p + & {\n margin-top: -1rem;\n }\n }\n\n ul, ol {\n // Use to remove numbers from ordered list & bullets from unordered list\n &.no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n }\n\n %cite-block {\n @include cite-block;\n }\n\n .cite-block {\n @extend %cite-block;\n }\n\n %code-inline {\n @include code-style;\n @include code-inline;\n }\n\n .code-inline {\n @extend %code-inline;\n }\n\n .code-block {\n @include code-style;\n @include code-block;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-text-alignment {\n @each $size in $breakpoint-classes {\n @include breakpoint($size) {\n @each $align in (left, right, center, justify) {\n @if $size != $-zf-zero-breakpoint {\n .#{$size}-text-#{$align} {\n text-align: $align;\n }\n }\n @else {\n .text-#{$align} {\n text-align: $align;\n }\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// If `true`, all elements will have transparent backgrounds when printed, to save on ink.\n/// @type Boolean\n/// @group global\n$print-transparent-backgrounds: true !default;\n\n/// If `true`, displays next to all links their \"href\" when printed.\n/// @type Boolean\n/// @group global\n$print-hrefs: true !default;\n\n// sass-lint:disable-all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n // Ensure a \"black-on-white\" print by removing backgrounds,\n // using black text everywhere and forcing the browser to economize ink.\n @if $print-transparent-backgrounds {\n background: transparent !important;\n color: black !important; // Black prints faster: h5bp.com/s\n color-adjust: economy;\n }\n // Otherwise, prevent any economy by the browser.\n @else {\n color-adjust: exact;\n }\n\n box-shadow: none !important;\n text-shadow: none !important;\n }\n\n .show-for-print { display: block !important; }\n .hide-for-print { display: none !important; }\n\n table.show-for-print { display: table !important; }\n thead.show-for-print { display: table-header-group !important; }\n tbody.show-for-print { display: table-row-group !important; }\n tr.show-for-print { display: table-row !important; }\n td.show-for-print { display: table-cell !important; }\n th.show-for-print { display: table-cell !important; }\n\n // Display the URL of a link after the text\n a,\n a:visited { text-decoration: underline;}\n @if $print-hrefs {\n a[href]:after { content: ' (' attr(href) ')'; }\n }\n\n // Don't display the URL for images or JavaScript/internal links\n .ir a:after,\n a[href^='javascript:']:after,\n a[href^='#']:after { content: ''; }\n\n // Display what an abbreviation stands for after the text\n abbr[title]:after { content: ' (' attr(title) ')'; }\n\n // Prevent page breaks in the middle of a blockquote or preformatted text block\n pre,\n blockquote {\n border: 1px solid $dark-gray;\n page-break-inside: avoid;\n }\n\n // h5bp.com/t\n thead { display: table-header-group; }\n\n tr,\n img { page-break-inside: avoid; }\n\n img { max-width: 100% !important; }\n\n @page { margin: 0.5cm; }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n // Avoid page breaks after a heading\n h2,\n h3 { page-break-after: avoid; }\n\n // Helper to re-allow page breaks in the middle of certain elements (e.g. pre, blockquote, tr)\n .print-break-inside {\n page-break-inside: auto;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Font color of text inputs.\n/// @type Color\n$input-color: $black !default;\n\n/// Font color of placeholder text within text inputs.\n/// @type Color\n$input-placeholder-color: $medium-gray !default;\n\n/// Font family of text inputs.\n/// @type Font\n$input-font-family: inherit !default;\n\n/// Font size of text inputs.\n/// @type Number\n$input-font-size: rem-calc(16) !default;\n\n/// Font weight of text inputs.\n/// @type Keyword\n$input-font-weight: $global-weight-normal !default;\n\n/// Line height of text inputs.\n/// @type Keyword\n$input-line-height: $global-lineheight !default;\n\n/// Background color of text inputs.\n/// @type Color\n$input-background: $white !default;\n\n/// Background color of focused of text inputs.\n/// @type Color\n$input-background-focus: $white !default;\n\n/// Background color of disabled text inputs.\n/// @type Color\n$input-background-disabled: $light-gray !default;\n\n/// Border around text inputs.\n/// @type Border\n$input-border: 1px solid $medium-gray !default;\n\n/// Border around focused text inputs.\n/// @type Color\n$input-border-focus: 1px solid $dark-gray !default;\n\n/// Padding of text inputs.\n/// @type Color\n$input-padding: $form-spacing * 0.5 !default;\n\n/// Box shadow inside text inputs when not focused.\n/// @type Shadow\n$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default;\n\n/// Box shadow outside text inputs when focused.\n/// @type Shadow\n$input-shadow-focus: 0 0 5px $medium-gray !default;\n\n/// Cursor to use when hovering over a disabled text input.\n/// @type Cursor\n$input-cursor-disabled: not-allowed !default;\n\n/// Properties to transition on text inputs.\n/// @type Transition\n$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out !default;\n\n/// Enables the up/down buttons that Chrome and Firefox add to `` elements.\n/// @type Boolean\n$input-number-spinners: true !default;\n\n/// Radius for text inputs.\n/// @type Border\n$input-radius: $global-radius !default;\n\n/// Border radius for form buttons, defaulted to global-radius.\n/// @type Number\n$form-button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n border: $input-border;\n border-radius: $input-radius;\n background-color: $input-background;\n box-shadow: $input-shadow;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n}\n\n@mixin foundation-form-text {\n // Text inputs\n #{text-inputs()},\n textarea {\n @include form-element;\n appearance: none;\n }\n\n // Text areas\n textarea {\n max-width: 100%;\n\n &[rows] {\n height: auto;\n }\n }\n\n input,\n textarea {\n // Disabled/readonly state\n &:disabled,\n &[readonly] {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n }\n\n // Reset styles on button-like inputs\n [type='submit'],\n [type='button'] {\n appearance: none;\n border-radius: $form-button-radius;\n }\n\n // Reset Normalize setting content-box to search elements\n input[type='search'] { // sass-lint:disable-line no-qualifying-elements\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield; // sass-lint:disable-line no-vendor-prefixes\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n margin: 0;\n }\n }\n }\n\n // Placeholder text\n ::placeholder {\n color: $input-placeholder-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n@mixin foundation-form-checkbox {\n [type='file'],\n [type='checkbox'],\n [type='radio'] {\n margin: 0 0 $form-spacing;\n }\n\n // Styles for input/label siblings\n [type='checkbox'] + label,\n [type='radio'] + label {\n display: inline-block;\n vertical-align: baseline;\n\n margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n\n &[for] {\n cursor: pointer;\n }\n }\n\n // Styles for inputs inside labels\n label > [type='checkbox'],\n label > [type='radio'] {\n margin-#{$global-right}: $form-spacing * 0.5;\n }\n\n // Normalize file input width\n [type='file'] {\n width: 100%;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color for form labels.\n/// @type Color\n$form-label-color: $black !default;\n\n/// Font size for form labels.\n/// @type Number\n$form-label-font-size: rem-calc(14) !default;\n\n/// Font weight for form labels.\n/// @type Keyword\n$form-label-font-weight: $global-weight-normal !default;\n\n/// Line height for form labels. The higher the number, the more space between the label and its input field.\n/// @type Number\n$form-label-line-height: 1.8 !default;\n\n@mixin form-label {\n display: block;\n margin: 0;\n\n font-size: $form-label-font-size;\n font-weight: $form-label-font-weight;\n line-height: $form-label-line-height;\n color: $form-label-color;\n}\n\n@mixin form-label-middle {\n $input-border-width: get-border-value($input-border, width);\n\n margin: 0 0 $form-spacing;\n line-height: $global-lineheight;\n padding: ($form-spacing * 0.5 + rem-calc($input-border-width)) 0;\n}\n\n@mixin foundation-form-label {\n label {\n @include form-label;\n\n &.middle {\n @include form-label-middle;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default color for help text.\n/// @type Color\n$helptext-color: $black !default;\n\n/// Default font size for help text.\n/// @type Number\n$helptext-font-size: rem-calc(13) !default;\n\n/// Default font style for help text.\n/// @type Keyword\n$helptext-font-style: italic !default;\n\n@mixin foundation-form-helptext {\n .help-text {\n $margin-top: ($form-spacing * 0.5) * -1;\n\n margin-top: $margin-top;\n font-size: $helptext-font-size;\n font-style: $helptext-font-style;\n color: $helptext-color;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Color of labels prefixed to an input.\n/// @type Color\n$input-prefix-color: $black !default;\n\n/// Background color of labels prefixed to an input.\n/// @type Color\n$input-prefix-background: $light-gray !default;\n\n/// Border around labels prefixed to an input.\n/// @type Border\n$input-prefix-border: 1px solid $medium-gray !default;\n\n/// Left/right padding of an pre/postfixed input label\n$input-prefix-padding: 1rem !default;\n\n@mixin foundation-form-prepostfix {\n $height: ($input-font-size * $input-line-height) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n .input-group {\n display: if($global-flexbox, flex, table);\n width: 100%;\n margin-bottom: $form-spacing;\n\n @if $global-flexbox {\n align-items: stretch;\n }\n\n > :first-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, 0 $input-radius $input-radius 0, $input-radius 0 0 $input-radius);\n }\n }\n\n > :last-child {\n &, &.input-group-button > * {\n border-radius: if($global-text-direction == rtl, $input-radius 0 0 $input-radius, 0 $input-radius $input-radius 0);\n }\n }\n }\n\n %input-group-child {\n margin: 0;\n white-space: nowrap;\n\n @if not $global-flexbox {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n .input-group-label {\n @extend %input-group-child;\n padding: 0 $input-prefix-padding;\n border: $input-prefix-border;\n background: $input-prefix-background;\n\n color: $input-prefix-color;\n text-align: center;\n white-space: nowrap;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n @if has-value($input-prefix-border) {\n &:first-child {\n border-#{$global-right}: 0;\n }\n\n &:last-child {\n border-#{$global-left}: 0;\n }\n }\n }\n\n .input-group-field {\n @extend %input-group-child;\n border-radius: 0;\n\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n min-width: 0;\n }\n }\n\n .input-group-button {\n @extend %input-group-child;\n padding-top: 0;\n padding-bottom: 0;\n text-align: center;\n\n @if $global-flexbox {\n display: flex;\n flex: 0 0 auto;\n }\n @else {\n width: 1%;\n height: 100%;\n }\n\n a,\n input,\n button,\n label {\n @extend %input-group-child;\n\n @if $global-flexbox {\n align-self: stretch;\n height: auto;\n }\n @else {\n height: $height;\n }\n padding-top: 0;\n padding-bottom: 0;\n font-size: $input-font-size;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n @if not $global-flexbox {\n .input-group {\n .input-group-button {\n display: table-cell;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Default border around custom fieldsets.\n/// @type Border\n$fieldset-border: 1px solid $medium-gray !default;\n\n/// Default padding inside custom fieldsets.\n/// @type Number\n$fieldset-padding: rem-calc(20) !default;\n\n/// Default margin around custom fieldsets.\n/// @type Number\n$fieldset-margin: rem-calc(18 0) !default;\n\n/// Default padding between the legend text and fieldset border.\n/// @type Number\n$legend-padding: rem-calc(0 3) !default;\n\n@mixin fieldset {\n margin: $fieldset-margin;\n padding: $fieldset-padding;\n border: $fieldset-border;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n padding: $legend-padding;\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n max-width: 100%;\n margin-bottom: $form-spacing * 0.5;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group forms\n////\n\n/// Background color for select menus.\n/// @type Color\n$select-background: $white !default;\n\n/// Color of the dropdown triangle inside select menus. Set to `transparent` to remove it entirely.\n/// @type Color\n$select-triangle-color: $dark-gray !default;\n\n/// Default radius for select menus.\n/// @type Color\n$select-radius: $global-radius !default;\n\n@mixin form-select {\n $height: ($input-font-size * unitless-calc($input-line-height)) + (get-side($input-padding, 'top') + get-side($input-padding, 'bottom')) - rem-calc(1);\n\n height: $height;\n margin: 0 0 $form-spacing;\n padding: $input-padding;\n\n appearance: none;\n border: $input-border;\n border-radius: $select-radius;\n background-color: $select-background;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-line-height;\n color: $input-color;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-origin: content-box;\n background-position: $global-right (-$form-spacing) center;\n background-repeat: no-repeat;\n background-size: 9px 6px;\n\n padding-#{$global-right}: ($form-spacing * 1.5);\n }\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n outline: none;\n border: $input-border-focus;\n background-color: $input-background-focus;\n box-shadow: $input-shadow-focus;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n }\n\n // Disabled state\n &:disabled {\n background-color: $input-background-disabled;\n cursor: $input-cursor-disabled;\n }\n\n // Hide the dropdown arrow shown in newer IE versions\n &::-ms-expand {\n display: none;\n }\n\n &[multiple] {\n height: auto;\n background-image: none;\n }\n &:not([multiple]) {\n padding-top: 0;\n padding-bottom: 0;\n }\n}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group abide\n////\n\n/// Sets if error styles should be added to inputs.\n/// @type Boolean\n$abide-inputs: true !default;\n\n/// Sets if error styles should be added to labels.\n/// @type Boolean\n$abide-labels: true !default;\n\n/// Background color to use for invalid text inputs.\n/// @type Color\n$input-background-invalid: get-color(alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: get-color(alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: get-color(alert) !default;\n\n/// Default font size for form error text.\n/// @type Number\n$input-error-font-size: rem-calc(12) !default;\n\n/// Default font weight for form error text.\n/// @type Keyword\n$input-error-font-weight: $global-weight-bold !default;\n\n/// Styles the background and border of an input field to have an error state.\n///\n/// @param {Color} $background [$alert-color] - Color to use for the background and border.\n/// @param {Number} $background-lighten [10%] - Lightness level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-lighten: 10%\n) {\n &:not(:focus) {\n border-color: $background;\n background-color: mix($background, $white, $background-lighten);\n\n &::placeholder {\n color: $background;\n }\n }\n}\n\n/// Adds error styles to a form element, using the values in the settings file.\n@mixin form-error {\n display: none;\n margin-top: $form-spacing * -0.5;\n margin-bottom: $form-spacing;\n\n font-size: $input-error-font-size;\n font-weight: $input-error-font-weight;\n color: $input-error-color;\n}\n\n@mixin foundation-form-error {\n @if $abide-inputs {\n // Error class for invalid inputs\n .is-invalid-input {\n @include form-input-error;\n }\n }\n\n @if $abide-labels {\n // Error class for labels of invalid outputs\n .is-invalid-label {\n color: $form-label-color-invalid;\n }\n }\n\n // Form error element\n .form-error {\n @include form-error;\n\n &.is-visible {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\n\n/// Font family for button elements.\n/// @type Font\n$button-font-family: inherit !default;\n\n/// Font weight for button elements.\n/// Ignored if null (default)\n/// @type Font-Weight\n$button-font-weight: null !default;\n\n/// Padding inside buttons.\n/// @type List\n$button-padding: 0.85em 1em !default;\n\n/// Margin around buttons.\n/// @type List\n$button-margin: 0 0 $global-margin 0 !default;\n\n/// Default fill for buttons. Can either be `solid` or `hollow`.\n/// @type Keyword\n$button-fill: solid !default;\n\n/// Default background color for buttons.\n/// @type Color\n$button-background: $primary-color !default;\n\n/// Background color on hover for buttons.\n/// @type Color\n$button-background-hover: scale-color($button-background, $lightness: -15%) !default;\n\n/// Font color for buttons.\n/// @type List\n$button-color: $white !default;\n\n/// Alternative font color for buttons.\n/// @type List\n$button-color-alt: $black !default;\n\n/// Border radius for buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n/// Border for buttons, transparent by default\n/// @type List\n$button-border: 1px solid transparent !default;\n\n/// Border width for hollow outline buttons\n/// @type Number\n$button-hollow-border-width: 1px !default;\n\n/// Sizes for buttons.\n/// @type Map\n$button-sizes: (\n tiny: 0.6rem,\n small: 0.75rem,\n default: 0.9rem,\n large: 1.25rem,\n) !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$button-palette: $foundation-palette !default;\n\n/// opacity for a disabled button.\n/// @type List\n$button-opacity-disabled: 0.25 !default;\n\n/// Background color lightness on hover for buttons.\n/// @type Number\n$button-background-hover-lightness: -20% !default;\n\n/// Color lightness on hover for hollow buttons.\n/// @type Number\n$button-hollow-hover-lightness: -50% !default;\n\n// Internal: flip from margin-right to margin-left for defaults\n@if $global-text-direction == 'rtl' {\n $button-margin: 0 0 $global-margin $global-margin !default;\n}\n\n/// transitions for buttons.\n/// @type List\n$button-transition: background-color 0.25s ease-out, color 0.25s ease-out !default;\n\n/// Additional responsive classes for .expanded\n/// @type Boolean\n$button-responsive-expanded: false !default;\n\n// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n vertical-align: middle;\n margin: $button-margin;\n\n @if (type-of($button-padding) == 'map') {\n @each $size, $padding in $button-padding {\n @include breakpoint($size) {\n padding: $padding;\n }\n }\n }\n @else {\n padding: $button-padding;\n }\n\n border: $button-border;\n border-radius: $button-radius;\n transition: $button-transition;\n font-family: $button-font-family;\n font-size: map-get($button-sizes, default);\n font-weight: $button-font-weight;\n -webkit-appearance: none; // sass-lint:disable-line no-vendor-prefixes\n line-height: 1;\n text-align: center;\n cursor: pointer;\n}\n\n/// Expands a button to make it full-width.\n/// @param {Boolean} $expand [true] - Set to `true` to enable the expand behavior. Set to `false` to reverse this behavior.\n@mixin button-expand($expand: true) {\n @if $expand {\n display: block;\n width: 100%;\n margin-right: 0;\n margin-left: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\n }\n}\n\n/// Sets the base styles of a hollow or clear button filling according to `$fill`.\n/// See mixin `button-fill-style` for the filling styles.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`. `solid` has no effects.\n@mixin button-fill(\n $fill: $button-fill\n) {\n @if $fill == hollow {\n @include button-hollow;\n }\n @else if $fill == clear {\n @include button-clear;\n }\n}\n\n/// Sets the visual styles of a solid/hollow/clear button filling according to `$fill`.\n/// See mixins `button-style`, `button-hollow-style` and `button-clear-style` for effects of visual styling parameters.\n/// @param {Keyword} $fill [$button-fill] - Type of filling between `hollow` and `clear`.\n/// @param {Color} $background [$button-background] - -\n/// @param {Color} $background-hover [$button-background-hover] - -\n/// @param {Color} $color [$button-color] - -\n@mixin button-fill-style(\n $fill: $button-fill,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color\n) {\n @if $fill == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $fill == hollow {\n @include button-hollow-style($background);\n }\n @else if $fill == clear {\n @include button-clear-style($background);\n }\n}\n\n/// Sets the visual style of a button.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n@mixin button-style(\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $background-hover-lightness: $button-background-hover-lightness\n) {\n @if $color == auto {\n $color: color-pick-contrast($background, ($button-color, $button-color-alt));\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n background-color: $background;\n color: $color;\n }\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Sets the base styles of a hollow button.\n/// See mixin `button-hollow-style` for the filling styles.\n@mixin button-hollow {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a hollow button.\n/// @param {Color} $color [$button-background] - Text and border color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n/// @param {Color} $border-width [$button-hollow-border-width] - Border width of the button.\n@mixin button-hollow-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness,\n $border-width: $button-hollow-border-width\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n border: $border-width solid $color;\n color: $color;\n }\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Sets the base styles of a clear button.\n/// See mixin `button-clear-style` for the filling styles.\n@mixin button-clear {\n &, &.disabled, &[disabled] {\n &, &:hover, &:focus {\n border-color: transparent;\n background-color: transparent;\n }\n }\n}\n\n/// Sets the visual style of a clear button.\n/// @param {Color} $color [$button-background] - Text color of the button.\n/// @param {Color} $hover-lightness [$button-hollow-hover-lightness] - Color lightness on hover.\n@mixin button-clear-style(\n $color: $button-background,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n // Default and disabled states\n &,\n &.disabled, &[disabled],\n &.disabled:hover, &[disabled]:hover,\n &.disabled:focus, &[disabled]:focus {\n color: $color;\n }\n\n &:hover, &:focus {\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element and reseting the cursor.\n/// @param {Number} $opacity [$button-opacity-disabled] - Opacity of the disabled button.\n@mixin button-disabled(\n $opacity: $button-opacity-disabled\n) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n}\n\n/// Adds a dropdown arrow to a button.\n/// @param {Number} $size [0.4em] - Size of the arrow. We recommend using an `em` value so the triangle scales when used inside different sizes of buttons.\n/// @param {Color} $color [white] - Color of the arrow.\n/// @param {Number} $offset [$button-padding] - Distance between the arrow and the text of the button. Defaults to whatever the right padding of a button is.\n@mixin button-dropdown(\n $size: 0.4em,\n $color: $white,\n $offset: get-side($button-padding, right)\n) {\n &::after {\n @include css-triangle($size, $color, down);\n position: relative;\n top: 0.4em; // Aligns the arrow with the text of the button\n\n display: inline-block;\n float: #{$global-right};\n margin-#{$global-left}: $offset;\n }\n}\n\n/// Adds all styles for a button. For more granular control over styles, use the individual button mixins.\n/// @param {Boolean} $expand [false] - Set to `true` to make the button full-width.\n/// @param {Color} $background [$button-background] - Background color of the button.\n/// @param {Color} $background-hover [$button-background-hover] - Background color of the button on hover. Set to `auto` to have the mixin automatically generate a hover color.\n/// @param {Color} $color [$button-color] - Text color of the button. Set to `auto` to automatically generate a color based on the background color.\n/// @param {Keyword} $style [solid] - Set to `hollow` to create a hollow button. The color defined in `$background` will be used as the primary color of the button.\n@mixin button(\n $expand: false,\n $background: $button-background,\n $background-hover: $button-background-hover,\n $color: $button-color,\n $style: $button-fill\n) {\n @include button-base;\n @include button-fill($style);\n @include button-fill-style($style, $background, $background-hover, $color);\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button($style: none);\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} {\n font-size: $value;\n }\n }\n\n &.expanded { @include button-expand; }\n\n @if $button-responsive-expanded {\n @each $size in $breakpoint-classes {\n @include breakpoint(#{$size} only) {\n &.#{$size}-only-expanded {\n @include button-expand;\n }\n }\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint(#{$size} down) {\n &.#{$size}-down-expanded {\n @include button-expand;\n }\n }\n\n @include breakpoint(#{$size}) {\n &.#{$size}-expanded {\n @include button-expand;\n }\n }\n }\n }\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n }\n\n // Disabled state\n &.disabled, &[disabled] {\n @include button-disabled;\n }\n\n // Dropdown arrow\n &.dropdown {\n @include button-dropdown;\n\n @if $button-fill == hollow {\n &::after {\n border-top-color: $button-background;\n }\n }\n\n &.hollow, &.clear {\n &::after {\n border-top-color: $button-background;\n }\n\n @each $name, $color in $button-palette {\n &.#{$name} {\n &::after {\n border-top-color: $color;\n }\n }\n }\n }\n }\n\n // Button with dropdown arrow only\n &.arrow-only::after {\n top: -0.1em;\n float: none;\n margin-#{$global-left}: 0;\n }\n }\n\n a.button { // sass-lint:disable-line no-qualifying-elements\n &:hover,\n &:focus {\n text-decoration: none;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group accordion\n////\n\n/// Default background color of an accordion group.\n/// @type Color\n$accordion-background: $white !default;\n\n/// If `true`, adds plus and minus icons to the side of each accordion title.\n/// @type Boolean\n$accordion-plusminus: true !default;\n\n/// Content for the plus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-plus-content: '\\002B' !default;\n\n/// Content for the minus icon when `$accordion-plusminus` is `true`\n/// @type String\n$accordion-minus-content: '\\2013' !default;\n\n/// Font size of accordion titles.\n/// @type Number\n$accordion-title-font-size: rem-calc(12) !default;\n\n/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: $primary-color !default;\n\n/// Default background color on hover for items in a Menu.\n/// @type Color\n$accordion-item-background-hover: $light-gray !default;\n\n/// Default padding of an accordion item.\n/// @type Number | List\n$accordion-item-padding: 1.25rem 1rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$accordion-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$accordion-content-border: 1px solid $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$accordion-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$accordion-content-padding: 1rem !default;\n\n/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.\n@mixin accordion-container (\n $background: $accordion-background\n) {\n margin-#{$global-left}: 0;\n background: $background;\n list-style-type: none;\n\n &[disabled] {\n .accordion-title {\n cursor: not-allowed;\n }\n }\n}\n\n/// Adds styles for the accordion item. Apply this to the list item within an accordion ul.\n@mixin accordion-item {\n &:first-child > :first-child {\n border-radius: $global-radius $global-radius 0 0;\n }\n\n &:last-child > :last-child {\n border-radius: 0 0 $global-radius $global-radius;\n }\n}\n\n/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.\n@mixin accordion-title (\n $padding: $accordion-item-padding,\n $font-size: $accordion-title-font-size,\n $color: $accordion-item-color,\n $border: $accordion-content-border,\n $background-hover: $accordion-item-background-hover\n) {\n position: relative;\n display: block;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n :last-child:not(.is-active) > & {\n border-bottom: $border;\n border-radius: 0 0 $global-radius $global-radius;\n }\n\n &:hover,\n &:focus {\n background-color: $background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n position: absolute;\n top: 50%;\n #{$global-right}: 1rem;\n margin-top: -0.5rem;\n content: $accordion-plus-content;\n }\n\n .is-active > &::before {\n content: $accordion-minus-content;\n }\n }\n}\n\n/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.\n@mixin accordion-content (\n $padding: $accordion-content-padding,\n $border: $accordion-content-border,\n $background: $accordion-content-background,\n $color: $accordion-content-color\n) {\n display: none;\n padding: $padding;\n\n border: $border;\n border-bottom: 0;\n background-color: $background;\n\n color: $color;\n\n :last-child > &:last-child {\n border-bottom: $border;\n }\n}\n\n@mixin foundation-accordion {\n .accordion {\n @include accordion-container;\n }\n\n .accordion-item {\n @include accordion-item;\n }\n\n .accordion-title {\n @include accordion-title;\n }\n\n .accordion-content {\n @include accordion-content;\n }\n}\n","////\n/// @group accordion-menu\n////\n\n/// Sets accordion menu padding.\n/// @type Number\n$accordionmenu-padding: $global-menu-padding !default;\n\n/// Sets accordion menu nested margin\n/// @type Number\n$accordionmenu-nested-margin: $global-menu-nested-margin !default;\n\n/// Sets accordion menu submenu padding.\n/// @type Number\n$accordionmenu-submenu-padding: $accordionmenu-padding !default;\n\n/// Sets if accordion menus have the default arrow styles.\n/// @type Boolean\n$accordionmenu-arrows: true !default;\n\n/// Sets accordion menu arrow color if arrow is used.\n/// @type Color\n$accordionmenu-arrow-color: $primary-color !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-item-background: null !default;\n\n/// Sets accordion menu item border.\n/// @type Color\n$accordionmenu-border: null !default;\n\n/// Sets accordion menu item padding.\n/// @type Color\n$accordionmenu-submenu-toggle-background: null !default;\n\n/// Sets accordion menu item padding.\n/// @type List\n$accordion-submenu-toggle-border: $accordionmenu-border !default;\n\n/// Sets accordion menu submenu toggle background width.\n/// @type Number\n$accordionmenu-submenu-toggle-width: 40px !default;\n\n/// Sets accordion menu submenu toggle background height.\n/// @type Number\n$accordionmenu-submenu-toggle-height: $accordionmenu-submenu-toggle-width !default;\n\n/// Sets accordion menu arrow size if arrow is used.\n/// @type Length\n$accordionmenu-arrow-size: 6px !default;\n\n@mixin zf-accordion-menu-left-right-arrows {\n .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {\n position: relative;\n\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -1 * ($accordionmenu-arrow-size * 0.5);\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-accordion-submenu-parent > a::after {\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-accordion-submenu-parent > a::after {\n right: auto;\n left: 1rem;\n }\n}\n@mixin foundation-accordion-menu {\n\n .accordion-menu {\n @if $accordionmenu-border {\n border-bottom: $accordionmenu-border;\n }\n\n li {\n @if $accordionmenu-border {\n border-top: $accordionmenu-border;\n border-right: $accordionmenu-border;\n border-left: $accordionmenu-border;\n }\n width: 100%;\n }\n\n a {\n @if $accordionmenu-item-background {\n background: $accordionmenu-item-background;\n }\n padding: $accordionmenu-padding;\n }\n\n .is-accordion-submenu a {\n padding: $accordionmenu-submenu-padding;\n }\n\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin);\n }\n\n &.align-#{$global-right} {\n .nested.is-accordion-submenu {\n @include menu-nested($accordionmenu-nested-margin, right);\n }\n }\n\n @if $accordionmenu-arrows {\n @include zf-accordion-menu-left-right-arrows;\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform: rotate(180deg);\n transform-origin: 50% 50%;\n }\n }\n }\n\n .is-accordion-submenu li {\n @if $accordionmenu-border {\n border-right: 0;\n border-left: 0;\n }\n }\n\n .is-accordion-submenu-parent {\n position: relative;\n }\n\n .has-submenu-toggle > a {\n margin-#{$global-right}: $accordionmenu-submenu-toggle-width;\n }\n\n // Submenu toggle\n .submenu-toggle {\n position: absolute;\n top: 0;\n #{$global-right}: 0;\n\n width: $accordionmenu-submenu-toggle-width;\n height: $accordionmenu-submenu-toggle-height;\n\n cursor: pointer;\n\n border-#{$global-left}: $accordion-submenu-toggle-border;\n\n @if $accordionmenu-submenu-toggle-background {\n background: $accordionmenu-submenu-toggle-background;\n }\n\n // Add the arrow to the toggle\n &::after {\n @include css-triangle($accordionmenu-arrow-size, $accordionmenu-arrow-color, down);\n\n top: 0;\n bottom: 0;\n margin: auto;\n }\n }\n\n // Rotate the arrow when menu is open\n .submenu-toggle[aria-expanded='true']::after {\n transform: scaleY(-1);\n transform-origin: 50% 50%;\n }\n\n .submenu-toggle-text {\n @include element-invisible;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group menu\n////\n\n/// Margin of a menu.\n/// @type Number\n$menu-margin: 0 !default;\n\n/// Left-hand margin of a nested menu.\n/// @type Number\n$menu-nested-margin: $global-menu-nested-margin !default;\n\n/// Padding for items in a pill menu.\n/// @type Number\n$menu-items-padding: $global-menu-padding !default;\n\n/// margin for items in a simple menu.\n/// @type Number\n$menu-simple-margin: 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Alternative text color of an active menu item..\n/// @type Color\n$menu-item-color-alt-active: $black !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: get-color(primary) !default;\n\n/// Spacing between an icon and text in a menu item.\n/// @type Number\n$menu-icon-spacing: 0.25rem !default;\n\n/// Backward compatibility for menu state. If true, this duplicate `active` with `is-active`.\n/// But please note that `active` will be removed in upcoming versions.\n/// @type Boolean\n$menu-state-back-compat: true !default;\n\n/// Backward compatibility for menu centered. If true, this duplicate `.menu-centered > .menu` with `.menu.align-center`.\n/// But please note that `menu-centered` will be removed in upcoming versions.\n/// @type Boolean\n$menu-centered-back-compat: true !default;\n\n/// Backward compatibility for using `icon-*` classes without `.icons` classes\n/// But please note that this backward compatibility will be removed in upcoming versions.\n/// @type Boolean\n$menu-icons-back-compat: true !default;\n\n/// Creates the base styles for a Menu.\n@mixin menu-base {\n padding: 0;\n margin: 0;\n list-style: none;\n position: relative;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n }\n\n li {\n @include disable-mouse-outline;\n }\n\n a,\n .button {\n line-height: 1;\n text-decoration: none;\n display: block;\n padding: $menu-items-padding;\n }\n\n // Reset styles of inner elements\n input,\n select,\n a,\n button {\n margin-bottom: 0;\n }\n\n input {\n display: inline-block;\n }\n}\n\n/// Expands the items of a Menu, so each item is the same width.\n@mixin menu-expand {\n @if $global-flexbox {\n li {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n display: table;\n width: 100%;\n\n > li {\n display: table-cell;\n vertical-align: middle;\n }\n }\n}\n\n/// Align menu items.\n@mixin menu-align($alignment) {\n @if $alignment == left {\n @if $global-flexbox {\n justify-content: flex-start;\n }\n @else {\n text-align: $global-left;\n }\n }\n @else if $alignment == right {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: flex-end;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n\n &.vertical li {\n display: block;\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n @else {\n text-align: $global-right;\n\n .submenu li {\n text-align: $global-left;\n }\n\n &.vertical {\n .submenu li {\n text-align: $global-right;\n }\n }\n }\n }\n @else if $alignment == center {\n @if $global-flexbox {\n li {\n display: flex;\n justify-content: center;\n\n .submenu li {\n justify-content: flex-start;\n }\n }\n }\n @else {\n text-align: center;\n\n .submenu li {\n text-align: $global-left;\n }\n }\n }\n}\n\n/// Sets the direction of a Menu.\n/// @param {Keyword} $dir [horizontal] - Direction of the Menu. Can be `horizontal` or `vertical`.\n@mixin menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n @if $global-flexbox {\n flex-wrap: wrap;\n flex-direction: row;\n }\n @else {\n li {\n display: inline-block;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: nowrap;\n flex-direction: column;\n }\n @else {\n li {\n display: block;\n }\n }\n }\n @else {\n @warn 'The direction used for menu-direction() must be horizontal or vertical.';\n }\n}\n\n/// Creates a simple Menu, which has no padding or hover state.\n/// @param {Keyword} $dir [$global-left] - Direction of the menu. This effects the side of the `` that receives the margin.\n/// @param {Number} $margin [$menu-simple-margin] - The margin to apply to each ``.\n@mixin menu-simple($dir: $global-left, $margin: $menu-simple-margin) {\n @if $global-flexbox {\n align-items: center;\n }\n\n li + li {\n margin-#{$dir}: $margin;\n }\n\n a {\n padding: 0;\n }\n}\n\n/// Adds styles for a nested Menu, by adding `margin-left` to the menu.\n/// @param {Keyword|Number} $margin [$menu-nested-margin] - Length of the margin.\n/// @param {Keyword} $nested-alignment [left] - Alignment of the nested class\n@mixin menu-nested(\n $margin: $menu-nested-margin,\n $nested-alignment: left\n) {\n @if $nested-alignment == right {\n margin-#{$global-right}: $margin;\n margin-#{$global-left}: 0;\n }\n @else {\n margin-#{$global-right}: 0;\n margin-#{$global-left}: $margin;\n }\n\n}\n\n/// Adds basic styles for icons in menus.\n@mixin menu-icons() {\n @if $global-flexbox {\n a {\n display: flex;\n }\n }\n @else {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n}\n\n/// Align top/bottom icons within a menu.\n/// @param {Keyword} $alignment [center] - Alignment of the icon\n@mixin menu-icon-alignment($alignment: center) {\n @if $global-flexbox {\n &.icon-top,\n &.icon-bottom {\n li a {\n img,\n i,\n svg {\n @if $alignment == left {\n text-align: left;\n }\n\n @else if $alignment == right {\n text-align: right;\n }\n\n @else {\n text-align: center;\n }\n }\n }\n }\n }\n}\n\n/// Adds position classes for icons within a menu.\n@mixin menu-icon-position($position: left, $spacing: $menu-icon-spacing) {\n @if $position == left {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == right {\n li a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-left}: $spacing;\n\n @if not $global-flexbox {\n display: inline-block;\n }\n }\n }\n }\n @else if $position == top {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: 0 auto $spacing;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n @else if $position == bottom {\n li a {\n @if $global-flexbox {\n flex-flow: column nowrap;\n }\n @else {\n text-align: center;\n }\n\n img,\n i,\n svg {\n @if not $global-flexbox {\n display: block;\n margin: $spacing auto 0;\n }\n @else {\n align-self: stretch;\n margin-bottom: $spacing;\n text-align: center;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n padding: $global-menu-padding;\n\n font-weight: bold;\n line-height: 1;\n color: inherit;\n}\n\n@mixin menu-state-active {\n background: $menu-item-background-active;\n color: color-pick-contrast($menu-item-background-active, ($menu-item-color-active, $menu-item-color-alt-active));\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n\n // Default orientation: horizontal\n &, &.horizontal {\n @include menu-direction(horizontal);\n }\n\n // Vertical orientation modifier\n &.vertical {\n @include menu-direction(vertical);\n @include menu-icon-alignment(left);\n }\n\n // Even-width modifier for horizontal orientation\n &.expanded {\n @include menu-expand;\n @include menu-icon-alignment(left);\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Breakpoint specific versions\n @include -zf-each-breakpoint($small: false) {\n &.#{$-zf-size}-horizontal {\n @include menu-direction(horizontal);\n }\n\n &.#{$-zf-size}-vertical {\n @include menu-direction(vertical);\n }\n\n &.#{$-zf-size}-expanded {\n @include menu-expand;\n }\n\n &.#{$-zf-size}-simple {\n @include menu-expand;\n }\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Icon Base Styles\n &.icons {\n @include menu-icons;\n }\n\n // Backward Compatibility for active state\n @if $menu-icons-back-compat {\n &.icon-top,\n &.icon-right,\n &.icon-bottom,\n &.icon-left {\n @include menu-icons;\n }\n }\n\n // Menu icon position\n // Includes specificity to nested icons with a different position\n &,\n &.nested {\n // Icon Left\n &.icon-left {\n @include menu-icon-position(left);\n }\n\n // Icon Right\n &.icon-right {\n @include menu-icon-position(right);\n }\n\n // Icon Top\n &.icon-top {\n @include menu-icon-position(top);\n }\n\n // Icon Bottom\n &.icon-bottom {\n @include menu-icon-position(bottom);\n }\n }\n\n // Active state\n .is-active > a {\n @include menu-state-active;\n }\n\n // Backward Compatibility for active state\n @if $menu-state-back-compat {\n .active > a {\n @include menu-state-active;\n }\n }\n\n // Align left\n &.align-#{$global-left} {\n @include menu-align(left);\n }\n\n // Align right\n &.align-#{$global-right} {\n @include menu-align(right);\n @include menu-icon-alignment(right);\n\n .nested {\n @include menu-nested($nested-alignment: right);\n }\n }\n\n // Align center\n &.align-center {\n @include menu-align(center);\n }\n\n .menu-text {\n @include menu-text;\n }\n }\n\n @if $menu-centered-back-compat {\n .menu-centered {\n > .menu {\n @if $global-flexbox {\n justify-content: center;\n }\n\n @include menu-align(center);\n }\n }\n }\n\n // Prevent FOUC when using the Responsive Menu plugin\n .no-js [data-responsive-menu] ul {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group badge\n////\n\n/// Default background color for badges.\n/// @type Color\n$badge-background: $primary-color !default;\n\n/// Default text color for badges.\n/// @type Color\n$badge-color: $white !default;\n\n/// Alternate text color for badges.\n/// @type Color\n$badge-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$badge-palette: $foundation-palette !default;\n\n/// Default padding inside badges.\n/// @type Number\n$badge-padding: 0.3em !default;\n\n/// Minimum width of a badge.\n/// @type Number\n$badge-minwidth: 2.1em !default;\n\n/// Default font size for badges.\n/// @type Number\n$badge-font-size: 0.6rem !default;\n\n/// Generates the base styles for a badge.\n@mixin badge {\n display: inline-block;\n min-width: $badge-minwidth;\n padding: $badge-padding;\n\n border-radius: 50%;\n\n font-size: $badge-font-size;\n text-align: center;\n}\n\n@mixin foundation-badge {\n .badge {\n @include badge;\n\n background: $badge-background;\n color: $badge-color;\n\n @each $name, $color in $badge-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($badge-color, $badge-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group breadcrumbs\n////\n\n/// Margin around a breadcrumbs container.\n/// @type Number\n$breadcrumbs-margin: 0 0 $global-margin 0 !default;\n\n/// Font size of breadcrumb links.\n/// @type Number\n$breadcrumbs-item-font-size: rem-calc(11) !default;\n\n/// Color of breadcrumb links.\n/// @type Color\n$breadcrumbs-item-color: $primary-color !default;\n\n/// Color of the active breadcrumb link.\n/// @type Color\n$breadcrumbs-item-color-current: $black !default;\n\n/// Opacity of disabled breadcrumb links.\n/// @type Number\n$breadcrumbs-item-color-disabled: $medium-gray !default;\n\n/// Margin between breadcrumb items.\n/// @type Number\n$breadcrumbs-item-margin: 0.75rem !default;\n\n/// If `true`, makes breadcrumb links uppercase.\n/// @type Boolean\n$breadcrumbs-item-uppercase: true !default;\n\n/// If `true`, adds a seperator between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-separator: true !default;\n\n// If it exists $breadcrumbs-item-slash is used to build $breadcrumbs-item-separator. See the documentation.\n@if variable-exists(breadcrumbs-item-slash) {\n $breadcrumbs-item-separator: $breadcrumbs-item-slash;\n}\n\n/// Used character for the breadcrumb separator.\n/// @type Content\n$breadcrumbs-item-separator-item: '/' !default;\n\n/// Used character for the breadcrumb separator in rtl mode.\n/// @type Content\n$breadcrumbs-item-separator-item-rtl: '\\\\' !default;\n\n/// Color of breadcrumb item.\n/// @type Color\n$breadcrumbs-item-separator-color: $medium-gray !default;\n\n// If it exists $breadcrumbs-item-slash-color is used to build $breadcrumbs-item-separator-color. See the documentation.\n@if variable-exists(breadcrumbs-item-slash-color) {\n $breadcrumbs-item-separator-color: $breadcrumbs-item-slash-color;\n}\n\n/// Adds styles for a breadcrumbs container, along with the styles for the `` and `` elements inside of it.\n@mixin breadcrumbs-container {\n @include clearfix;\n margin: $breadcrumbs-margin;\n list-style: none;\n\n // Item wrapper\n li {\n float: #{$global-left};\n\n font-size: $breadcrumbs-item-font-size;\n color: $breadcrumbs-item-color-current;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-separator {\n // Need to escape the backslash\n $separator: if($global-text-direction == 'ltr', $breadcrumbs-item-separator-item, $breadcrumbs-item-separator-item-rtl);\n\n &:not(:last-child) {\n &::after {\n position: relative;\n margin: 0 $breadcrumbs-item-margin;\n opacity: 1;\n content: $separator;\n color: $breadcrumbs-item-separator-color;\n }\n }\n }\n @else {\n margin-#{$global-right}: $breadcrumbs-item-margin;\n }\n }\n\n // Page links\n a {\n color: $breadcrumbs-item-color;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n@mixin foundation-breadcrumbs {\n .breadcrumbs {\n @include breadcrumbs-container;\n\n .disabled {\n color: $breadcrumbs-item-color-disabled;\n cursor: not-allowed;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group button-group\n////\n\n/// Margin for button groups.\n/// @type Number\n$buttongroup-margin: 1rem !default;\n\n/// Margin between buttons in a button group.\n/// @type Number\n$buttongroup-spacing: 1px !default;\n\n/// Selector for the buttons inside a button group.\n/// @type String\n$buttongroup-child-selector: '.button' !default;\n\n/// Maximum number of buttons that can be in an even-width button group. (Only needed when $global-flexbox: false;)\n/// @type Number\n$buttongroup-expand-max: 6 !default;\n\n/// Determines if $button-radius is applied to each button or the button group as a whole. Use $global-radius in _settings.scss to change radius.\n/// @type Boolean\n$buttongroup-radius-on-each: true !default;\n\n/// Add styles for a button group container.\n/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group(\n $child-selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: wrap;\n align-items: stretch;\n flex-grow: 1;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $spacing;\n margin-bottom: $spacing;\n font-size: map-get($button-sizes, default);\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n\n &:last-child {\n margin-#{$global-right}: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $button-radius;\n border-bottom-#{$global-left}-radius: $button-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $button-radius;\n border-bottom-#{$global-right}-radius: $button-radius;\n }\n }\n }\n}\n\n/// Make buttons bonded without gap between them. Borders between buttons are merged\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n@mixin button-group-no-gaps(\n $selector: $buttongroup-child-selector,\n $border-width: $button-hollow-border-width\n) {\n #{$selector} {\n margin-#{$global-right}: rem-calc(-$border-width);\n\n + #{$selector} {\n border-#{$global-left}-color: transparent;\n }\n }\n}\n\n/// Creates a full-width button group, making each button equal width.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.\n/// @param {Number} $spacing [$buttongroup-spacing] - Spacing between buttons in a button group.\n@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $spacing: $buttongroup-spacing,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$spacing;\n\n &::before,\n &::after {\n display: none; // Disable clearfix\n }\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n @else {\n // One child\n &:first-child {\n &:last-child {\n width: calc(100% - #{$spacing});\n }\n }\n\n // Two or more childreen\n @for $i from 2 through $buttongroup-expand-max {\n &:first-child:nth-last-child(#{$i}) {\n &, &:first-child:nth-last-child(#{$i}) ~ #{$selector} {\n display: inline-block;\n width: calc(#{percentage(divide(1, $i))} - #{$spacing});\n margin-#{$global-right}: $spacing;\n\n &:last-child {\n margin-#{$global-right}: $spacing * -$buttongroup-expand-max;\n }\n }\n }\n }\n }\n }\n}\n\n/// Stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-stack(\n $selector: $buttongroup-child-selector\n) {\n @if $global-flexbox {\n flex-wrap: wrap;\n }\n\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 100%;\n }\n @else {\n width: 100%;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @if not $buttongroup-radius-on-each {\n border-radius: 0;\n\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: $global-radius;\n }\n\n &:last-child {\n border-bottom-#{$global-left}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n }\n }\n }\n}\n\n/// Un-stacks the buttons in a button group.\n/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.\n@mixin button-group-unstack(\n $selector: $buttongroup-child-selector\n) {\n #{$selector} {\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\n\n @if not $buttongroup-radius-on-each {\n &:first-child {\n border-top-#{$global-left}-radius: $global-radius;\n border-top-#{$global-right}-radius: 0;\n border-bottom-#{$global-left}-radius: $global-radius;\n }\n\n &:last-child {\n border-top-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-right}-radius: $global-radius;\n border-bottom-#{$global-left}-radius: 0;\n }\n }\n\n }\n}\n\n@mixin foundation-button-group {\n .button-group {\n @include button-group;\n\n // Sizes\n @each $size, $value in map-remove($button-sizes, default) {\n &.#{$size} #{$buttongroup-child-selector} {\n font-size: $value;\n }\n }\n\n // Even-width Group\n &.expanded {\n @include button-group-expand;\n }\n\n // Solid, hollow & clear styles\n @each $filling in (solid hollow clear) {\n $base-selector: if($button-fill == $filling, null, '.#{$filling}');\n\n &#{$base-selector} {\n // Do not generate button base styles for the default filling\n @if($button-fill != $filling) {\n #{$buttongroup-child-selector} {\n @include button-fill($filling);\n @include button-fill-style($filling);\n }\n }\n\n @each $name, $color in $button-palette {\n $individual-selector: if($button-fill == $filling, null, ' #{$buttongroup-child-selector}.#{$name}');\n\n &.#{$name} #{$buttongroup-child-selector}, #{$individual-selector} {\n @include button-fill-style($filling, $color, auto, auto);\n }\n }\n }\n\n }\n\n &.no-gaps {\n @include button-group-no-gaps;\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\n\n &.expanded {\n @include button-group-expand;\n }\n }\n\n &.stacked-for-small {\n @include breakpoint(medium) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-medium {\n @include breakpoint(large) {\n @include button-group-unstack;\n }\n }\n\n &.stacked-for-small.expanded {\n @include breakpoint(small only) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n\n &.stacked-for-medium.expanded {\n @include breakpoint(medium down) {\n display: block;\n\n #{$buttongroup-child-selector} {\n display: block;\n margin-#{$global-right}: 0;\n }\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group callout\n////\n\n/// Default background color.\n/// @type Color\n$callout-background: $white !default;\n\n/// Default fade value for callout backgrounds.\n/// @type Number\n$callout-background-fade: 85% !default;\n\n/// Default border style for callouts.\n/// @type List\n$callout-border: 1px solid rgba($black, 0.25) !default;\n\n/// Default bottom margin for callouts.\n/// @type Number\n$callout-margin: 0 0 1rem 0 !default;\n\n/// Sizes for Callout paddings.\n/// @type Map\n$callout-sizes: (\n small: 0.5rem,\n default: 1rem,\n large: 3rem,\n) !default;\n\n/// Default font color for callouts.\n/// @type Color\n$callout-font-color: $body-font-color !default;\n\n/// Default font color for callouts, if the callout has a dark background.\n/// @type Color\n$callout-font-color-alt: $body-background !default;\n\n/// Default border radius for callouts.\n/// @type Color\n$callout-radius: $global-radius !default;\n\n/// Amount to tint links used within colored panels. Set to `false` to disable this feature.\n/// @type Number | Boolean\n$callout-link-tint: 30% !default;\n\n/// Adds basic styles for a callout, including padding and margin.\n@mixin callout-base() {\n position: relative;\n margin: $callout-margin;\n padding: map-get($callout-sizes, default);\n\n border: $callout-border;\n border-radius: $callout-radius;\n\n // Respect the padding, fool.\n > :first-child {\n margin-top: 0;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Generate quick styles for a callout using a single color as a baseline.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout-style($color: $callout-background) {\n $background: scale-color($color, $lightness: $callout-background-fade);\n\n background-color: $background;\n color: color-pick-contrast($background, ($callout-font-color, $callout-font-color-alt));\n}\n\n@mixin callout-size($padding) {\n padding-top: $padding;\n padding-right: $padding;\n padding-bottom: $padding;\n padding-left: $padding;\n}\n\n\n/// Adds styles for a callout.\n/// @param {Color} $color [$callout-background] - Color to use.\n@mixin callout($color: $callout-background) {\n @include callout-base;\n @include callout-style($color);\n}\n\n@mixin foundation-callout {\n .callout {\n @include callout;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include callout-style($color);\n }\n }\n\n @each $size, $padding in map-remove($callout-sizes, default) {\n &.#{$size} {\n @include callout-size($padding);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group card\n////\n\n/// Default background color.\n/// @type Color\n$card-background: $white !default;\n\n/// Default font color for cards.\n/// @type Color\n$card-font-color: $body-font-color !default;\n\n/// Default background.\n/// @type Color\n$card-divider-background: $light-gray !default;\n\n/// Default border style.\n/// @type List\n$card-border: 1px solid $light-gray !default;\n\n/// Default card shadow.\n/// @type List\n$card-shadow: none !default;\n\n/// Default border radius.\n/// @type List\n$card-border-radius: $global-radius !default;\n\n/// Default padding.\n/// @type Number\n$card-padding: $global-padding !default;\n\n/// Default bottom margin.\n/// @type number\n$card-margin-bottom: $global-margin !default;\n\n/// Adds styles for a card container.\n/// @param {Color} $background - Background color of the card.\n/// @param {Color} $color - font color of the card.\n/// @param {Number} $margin - Bottom margin of the card.\n/// @param {List} $border - Border around the card.\n/// @param {List} $radius - border radius of the card.\n/// @param {List} $shadow - box shadow of the card.\n@mixin card-container(\n $background: $card-background,\n $color: $card-font-color,\n $margin: $card-margin-bottom,\n $border: $card-border,\n $radius: $card-border-radius,\n $shadow: $card-shadow\n) {\n @if $global-flexbox {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n margin-bottom: $margin;\n\n border: $border;\n border-radius: $radius;\n\n background: $background;\n box-shadow: $shadow;\n\n overflow: hidden;\n color: $color;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card divider.\n@mixin card-divider(\n $background: $card-divider-background,\n $padding: $card-padding\n) {\n @if $global-flexbox {\n display: flex;\n flex: 0 1 auto;\n }\n\n padding: $padding;\n background: $background;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adds styles for a card section.\n@mixin card-section(\n $padding: $card-padding\n) {\n @if $global-flexbox {\n flex: 1 0 auto;\n }\n\n padding: $padding;\n\n & > :last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin foundation-card {\n .card {\n @include card-container;\n }\n\n .card-divider {\n @include card-divider;\n }\n\n .card-section {\n @include card-section;\n }\n\n // For IE 11 - Flexbug\n // https://github.com/philipwalton/flexbugs/issues/75\n .card-image {\n min-height: 1px;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group close-button\n////\n\n/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.\n/// @type List\n$closebutton-position: right top !default;\n\n/// Default z-index for a close button.\n/// @type Number\n$closebutton-z-index: 10 !default;\n\n/// Button size to use as default\n/// @type String\n/// @see $closebutton-size\n/// @see $closebutton-offset-horizontal\n/// @see $closebutton-offset-vertical\n$closebutton-default-size: medium !default;\n\n/// Right (or left) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-horizontal: (\n small: 0.66rem,\n medium: 1rem,\n) !default;\n\n/// Top (or bottom) offset(s) for a close button.\n/// @type Number|Map\n$closebutton-offset-vertical: (\n small: 0.33em,\n medium: 0.5rem,\n) !default;\n\n/// Size(s) of the close button. Used to generate sizing modifiers.\n/// @type Number|Map\n$closebutton-size: (\n small: 1.5em,\n medium: 2em,\n) !default;\n\n/// The line-height of the close button. It affects the spacing of the element.\n/// @type Number\n$closebutton-lineheight: 1 !default;\n\n/// Default color of the close button.\n/// @type Color\n$closebutton-color: $dark-gray !default;\n\n/// Default color of the close button when being hovered on.\n/// @type Color\n$closebutton-color-hover: $black !default;\n\n\n/// Get the size and position for a close button. If the input value is a number, the number is returned. If the input value is a config map and the map has the key `$size`, the value is returned.\n///\n/// @param {Number|Map} $value - A number or map that represents the size or position value(s) of the close button.\n/// @param {Keyword} $size - The size of the close button to use.\n///\n/// @return {Number} The given number or the value found in the map.\n@function -zf-get-size-val($value, $size) {\n // Check if the value is a number\n @if type-of($value) == 'number' {\n // If it is, just return the number\n @return $value;\n }\n\n // Check if the size name exists in the value map\n @else if map-has-key($value, $size) {\n // If it does, return the value\n @return map-get($value, $size);\n }\n}\n\n/// Sets the size and position of a close button.\n/// @param {Keyword} $size [medium] - The size to use. Set to `small` to create a small close button. The 'medium' values defined in `$closebutton-*` variables will be used as the default size and position of the close button.\n@mixin close-button-size($size) {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n #{$x}: -zf-get-size-val($closebutton-offset-horizontal, $size);\n #{$y}: -zf-get-size-val($closebutton-offset-vertical, $size);\n font-size: -zf-get-size-val($closebutton-size, $size);\n line-height: -zf-get-size-val($closebutton-lineheight, $size);\n}\n\n/// Adds styles for a close button, using the styles in the settings variables.\n@mixin close-button {\n $x: nth($closebutton-position, 1);\n $y: nth($closebutton-position, 2);\n\n @include disable-mouse-outline;\n position: absolute;\n z-index: $closebutton-z-index;\n color: $closebutton-color;\n cursor: pointer;\n\n &:hover,\n &:focus {\n color: $closebutton-color-hover;\n }\n}\n\n@mixin foundation-close-button {\n .close-button {\n // Use by default the placeholder of the default size\n @extend %zf-close-button--#{$closebutton-default-size};\n\n @include close-button;\n\n // Generate a placeholder and a class for each size\n @each $name, $size in $closebutton-size {\n @at-root {\n %zf-close-button--#{$name} {\n @include close-button-size($name);\n }\n }\n\n &.#{$name} {\n @extend %zf-close-button--#{$name};\n }\n }\n }\n}\n","@mixin foundation-menu-icon {\n .menu-icon {\n @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);\n }\n\n .menu-icon.dark {\n @include hamburger;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group drilldown\n////\n\n/// Transition property to use for animating menus.\n/// @type Transition\n$drilldown-transition: transform 0.15s linear !default;\n\n/// Adds arrows to drilldown items with submenus, as well as the back button.\n/// @type Boolean\n$drilldown-arrows: true !default;\n\n/// Sets drilldown menu item padding.\n/// @type Number\n$drilldown-padding: $global-menu-padding !default;\n\n/// Sets drilldown menu nested margin\n/// @type Number\n$drilldown-nested-margin: 0 !default;\n\n/// Background color for drilldown top level items.\n/// @type Color\n$drilldown-background: $white !default;\n\n/// Sets drilldown menu item padding in the submenu.\n/// @type Number\n$drilldown-submenu-padding: $drilldown-padding !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-submenu-background: $white !default;\n\n/// Sets drilldown arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Sets drilldown arrow size if arrow is used.\n/// @type Length\n$drilldown-arrow-size: 6px !default;\n\n@mixin zf-drilldown-left-right-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -1 * $drilldown-arrow-size;\n #{$global-right}: 1rem;\n }\n }\n\n &.align-left .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n right: 1rem;\n left: auto;\n }\n\n &.align-right .is-drilldown-submenu-parent > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 1rem;\n }\n\n}\n\n@mixin foundation-drilldown-menu {\n // Applied to the Menu container\n .is-drilldown {\n position: relative;\n overflow: hidden;\n\n li {\n display: block;\n }\n\n &.animate-height {\n transition: height 0.5s;\n }\n }\n\n // The top level \n .drilldown {\n a {\n padding: $drilldown-padding;\n background: $drilldown-background;\n }\n\n // Applied to submenu s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n\n width: 100%;\n background: $drilldown-submenu-background;\n transition: $drilldown-transition;\n\n &.is-active {\n z-index: 1;\n display: block;\n transform: translateX(if($global-text-direction == ltr, -100%, 100%));\n }\n\n &.is-closing {\n transform: translateX(if($global-text-direction == ltr, 100%, -100%));\n }\n\n // Submenu item padding\n a {\n padding: $drilldown-submenu-padding;\n }\n }\n\n .nested.is-drilldown-submenu {\n @include menu-nested($drilldown-nested-margin);\n }\n\n .drilldown-submenu-cover-previous {\n min-height: 100%;\n }\n\n @if $drilldown-arrows {\n @include zf-drilldown-left-right-arrows;\n\n .js-drilldown-back > a::before {\n @include css-triangle($drilldown-arrow-size, $drilldown-arrow-color, $global-left);\n display: inline-block;\n vertical-align: middle;\n margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown\n////\n\n/// Padding for dropdown panes.\n/// @type List\n$dropdown-padding: 1rem !default;\n\n/// Background for dropdown panes.\n/// @type Color\n$dropdown-background: $body-background !default;\n\n/// Border for dropdown panes.\n/// @type List\n$dropdown-border: 1px solid $medium-gray !default;\n\n/// Font size for dropdown panes.\n/// @type List\n$dropdown-font-size: 1rem !default;\n\n/// Width for dropdown panes.\n/// @type Number\n$dropdown-width: 300px !default;\n\n/// Border radius dropdown panes.\n/// @type Number\n$dropdown-radius: $global-radius !default;\n\n/// Sizes for dropdown panes. Each size is a CSS class you can apply.\n/// @type Map\n$dropdown-sizes: (\n tiny: 100px,\n small: 200px,\n large: 400px,\n) !default;\n\n/// Applies styles for a basic dropdown.\n@mixin dropdown-container {\n position: absolute;\n z-index: 10;\n\n display: none;\n\n width: $dropdown-width;\n padding: $dropdown-padding;\n\n visibility: hidden;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n background-color: $dropdown-background;\n\n font-size: $dropdown-font-size;\n\n\n // Allow an intermittent state to do positioning before making visible.\n &.is-opening {\n display: block;\n }\n\n &.is-open {\n display: block;\n visibility: visible;\n }\n}\n\n@mixin foundation-dropdown {\n .dropdown-pane {\n @include dropdown-container;\n }\n\n @each $name, $size in $dropdown-sizes {\n .dropdown-pane {\n &.#{$name} {\n width: $size;\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group dropdown-menu\n////\n\n/// Enables arrows for items with dropdown menus.\n/// @type Boolean\n$dropdownmenu-arrows: true !default;\n\n/// Sets dropdown menu arrow color if arrow is used.\n/// @type Color\n$dropdownmenu-arrow-color: $anchor-color !default;\n\n/// Sets dropdown menu arrow size if arrow is used.\n/// @type Length\n$dropdownmenu-arrow-size: 6px !default;\n\n/// Sets dropdown menu arrow padding for aligning the arrow correctly.\n/// @type Length\n$dropdownmenu-arrow-padding: 1.5rem !default;\n\n/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for top level items.\n/// @type Color\n$dropdownmenu-background: null !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-submenu-background: $white !default;\n\n/// Padding for top level items.\n/// @type Number\n$dropdownmenu-padding: $global-menu-padding !default;\n\n/// Sets dropdown menu nested margin\n/// @type Number\n$dropdownmenu-nested-margin: 0 !default;\n\n/// Padding for sub-menu items.\n/// @type Number\n$dropdownmenu-submenu-padding: $dropdownmenu-padding !default;\n\n/// Border for dropdown sub-menus.\n/// @type List\n$dropdownmenu-border: 1px solid $medium-gray !default;\n\n// Border width for dropdown sub-menus.\n// Used to adjust top margin of a sub-menu if a border is used.\n// @type Length\n$dropdownmenu-border-width: nth($dropdownmenu-border, 1);\n\n/// Text color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-color-active: get-color(primary) !default;\n\n/// Background color of an active dropdown menu item. Explicit override for menu defaults\n/// @type Color\n$dropdown-menu-item-background-active: transparent !default;\n\n@mixin zf-dropdown-left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n }\n\n &.opens-left > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, left);\n right: auto;\n left: 5px;\n }\n\n &.opens-right > a::after {\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n\n > li.opens-right { // sass-lint:disable-line no-qualifying-elements\n > .is-dropdown-submenu {\n top: 100%;\n right: auto;\n left: 0;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a { // sass-lint:disable-line no-qualifying-elements\n position: relative;\n padding-#{$global-right}: $dropdownmenu-arrow-padding;\n }\n\n > li.is-dropdown-submenu-parent > a::after { // sass-lint:disable-line no-qualifying-elements\n @include css-triangle($dropdownmenu-arrow-size, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * ($dropdownmenu-arrow-size * 0.5);\n }\n }\n }\n @else if $dir == vertical {\n > li {\n .is-dropdown-submenu {\n top: 0;\n }\n\n &.opens-left {\n > .is-dropdown-submenu {\n top: 0;\n right: 100%;\n left: auto;\n }\n }\n\n &.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n }\n @else {\n @warn 'The direction used for dropdown-menu-direction() must be horizontal or vertical.';\n }\n}\n\n@mixin foundation-dropdown-menu {\n .dropdown.menu {\n @include dropdown-menu-direction(horizontal);\n\n a {\n @include disable-mouse-outline;\n }\n\n // Top-level item\n > li > a {\n background: $dropdownmenu-background;\n padding: $dropdownmenu-padding;\n }\n\n // Top-level item active state\n > li.is-active > a {\n background: $dropdown-menu-item-background-active;\n color: $dropdown-menu-item-color-active;\n }\n\n .no-js & ul {\n display: none;\n }\n\n .nested.is-dropdown-submenu {\n @include menu-nested($dropdownmenu-nested-margin);\n }\n\n &.vertical {\n @include dropdown-menu-direction(vertical);\n }\n\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n @include breakpoint($size) {\n &.#{$size}-horizontal {\n @include dropdown-menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include dropdown-menu-direction(vertical);\n }\n }\n }\n }\n\n &.align-right {\n .is-dropdown-submenu.first-sub {\n top: 100%;\n right: 0;\n left: auto;\n }\n }\n }\n\n .is-dropdown-menu.vertical {\n width: 100px;\n\n &.align-right {\n float: right;\n }\n }\n\n .is-dropdown-submenu-parent {\n position: relative;\n\n a::after {\n position: absolute;\n top: 50%;\n #{$global-right}: 5px;\n #{$global-left}: auto;\n margin-top: -1 * $dropdownmenu-arrow-size;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n }\n @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n right: 100%;\n left: auto;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: 1;\n\n display: none;\n min-width: $dropdownmenu-min-width;\n\n border: $dropdownmenu-border;\n background: $dropdownmenu-submenu-background;\n\n .dropdown & a {\n padding: $dropdownmenu-submenu-padding;\n }\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include zf-dropdown-left-right-arrows;\n }\n }\n\n @if (type-of($dropdownmenu-border-width) == 'number') {\n .is-dropdown-submenu {\n margin-top: (-$dropdownmenu-border-width);\n }\n }\n\n > li {\n width: 100%;\n }\n\n // [TODO] Cut back specificity\n //&:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &, // why is this line needed? Opening is handled by JS and this causes some ugly flickering when the sub is re-positioned automatically...\n &.js-dropdown-active {\n display: block;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group responsive-embed\n////\n\n/// Margin below a responsive embed container.\n/// @type Number\n$responsive-embed-margin-bottom: rem-calc(16) !default;\n\n/// Aspect ratios used to determine padding-bottom of responsive embed containers.\n/// @type Map\n$responsive-embed-ratios: (\n default: 4 by 3,\n widescreen: 16 by 9,\n) !default;\n\n/// Creates a responsive embed container.\n/// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`.\n@mixin responsive-embed($ratio: default) {\n @if type-of($ratio) == 'string' {\n $ratio: map-get($responsive-embed-ratios, $ratio);\n }\n position: relative;\n height: 0;\n margin-bottom: $responsive-embed-margin-bottom;\n padding-bottom: ratio-to-percentage($ratio);\n overflow: hidden;\n\n iframe,\n object,\n embed,\n video {\n position: absolute;\n top: 0;\n #{$global-left}: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n@mixin foundation-responsive-embed {\n .responsive-embed,\n .flex-video {\n @include responsive-embed($ratio: default);\n\n $ratios: map-remove($responsive-embed-ratios, default);\n\n @each $name, $ratio in $ratios {\n &.#{$name} {\n padding-bottom: ratio-to-percentage($ratio);\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group label\n////\n\n/// Default background color for labels.\n/// @type Color\n$label-background: $primary-color !default;\n\n/// Default text color for labels.\n/// @type Color\n$label-color: $white !default;\n\n/// Alternate text color for labels.\n/// @type Color\n$label-color-alt: $black !default;\n\n/// Coloring classes. A map of classes to output in your CSS, like `.secondary`, `.success`, and so on.\n/// @type Map\n$label-palette: $foundation-palette !default;\n\n/// Default font size for labels.\n/// @type Number\n$label-font-size: 0.8rem !default;\n\n/// Default padding inside labels.\n/// @type Number\n$label-padding: 0.33333rem 0.5rem !default;\n\n/// Default radius of labels.\n/// @type Number\n$label-radius: $global-radius !default;\n\n/// Generates base styles for a label.\n@mixin label {\n display: inline-block;\n padding: $label-padding;\n\n border-radius: $label-radius;\n\n font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n}\n\n@mixin foundation-label {\n .label {\n @include label;\n\n background: $label-background;\n color: $label-color;\n\n @each $name, $color in $label-palette {\n &.#{$name} {\n background: $color;\n color: color-pick-contrast($color, ($label-color, $label-color-alt));\n }\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group media-object\n////\n\n/// Bottom margin of a media object.\n/// @type Number\n$mediaobject-margin-bottom: $global-margin !default;\n\n/// Left and right padding on sections within a media object.\n/// @type Number\n$mediaobject-section-padding: $global-padding !default;\n\n/// Width of images within a media object, when the object is stacked vertically. Set to 'auto' to use the image's natural width.\n/// @type Number\n$mediaobject-image-width-stacked: 100% !default;\n\n/// Adds styles for a media object container.\n@mixin media-object-container {\n display: if($global-flexbox, flex, block);\n margin-bottom: $mediaobject-margin-bottom;\n\n @if $global-flexbox {\n flex-wrap: nowrap;\n }\n\n img {\n max-width: none;\n }\n\n @if $global-flexbox {\n &.stack-for-#{$-zf-zero-breakpoint} {\n @include breakpoint($-zf-zero-breakpoint only) {\n flex-wrap: wrap;\n }\n }\n }\n}\n\n/// Adds styles for sections within a media object.\n/// @param {Number} $padding [$mediaobject-section-padding] - Padding between sections.\n@mixin media-object-section($padding: $mediaobject-section-padding) {\n @if $global-flexbox {\n flex: 0 1 auto;\n }\n @else {\n display: table-cell;\n vertical-align: top;\n }\n\n &:first-child {\n padding-#{$global-right}: $padding;\n }\n\n &:last-child:not(:nth-child(2)) {\n padding-#{$global-left}: $padding;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n\n .stack-for-#{$-zf-zero-breakpoint} & {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n\n @if $global-flexbox {\n &.main-section {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n}\n\n/// Adds styles to stack sections of a media object. Apply this to the section elements, not the container.\n@mixin media-object-stack {\n padding: 0;\n padding-bottom: $mediaobject-section-padding;\n\n @if $global-flexbox {\n flex-basis: 100%;\n max-width: 100%;\n }\n @else {\n display: block;\n }\n\n img {\n width: $mediaobject-image-width-stacked;\n }\n}\n\n@mixin foundation-media-object {\n .media-object {\n @include media-object-container;\n }\n\n .media-object-section {\n @include media-object-section;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width map of a left/right off-canvas panel.\n/// @type Map\n$offcanvas-sizes: (\n small: 250px,\n) !default;\n\n/// Height map of a top/bottom off-canvas panel.\n/// @type Map\n$offcanvas-vertical-sizes: (\n small: 250px,\n) !default;\n\n/// Background color of an off-canvas panel.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Box shadow for the off-canvas overlap panel.\n/// @type Shadow\n$offcanvas-shadow: 0 0 10px rgba($black, 0.7) !default;\n\n/// Inner box shadow size for the off-canvas push panel.\n/// @type Number\n$offcanvas-inner-shadow-size: 20px !default;\n\n/// Inner box shadow color for the off-canvas push panel.\n/// @type Color\n$offcanvas-inner-shadow-color: rgba($black, 0.25) !default;\n\n/// Z-index of an off-canvas content overlay.\n/// @type Number\n$offcanvas-overlay-zindex: 11 !default;\n\n/// Z-index of an off-canvas panel with the `push` transition.\n/// @type Number\n$offcanvas-push-zindex: 12 !default;\n\n/// Z-index of an off-canvas panel with the `overlap` transition.\n/// @type Number\n$offcanvas-overlap-zindex: 13 !default;\n\n/// Z-index of an off-canvas panel using the `reveal-for-*` classes or mixin.\n/// @type Number\n$offcanvas-reveal-zindex: 12 !default;\n\n/// Length of the animation on an off-canvas panel.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas panel.\n/// @type Keyword\n$offcanvas-transition-timing: ease !default;\n\n/// If `true`, a revealed off-canvas will be fixed-position, and scroll with the screen.\n/// @type Bool\n$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas panel is open.\n/// @type Color\n$offcanvas-exit-background: rgba($white, 0.25) !default;\n\n/// CSS class used for the main content area. The off-canvas mixins use this to target the page content.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Adds baseline styles for off-canvas. This CSS is required to make the other pieces work.\n@mixin off-canvas-basics {\n\n /// Transform deprecated size settings into map & show warning\n @if variable-exists(offcanvas-size) {\n $offcanvas-sizes: (small: $offcanvas-size, medium: $offcanvas-size) !global;\n @warn '$offcanvas-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-sizes instead';\n }\n @if variable-exists(offcanvas-vertical-size) {\n $offcanvas-vertical-sizes: (small: $offcanvas-vertical-size, medium: $offcanvas-vertical-size) !global;\n @warn '$offcanvas-vertical-size is deprecated and not used anymore! Please update your settings and use the map $offcanvas-vertical-sizes instead';\n }\n\n // Checks the z-indexes and increase them due to backwards compatibility.\n // This is necessary because the overlay's z-index is new since v6.4 and may be identical to the user custom settings of the push z-index.\n @if $offcanvas-push-zindex <= $offcanvas-overlay-zindex { $offcanvas-push-zindex: $offcanvas-overlay-zindex + 1 !global; }\n @if $offcanvas-overlap-zindex <= $offcanvas-push-zindex { $offcanvas-overlap-zindex: $offcanvas-push-zindex + 1 !global; }\n @if $offcanvas-reveal-zindex <= $offcanvas-overlay-zindex { $offcanvas-reveal-zindex: $offcanvas-overlay-zindex + 1 !global; }\n\n // Hides overflow on body when an off-canvas panel is open.\n .is-off-canvas-open {\n overflow: hidden;\n }\n\n // Off-canvas overlay (generated by JavaScript)\n .js-off-canvas-overlay {\n position: absolute;\n top: 0;\n left: 0;\n z-index: $offcanvas-overlay-zindex;\n\n width: 100%;\n height: 100%;\n\n transition: opacity $offcanvas-transition-length $offcanvas-transition-timing, visibility $offcanvas-transition-length $offcanvas-transition-timing;\n\n background: $offcanvas-exit-background;\n\n opacity: 0;\n visibility: hidden;\n\n overflow: hidden;\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n }\n\n &.is-closable {\n cursor: pointer;\n }\n\n &.is-overlay-absolute {\n position: absolute;\n }\n\n &.is-overlay-fixed {\n position: fixed;\n }\n }\n}\n\n// Adds basic styles for an off-canvas wrapper.\n@mixin off-canvas-wrapper() {\n position: relative;\n overflow: hidden;\n}\n\n/// Adds basic styles for an off-canvas panel.\n@mixin off-canvas-base(\n $background: $offcanvas-background,\n $transition: $offcanvas-transition-length $offcanvas-transition-timing,\n $fixed: true\n) {\n @include disable-mouse-outline;\n\n @if $fixed == true {\n position: fixed;\n }\n @else {\n position: absolute;\n }\n\n // Set the off-canvas z-index.\n z-index: $offcanvas-push-zindex;\n\n // Increase CSS specificity\n &.is-transition-push {\n z-index: $offcanvas-push-zindex;\n }\n\n transition: transform $transition;\n backface-visibility: hidden;\n\n background: $background;\n\n // Hide inactive off-canvas within the content that have the same position\n &.is-closed {\n visibility: hidden;\n }\n\n // Overlap only styles.\n &.is-transition-overlap {\n z-index: $offcanvas-overlap-zindex;\n\n &.is-open {\n box-shadow: $offcanvas-shadow;\n }\n }\n\n // Sets transform to 0 to show an off-canvas panel.\n &.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles to position an off-canvas panel to the left/right/top/bottom.\n@mixin off-canvas-position(\n $position: left,\n $orientation: horizontal,\n $sizes: if($orientation == horizontal, $offcanvas-sizes, $offcanvas-vertical-sizes)\n) {\n @if $position == left {\n top: 0;\n left: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n }\n }\n }\n @else if $position == right {\n top: 0;\n right: 0;\n height: 100%;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n width: $size;\n transform: translateX($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateX(-$size);\n }\n }\n }\n }\n }\n @else if $position == top {\n top: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY(-$size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n }\n }\n }\n @else if $position == bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n height: $size;\n transform: translateY($size);\n }\n }\n\n // Sets the position for nested off-canvas element\n @at-root .#{$maincontent-class} .off-canvas.position-#{$position} {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY($size);\n }\n }\n &.is-transition-overlap.is-open {\n transform: translate(0, 0);\n }\n }\n\n // Sets the open position for the content\n @at-root .#{$maincontent-class}.is-open-#{$position} {\n &.has-transition-push {\n @each $name, $size in $sizes {\n @include breakpoint($name) {\n transform: translateY(-$size);\n }\n }\n }\n }\n }\n\n // If $offcanvas-inner-shadow-size is set, add inner box-shadow.\n // This mimics the off-canvas panel having a lower z-index, without having to have one.\n @if $offcanvas-inner-shadow-size {\n &.is-transition-push {\n @if $position == left {\n @include inner-side-shadow(right, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == right {\n @include inner-side-shadow(left, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == top {\n @include inner-side-shadow(bottom, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n @else if $position == bottom {\n @include inner-side-shadow(top, $offcanvas-inner-shadow-size, $offcanvas-inner-shadow-color);\n }\n }\n }\n\n}\n\n/// Sets the styles for the content container.\n@mixin off-canvas-content() {\n transform: none;\n backface-visibility: hidden;\n\n // Bind to has-transition-X class to prevent transition for transform:none\n &.has-transition-overlap,\n &.has-transition-push {\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Transform scope until the element is closed (makes sure transitionend gets triggered)\n &.has-transition-push {\n transform: translate(0, 0);\n }\n\n // Consider element & content, nested in another content\n .off-canvas.is-open {\n transform: translate(0, 0);\n }\n}\n\n/// Adds styles that reveal an off-canvas panel.\n@mixin off-canvas-reveal(\n $position: left,\n $zindex: $offcanvas-reveal-zindex,\n $content: $maincontent-class,\n $breakpoint: small\n) {\n transform: none;\n z-index: $zindex;\n transition: none;\n visibility: visible;\n\n @if not $offcanvas-fixed-reveal {\n position: absolute;\n }\n\n .close-button {\n display: none;\n }\n\n // Consider revealed element is nested in content\n .#{$maincontent-class} & {\n transform: none;\n }\n\n @at-root .#{$content}.has-reveal-#{$position} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n\n // backwards compatibility (prior to v6.4)\n & ~ .#{$content} {\n margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);\n }\n}\n\n/// Overrides the off-canvas styles\n@mixin in-canvas() {\n visibility: visible;\n height: auto;\n position: static;\n background: none;\n width: auto;\n overflow: visible;\n transition: none;\n\n // Increase CSS specificity\n &.position-left,\n &.position-right,\n &.position-top,\n &.position-bottom {\n box-shadow: none;\n transform: none;\n }\n\n .close-button {\n display: none;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas wrapper\n .off-canvas-wrapper {\n @include off-canvas-wrapper;\n }\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n // Force position absolute for nested off-canvas because fixed doesn't work for push transition within the transform scope.\n // @at-root .#{$maincontent-class} & {\n // // NOTE: since overlap transition is currently forced if nested, there's no need to force position absolute until nested push transition is supported.\n // position: absolute;\n // }\n }\n\n // Off-canvas container with absolute position\n .off-canvas-absolute {\n @include off-canvas-base($fixed: false);\n }\n\n // Off-canvas position classes\n .position-left { @include off-canvas-position(left, horizontal); }\n .position-right { @include off-canvas-position(right, horizontal); }\n .position-top { @include off-canvas-position(top, vertical); }\n .position-bottom { @include off-canvas-position(bottom, vertical); }\n\n .off-canvas-content {\n @include off-canvas-content;\n }\n\n // Reveal off-canvas panel on larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .position-left.reveal-for-#{$name} {\n @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-top.reveal-for-#{$name} {\n @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n\n .position-bottom.reveal-for-#{$name} {\n @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);\n }\n }\n }\n }\n\n // Move in-canvas for larger screens\n @each $name, $value in $breakpoint-classes {\n @if $name != $-zf-zero-breakpoint {\n @include breakpoint($name) {\n .off-canvas.in-canvas-for-#{$name} {\n @include in-canvas;\n }\n }\n }\n }\n}\n\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group orbit\n////\n\n/// Default color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background: $medium-gray !default;\n\n/// Default active color for Orbit's bullets.\n/// @type Color\n$orbit-bullet-background-active: $dark-gray !default;\n\n/// Default diameter for Orbit's bullets.\n/// @type Number\n$orbit-bullet-diameter: 1.2rem !default;\n\n/// Default margin between Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin: 0.1rem !default;\n\n/// Default distance from slide region for Orbit's bullets.\n/// @type Number\n$orbit-bullet-margin-top: 0.8rem !default;\n\n/// Default bottom margin from Orbit's bullets to whatever content may lurk below it.\n/// @type Number\n$orbit-bullet-margin-bottom: 0.8rem !default;\n\n/// Default background color for Orbit's caption.\n/// @type Color\n$orbit-caption-background: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's caption.\n/// @type Number\n$orbit-caption-padding: 1rem !default;\n\n/// Default background color for Orbit's controls when hovered.\n/// @type Color\n$orbit-control-background-hover: rgba($black, 0.5) !default;\n\n/// Default padding for Orbit's controls.\n/// @type Number\n$orbit-control-padding: 1rem !default;\n\n/// Default z-index for Orbit's controls.\n/// @type Number\n$orbit-control-zindex: 10 !default;\n\n/// Adds styles for the outer Orbit wrapper. These styles are used on the `.orbit` class.\n@mixin orbit-wrapper {\n position: relative;\n}\n\n/// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.\n@mixin orbit-container {\n position: relative;\n height: 0; // Prevent FOUC by not showing until JS sets height\n margin: 0;\n list-style: none;\n overflow: hidden;\n}\n\n/// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.\n@mixin orbit-slide {\n width: 100%;\n position: absolute;\n\n &.no-motionui {\n &.is-active {\n top: 0;\n left: 0;\n }\n }\n}\n\n@mixin orbit-figure {\n margin: 0;\n}\n\n/// Adds styles for a slide containing an image. These styles are used on the `.orbit-image` class.\n@mixin orbit-image {\n width: 100%;\n max-width: 100%;\n margin: 0;\n}\n\n/// Adds styles for an orbit slide caption. These styles are used on the `.orbit-caption` class.\n@mixin orbit-caption {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-bottom: 0;\n padding: $orbit-caption-padding;\n\n background-color: $orbit-caption-background;\n color: color-pick-contrast($orbit-caption-background);\n}\n\n/// Adds base styles for the next/previous buttons in an Orbit slider. These styles are shared between the `.orbit-next` and `.orbit-previous` classes in the default CSS.\n@mixin orbit-control {\n @include disable-mouse-outline;\n @include vertical-center;\n z-index: $orbit-control-zindex;\n padding: $orbit-control-padding;\n color: $white;\n\n &:hover,\n &:active,\n &:focus {\n background-color: $orbit-control-background-hover;\n }\n}\n\n/// Adds styles for the Orbit previous button. These styles are used on the `.orbit-previous` class.\n@mixin orbit-previous {\n #{$global-left}: 0;\n}\n\n/// Adds styles for the Orbit next button. These styles are used on the `.orbit-next` class.\n@mixin orbit-next {\n #{$global-left}: auto;\n #{$global-right}: 0;\n}\n\n/// Adds styles for a container of Orbit bullets. /// Adds styles for the Orbit previous button. These styles are used on the `.orbit-bullets` class.\n@mixin orbit-bullets {\n @include disable-mouse-outline;\n position: relative;\n margin-top: $orbit-bullet-margin-top;\n margin-bottom: $orbit-bullet-margin-bottom;\n text-align: center;\n\n button {\n width: $orbit-bullet-diameter;\n height: $orbit-bullet-diameter;\n margin: $orbit-bullet-margin;\n\n border-radius: 50%;\n background-color: $orbit-bullet-background;\n\n &:hover {\n background-color: $orbit-bullet-background-active;\n }\n\n &.is-active {\n background-color: $orbit-bullet-background-active;\n }\n }\n}\n\n@mixin foundation-orbit {\n .orbit {\n @include orbit-wrapper;\n }\n\n .orbit-container {\n @include orbit-container;\n }\n\n .orbit-slide {\n @include orbit-slide;\n }\n\n .orbit-figure {\n @include orbit-figure;\n }\n\n .orbit-image {\n @include orbit-image;\n }\n\n .orbit-caption {\n @include orbit-caption;\n }\n\n %orbit-control {\n @include orbit-control;\n }\n\n .orbit-previous {\n @extend %orbit-control;\n @include orbit-previous;\n }\n\n .orbit-next {\n @extend %orbit-control;\n @include orbit-next;\n }\n\n .orbit-bullets {\n @include orbit-bullets;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group pagination\n////\n\n/// Font size of pagination items.\n/// @type Number\n$pagination-font-size: rem-calc(14) !default;\n\n/// Default bottom margin of the pagination object.\n/// @type Number\n$pagination-margin-bottom: $global-margin !default;\n\n/// Text color of pagination items.\n/// @type Color\n$pagination-item-color: $black !default;\n\n/// Padding inside of pagination items.\n/// @type Number\n$pagination-item-padding: rem-calc(3 10) !default;\n\n/// Right margin to separate pagination items.\n/// @type Number\n$pagination-item-spacing: rem-calc(1) !default;\n\n/// Default radius for pagination items.\n/// @type Number\n$pagination-radius: $global-radius !default;\n\n/// Background color of pagination items on hover.\n/// @type Color\n$pagination-item-background-hover: $light-gray !default;\n\n/// Background color of pagination item for the current page.\n/// @type Color\n$pagination-item-background-current: $primary-color !default;\n\n/// Text color of the pagination item for the current page.\n/// @type Color\n$pagination-item-color-current: $white !default;\n\n/// Text color of a disabled pagination item.\n/// @type Color\n$pagination-item-color-disabled: $medium-gray !default;\n\n/// Color of the ellipsis in a pagination menu.\n/// @type Color\n$pagination-ellipsis-color: $black !default;\n\n/// If `false`, don't display page number links on mobile, only next/previous links\n/// and optionally current page number.\n/// @type Boolean\n$pagination-mobile-items: false !default;\n\n/// If `true`, display the current page number on mobile even if `$pagination-mobile-items` is set to `false`.\n/// This parameter will only override the visibility setting of the current item for `$pagination-mobile-items: false;`,\n/// it will not affect the current page number visibility when `$pagination-mobile-items` is set to `true`.\n/// @type Boolean\n$pagination-mobile-current-item: false !default;\n\n/// If `true`, arrows are added to the next and previous links of pagination.\n/// @type Boolean\n$pagination-arrows: true !default;\n\n/// Content for the previous arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-previous: '\\00AB' !default;\n\n/// Content for the next arrow when `$pagination-arrows` is `true`\n/// @type String\n$pagination-arrow-next: '\\00BB' !default;\n\n/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container (\n $margin-bottom: $pagination-margin-bottom,\n $font-size: $pagination-font-size,\n $spacing: $pagination-item-spacing,\n $radius: $pagination-radius,\n $color: $pagination-item-color,\n $padding: $pagination-item-padding,\n $background-hover: $pagination-item-background-hover\n) {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $margin-bottom;\n\n // List item\n li {\n margin-#{$global-right}: $spacing;\n border-radius: $radius;\n font-size: $font-size;\n\n @if $pagination-mobile-items {\n display: inline-block;\n }\n @else {\n display: none;\n\n &:last-child,\n &:first-child {\n display: inline-block;\n }\n\n @if $pagination-mobile-current-item {\n &.current {\n display: inline-block;\n }\n }\n\n @include breakpoint(medium) {\n display: inline-block;\n }\n }\n }\n\n // Page links\n a,\n button {\n display: block;\n padding: $padding;\n border-radius: $radius;\n color: $color;\n\n &:hover {\n background: $background-hover;\n }\n }\n}\n\n/// Adds styles for the current pagination item. Apply this to an ``.\n@mixin pagination-item-current (\n $padding: $pagination-item-padding,\n $background-current: $pagination-item-background-current,\n $color-current: $pagination-item-color-current\n) {\n padding: $padding;\n background: $background-current;\n color: $color-current;\n cursor: default;\n}\n\n/// Adds styles for a disabled pagination item. Apply this to an ``.\n@mixin pagination-item-disabled (\n $padding: $pagination-item-padding,\n $color: $pagination-item-color-disabled\n) {\n padding: $padding;\n color: $color;\n cursor: not-allowed;\n\n &:hover {\n background: transparent;\n }\n}\n\n/// Adds styles for an ellipsis for use in a pagination list.\n@mixin pagination-ellipsis (\n $padding: $pagination-item-padding,\n $color: $pagination-ellipsis-color\n) {\n padding: $padding;\n content: '\\2026';\n color: $color;\n}\n\n@mixin foundation-pagination {\n .pagination {\n @include pagination-container;\n\n .current {\n @include pagination-item-current;\n }\n\n .disabled {\n @include pagination-item-disabled;\n }\n\n .ellipsis::after {\n @include pagination-ellipsis;\n }\n }\n\n @if $pagination-arrows {\n .pagination-previous a::before,\n .pagination-previous.disabled::before {\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n content: $pagination-arrow-previous;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n content: $pagination-arrow-next;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\n background-color: $progress-background;\n}\n\n/// Adds styles for the inner meter of a progress bar.\n@mixin progress-meter {\n position: relative;\n display: block;\n width: 0%;\n height: 100%;\n background-color: $progress-meter-background;\n\n @if has-value($progress-radius) {\n border-radius: $global-radius;\n }\n}\n\n/// Adds styles for text in the progress meter.\n@mixin progress-meter-text {\n @include absolute-center;\n margin: 0;\n font-size: 0.75rem;\n font-weight: bold;\n color: $white;\n white-space: nowrap;\n\n @if has-value($progress-radius) {\n border-radius: $progress-radius;\n }\n}\n\n@mixin foundation-progress-bar {\n // Progress bar\n .progress {\n @include progress-container;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n .progress-meter {\n background-color: $color;\n }\n }\n }\n }\n\n // Inner meter\n .progress-meter {\n @include progress-meter;\n }\n\n // Inner meter text\n .progress-meter-text {\n @include progress-meter-text;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// [TODO] Check how plugin confirms disabled or vertical status\n// [TODO] Check if transition: all; is necessary\n\n////\n/// @group slider\n////\n\n/// Default slider width of a vertical slider. (Doesn't apply to the native slider.)\n/// @type Number\n$slider-width-vertical: 0.5rem !default;\n\n/// Transition properties to apply to the slider handle and fill. (Doesn't apply to the native slider.)\n/// @type Transition\n$slider-transition: all 0.2s ease-in-out !default;\n\n/// Adds the general styles for sliders.\n@mixin slider-container {\n position: relative;\n height: $slider-height;\n margin-top: 1.25rem;\n margin-bottom: 2.25rem;\n\n background-color: $slider-background;\n cursor: pointer;\n user-select: none;\n touch-action: none;\n}\n\n/// Adds the general styles for active fill for sliders.\n@mixin slider-fill {\n position: absolute;\n top: 0;\n left: 0;\n\n display: inline-block;\n max-width: 100%;\n height: $slider-height;\n\n background-color: $slider-fill-background;\n transition: $slider-transition;\n\n &.is-dragging {\n transition: all 0s linear;\n }\n}\n\n/// Adds the general styles for the slider handles.\n@mixin slider-handle {\n @include disable-mouse-outline;\n @include vertical-center;\n left: 0;\n z-index: 1;\n cursor: grab;\n\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n\n border-radius: $slider-radius;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\n cursor: grabbing;\n }\n}\n\n@mixin slider-disabled {\n opacity: $slider-opacity-disabled;\n cursor: not-allowed;\n}\n\n@mixin slider-vertical {\n display: inline-block;\n width: $slider-width-vertical;\n height: 12.5rem;\n margin: 0 1.25rem;\n transform: scale(1, -1);\n\n .slider-fill {\n top: 0;\n width: $slider-width-vertical;\n max-height: 100%;\n }\n\n .slider-handle {\n position: absolute;\n top: 0;\n left: 50%;\n width: $slider-handle-height;\n height: $slider-handle-width;\n transform: translateX(-50%);\n }\n}\n\n@mixin foundation-slider {\n // Container\n .slider {\n @include slider-container;\n }\n\n // Fill area\n .slider-fill {\n @include slider-fill;\n }\n\n // Draggable handle\n .slider-handle {\n @include slider-handle;\n }\n\n // Disabled state\n .slider.disabled,\n .slider[disabled] {\n @include slider-disabled;\n }\n\n // Vertical slider\n .slider.vertical {\n @include slider-vertical;\n }\n\n // RTL support\n @if $global-text-direction == rtl {\n .slider:not(.vertical) {\n transform: scale(-1, 1);\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: relative;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\n width: 100%;\n\n &.is-at-top {\n top: 0;\n }\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n\n .sticky.is-anchored {\n position: relative;\n right: auto;\n left: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group switch\n////\n\n/// Background color of a switch.\n/// @type Color\n$switch-background: $medium-gray !default;\n\n/// Background active color of a switch.\n/// @type Color\n$switch-background-active: $primary-color !default;\n\n/// Height of a switch, with no class applied.\n/// @type Number\n$switch-height: 2rem !default;\n\n/// Height of a switch with .tiny class.\n/// @type Number\n$switch-height-tiny: 1.5rem !default;\n\n/// Height of a switch with .small class.\n/// @type Number\n$switch-height-small: 1.75rem !default;\n\n/// Height of a switch with .large class.\n/// @type Number\n$switch-height-large: 2.5rem !default;\n\n/// Border radius of the switch\n/// @type Number\n$switch-radius: $global-radius !default;\n\n/// border around a modal.\n/// @type Number\n$switch-margin: $global-margin !default;\n\n/// Background color for the switch container and paddle.\n/// @type Color\n$switch-paddle-background: $white !default;\n\n/// Spacing between a switch paddle and the edge of the body.\n/// @type Number\n$switch-paddle-offset: 0.25rem !default;\n\n/// border radius of the switch paddle\n/// @type Number\n$switch-paddle-radius: $global-radius !default;\n\n/// switch transition.\n/// @type Number\n$switch-paddle-transition: all 0.25s ease-out !default;\n\n/// Opacity of a disabled switch.\n/// @type Number\n$switch-opacity-disabled: 0.5 !default;\n\n/// Cursor for a disabled switch.\n/// @type Cursor\n$switch-cursor-disabled: not-allowed !default;\n\n// make them variables\n// ask about accessibility on label\n// change class name for text\n\n/// Adds styles for a switch container. Apply this to a container class.\n@mixin switch-container {\n position: relative;\n margin-bottom: $switch-margin;\n outline: 0;\n\n // These properties cascade down to the switch text\n font-size: rem-calc(14);\n font-weight: bold;\n color: $white;\n\n user-select: none;\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n position: absolute;\n margin-bottom: 0;\n opacity: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `` within a switch.\n@mixin switch-paddle {\n $switch-width: $switch-height * 2;\n $paddle-height: $switch-height - ($switch-paddle-offset * 2);\n $paddle-width: $switch-height - ($switch-paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $switch-paddle-offset;\n\n position: relative;\n display: block;\n width: $switch-width;\n height: $switch-height;\n\n border-radius: $switch-radius;\n background: $switch-background;\n transition: $switch-paddle-transition;\n\n // Resetting these presets so type styles cascade down\n font-weight: inherit;\n color: inherit;\n\n cursor: pointer;\n\n // Needed to override specificity\n input + & {\n margin: 0;\n }\n\n // The paddle itself\n &::after {\n position: absolute;\n top: $switch-paddle-offset;\n #{$global-left}: $switch-paddle-offset;\n\n display: block;\n width: $paddle-width;\n height: $paddle-height;\n\n transform: translate3d(0, 0, 0);\n border-radius: $switch-paddle-radius;\n background: $switch-paddle-background;\n transition: $switch-paddle-transition;\n content: '';\n }\n\n // Change the visual style when the switch is active\n input:checked ~ & {\n background: $switch-background-active;\n\n &::after {\n #{$global-left}: $paddle-active-offest;\n }\n }\n\n // indicate a disabled switch\n input:disabled ~ & {\n cursor: $switch-cursor-disabled;\n opacity: $switch-opacity-disabled;\n }\n\n input:focus ~ & {\n @include disable-mouse-outline;\n }\n}\n\n/// Adds base styles for active/inactive text inside a switch. Apply this to text elements inside the switch ``.\n@mixin switch-text {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/// Adds styles for the active state text within a switch.\n@mixin switch-text-active {\n #{$global-left}: 8%;\n display: none;\n\n input:checked + label > & {\n display: block;\n }\n}\n\n/// Adds styles for the inactive state text within a switch.\n@mixin switch-text-inactive {\n #{$global-right}: 15%;\n\n input:checked + label > & {\n display: none;\n }\n}\n\n/// Changes the size of a switch by modifying the size of the body and paddle. Apply this to a switch container.\n/// @param {Number} $font-size [1rem] - Font size of label text within the switch.\n/// @param {Number} $switch-height [2rem] - Height of the switch body.\n/// @param {Number} $paddle-offset [0.25rem] - Spacing between the switch paddle and the edge of the switch body.\n@mixin switch-size(\n $font-size: 1rem,\n $switch-height: 2rem,\n $paddle-offset: 0.25rem\n) {\n\n $switch-width: $switch-height * 2;\n $paddle-width: $switch-height - ($paddle-offset * 2);\n $paddle-height: $switch-height - ($paddle-offset * 2);\n $paddle-active-offest: $switch-width - $paddle-width - $paddle-offset;\n\n height: $switch-height;\n\n .switch-paddle {\n width: $switch-width;\n height: $switch-height;\n font-size: $font-size;\n }\n\n .switch-paddle::after {\n top: $paddle-offset;\n #{$global-left}: $paddle-offset;\n width: $paddle-width;\n height: $paddle-height;\n }\n\n input:checked ~ .switch-paddle::after {\n #{$global-left}: $paddle-active-offest;\n }\n}\n\n@mixin foundation-switch {\n // Container class\n .switch {\n @include switch-container;\n height: $switch-height;\n }\n\n // element\n .switch-input {\n @include switch-input;\n }\n\n // element\n .switch-paddle {\n @include switch-paddle;\n }\n\n // Base label text styles\n %switch-text {\n @include switch-text;\n }\n\n // Active label text styles\n .switch-active {\n @extend %switch-text;\n @include switch-text-active;\n }\n\n // Inactive label text styles\n .switch-inactive {\n @extend %switch-text;\n @include switch-text-inactive;\n }\n\n // Switch sizes\n .switch.tiny {\n @include switch-size(rem-calc(10), $switch-height-tiny, $switch-paddle-offset);\n }\n\n .switch.small {\n @include switch-size(rem-calc(12), $switch-height-small, $switch-paddle-offset);\n }\n\n .switch.large {\n @include switch-size(rem-calc(16), $switch-height-large, $switch-paddle-offset);\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n// sass-lint:disable no-qualifying-elements\n\n////\n/// @group table\n////\n\n/// Default color for table background.\n/// @type Color\n$table-background: $white !default;\n\n/// Default scale for darkening the striped table rows and the table border.\n/// @type Number\n$table-color-scale: 5% !default;\n\n/// Default style for table border.\n/// @type List\n$table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;\n\n/// Default padding for table.\n/// @type Number\n$table-padding: rem-calc(8 10 10) !default;\n\n/// Default scale for darkening the table rows on hover.\n/// @type Number\n$table-hover-scale: 2% !default;\n\n/// Default color of standard rows on hover.\n/// @type List\n$table-row-hover: darken($table-background, $table-hover-scale) !default;\n\n/// Default color of striped rows on hover.\n/// @type List\n$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;\n\n/// If `true`, tables are striped by default and an .unstriped class is created. If `false`, a .striped class is created.\n/// @type Boolean\n$table-is-striped: true !default;\n\n/// Default background color for striped rows.\n/// @type Color\n$table-striped-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default value for showing the stripe on rows of the tables, excluding the header and footer. If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or any other value, the table rows will have no striping.\n/// @type Keyword\n$table-stripe: even !default;\n\n/// Default color for header background.\n/// @type Color\n$table-head-background: smart-scale($table-background, $table-color-scale * 0.5) !default;\n\n/// Default color of header rows on hover.\n/// @type List\n$table-head-row-hover: darken($table-head-background, $table-hover-scale) !default;\n\n/// Default color for footer background.\n/// @type Color\n$table-foot-background: smart-scale($table-background, $table-color-scale) !default;\n\n/// Default color of footer rows on hover.\n/// @type List\n$table-foot-row-hover: darken($table-foot-background, $table-hover-scale) !default;\n\n/// Default font color for header.\n/// @type Color\n$table-head-font-color: $body-font-color !default;\n\n/// Default font color for footer.\n/// @type Color\n$table-foot-font-color: $body-font-color !default;\n\n/// Default value for showing the header when using stacked tables.\n/// @type Boolean\n$show-header-for-stacked: false !default;\n\n/// Breakpoint at which stacked table switches from mobile to desktop view.\n/// @type Breakpoint\n$table-stack-breakpoint: medium !default;\n\n@mixin -zf-table-stripe($stripe: $table-stripe) {\n tr {\n // If stripe is set to even, darken the even rows.\n @if $stripe == even {\n &:nth-child(even) {\n border-bottom: 0;\n background-color: $table-striped-background;\n }\n }\n\n // If stripe is set to odd, darken the odd rows.\n @else if $stripe == odd {\n &:nth-child(odd) {\n background-color: $table-striped-background;\n }\n }\n }\n}\n\n@mixin -zf-table-unstripe() {\n tr {\n border-bottom: $table-border;\n background-color: $table-background;\n }\n}\n\n@mixin -zf-table-children-styles($stripe: $table-stripe, $is-striped: $table-is-striped) {\n thead,\n tbody,\n tfoot {\n border: $table-border;\n background-color: $table-background;\n }\n\n // Caption\n caption {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n }\n\n // Table head\n thead {\n background: $table-head-background;\n color: $table-head-font-color;\n }\n\n // Table foot\n tfoot {\n background: $table-foot-background;\n color: $table-foot-font-color;\n }\n\n // Table head and foot\n thead,\n tfoot {\n // Rows within head and foot\n tr {\n background: transparent;\n }\n\n // Cells within head and foot\n th,\n td {\n padding: $table-padding;\n font-weight: $global-weight-bold;\n text-align: #{$global-left};\n }\n }\n\n // Table rows\n tbody {\n th,\n td {\n padding: $table-padding;\n }\n }\n\n // If tables are striped\n @if $is-striped == true {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n\n &.unstriped {\n tbody {\n @include -zf-table-unstripe();\n background-color: $table-background;\n }\n }\n }\n\n // If tables are not striped\n @else if $is-striped == false {\n tbody {\n @include -zf-table-unstripe();\n }\n\n &.striped {\n tbody {\n @include -zf-table-stripe($stripe);\n }\n }\n }\n}\n\n/// Adds the general styles for tables.\n/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.\n/// @param {Boolean} $nest [false] - Needed if you only want to apply this to a specific table.\n@mixin table(\n $stripe: $table-stripe,\n $nest: false\n) {\n border-collapse: collapse;\n width: 100%;\n margin-bottom: $global-margin;\n border-radius: $global-radius;\n\n @if $nest {\n @include -zf-table-children-styles($stripe);\n }\n @else {\n @at-root {\n @include -zf-table-children-styles($stripe);\n }\n }\n}\n\n/// Adds the ability to horizontally scroll the table when the content overflows horizontally.\n@mixin table-scroll {\n display: block;\n width: 100%;\n overflow-x: auto;\n}\n\n/// Slightly darkens the table rows on hover.\n@mixin table-hover {\n thead tr {\n //Darkens the table header rows on hover.\n &:hover {\n background-color: $table-head-row-hover;\n }\n }\n\n tfoot tr {\n //Darkens the table footer rows on hover.\n &:hover {\n background-color: $table-foot-row-hover;\n }\n }\n\n tbody tr {\n //Darkens the non-striped table rows on hover.\n &:hover {\n background-color: $table-row-hover;\n }\n }\n\n @if $table-is-striped == true {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &:not(.unstriped) tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &:not(.unstriped) tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n\n @else if $table-is-striped == false {\n // Darkens the even striped table rows.\n @if($table-stripe == even) {\n &.striped tr:nth-of-type(even):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n\n // Darkens the odd striped table rows.\n @else if($table-stripe == odd) {\n &.striped tr:nth-of-type(odd):hover {\n background-color: $table-row-stripe-hover;\n }\n }\n }\n}\n\n/// Adds styles for a stacked table. Useful for small-screen layouts.\n/// @param {Boolean} $header [$show-header-for-stacked] - Show the first th of header when stacked.\n@mixin table-stack($header: $show-header-for-stacked) {\n @if $header {\n thead {\n th {\n display: block;\n }\n }\n }\n @else {\n thead {\n display: none;\n }\n }\n\n tfoot {\n display: none;\n }\n\n tr,\n th,\n td {\n display: block;\n }\n\n td {\n border-top: 0;\n }\n}\n\n@mixin foundation-table($nest: false) {\n table {\n @include table($nest: $nest);\n }\n\n table.stack {\n @include breakpoint($table-stack-breakpoint down) {\n @include table-stack;\n }\n }\n\n table.scroll {\n @include table-scroll;\n }\n\n table.hover {\n @include table-hover;\n }\n\n .table-scroll {\n overflow-x: auto;\n\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n@import 'math';\n\n$contrast-warnings: true !default;\n\n/// Patch to fix issue #12080\n$primary-color: null !default;\n$secondary-color: null !default;\n$warning-color: null !default;\n$alert-color: null !default;\n$success-color: null !default;\n\n////\n/// @group functions\n////\n\n/// Checks the luminance of `$color`.\n///\n/// @param {Color} $color - Color to check the luminance of.\n///\n/// @returns {Number} The luminance of `$color`.\n@function color-luminance($color) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef\n $rgba: red($color), green($color), blue($color);\n $rgba2: ();\n\n @for $i from 1 through 3 {\n $rgb: nth($rgba, $i);\n $rgb: divide($rgb, 255);\n\n $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));\n\n $rgba2: append($rgba2, $rgb);\n }\n\n @return 0.2126 * nth($rgba2, 1) + 0.7152 * nth($rgba2, 2) + 0.0722 * nth($rgba2, 3);\n}\n\n/// Checks the contrast ratio of two colors.\n///\n/// @param {Color} $color1 - First color to compare.\n/// @param {Color} $color2 - Second color to compare.\n///\n/// @returns {Number} The contrast ratio of the compared colors.\n@function color-contrast($color1, $color2) {\n // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js\n // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef\n $luminance1: color-luminance($color1) + 0.05;\n $luminance2: color-luminance($color2) + 0.05;\n $ratio: divide($luminance1, $luminance2);\n\n @if $luminance2 > $luminance1 {\n $ratio: divide(1, $ratio);\n }\n\n $ratio: round($ratio * 10) * 0.1;\n\n @return $ratio;\n}\n\n/// Checks the luminance of `$base`, and returns the color from `$colors` (list of colors) that has the most contrast.\n///\n/// @param {Color} $base - Color to check luminance.\n/// @param {List} $colors [($white, $black)] - Colors to compare.\n/// @param {Number} $tolerance [$global-color-pick-contrast-tolerance] - Contrast tolerance.\n///\n/// @returns {Color} the color from `$colors` (list of colors) that has the most contrast.\n@function color-pick-contrast($base, $colors: ($white, $black), $tolerance: $global-color-pick-contrast-tolerance) {\n $contrast: color-contrast($base, nth($colors, 1));\n $best: nth($colors, 1);\n\n @for $i from 2 through length($colors) {\n $current-contrast: color-contrast($base, nth($colors, $i));\n @if ($current-contrast - $contrast > $tolerance) {\n $contrast: color-contrast($base, nth($colors, $i));\n $best: nth($colors, $i);\n }\n }\n\n @if ($contrast-warnings and $contrast < 3) {\n @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';\n }\n\n @return $best;\n}\n\n/// Scales a color to be darker if it's light, or lighter if it's dark. Use this function to tint a color appropriate to its lightness.\n///\n/// @param {Color} $color - Color to scale.\n/// @param {Percentage} $scale [5%] - Amount to scale up or down.\n/// @param {Percentage} $threshold [40%] - Threshold of lightness to check against.\n///\n/// @returns {Color} A scaled color.\n@function smart-scale($color, $scale: 5%, $threshold: 40%) {\n @if lightness($color) > $threshold {\n $scale: -$scale;\n }\n @return scale-color($color, $lightness: $scale);\n}\n\n/// Get color from foundation-palette\n///\n/// @param {key} color key from foundation-palette\n///\n/// @returns {Color} color from foundation-palette\n@function get-color($key) {\n @if map-has-key($foundation-palette, $key) {\n @return map-get($foundation-palette, $key);\n }\n @else {\n @error 'given $key is not available in $foundation-palette';\n }\n}\n\n/// Transfers the colors in the `$foundation-palette` map into variables, such as `$primary-color` and `$secondary-color`. Call this mixin below the Global section of your settings file to properly migrate your codebase.\n@mixin add-foundation-colors() {\n @if map-has-key($foundation-palette, primary) {\n $primary-color: map-get($foundation-palette, primary) !global;\n } @else {\n $primary-color: #1779ba !global;\n }\n @if map-has-key($foundation-palette, secondary) {\n $secondary-color: map-get($foundation-palette, secondary) !global;\n } @else {\n $secondary-color: #767676 !global;\n }\n @if map-has-key($foundation-palette, success) {\n $success-color: map-get($foundation-palette, success) !global;\n } @else {\n $success-color: #3adb76 !global;\n }\n @if map-has-key($foundation-palette, warning) {\n $warning-color: map-get($foundation-palette, warning) !global;\n } @else {\n $warning-color: #ffae00 !global;\n }\n @if map-has-key($foundation-palette, alert) {\n $alert-color: map-get($foundation-palette, alert) !global;\n } @else {\n $alert-color: #cc4b37 !global;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tabs\n////\n\n/// Default margin of the tab bar.\n/// @type Number\n$tab-margin: 0 !default;\n\n/// Default background color of a tab bar.\n/// @type Color\n$tab-background: $white !default;\n\n/// Font color of tab item.\n/// @type Color\n$tab-color: $primary-color !default;\n\n/// Active background color of a tab bar.\n/// @type Color\n$tab-background-active: $light-gray !default;\n\n/// Active font color of tab item.\n/// @type Color\n$tab-active-color: $primary-color !default;\n\n/// Font size of tab items.\n/// @type Number\n$tab-item-font-size: rem-calc(12) !default;\n\n/// Default background color on hover for items in a Menu.\n$tab-item-background-hover: $white !default;\n\n/// Default padding of a tab item.\n/// @type Number\n$tab-item-padding: 1.25rem 1.5rem !default;\n\n/// Default background color of tab content.\n/// @type Color\n$tab-content-background: $white !default;\n\n/// Default border color of tab content.\n/// @type Color\n$tab-content-border: $light-gray !default;\n\n/// Default text color of tab content.\n/// @type Color\n$tab-content-color: $body-font-color !default;\n\n/// Default padding for tab content.\n/// @type Number | List\n$tab-content-padding: 1rem !default;\n\n/// Adds styles for a tab container. Apply this to a ``.\n@mixin tabs-container (\n $margin: $tab-margin,\n $background: $tab-background,\n $border-color: $tab-content-border\n) {\n @include clearfix;\n margin: $margin;\n border: 1px solid $border-color;\n background: $background;\n list-style-type: none;\n}\n\n/// Augments a tab container to have vertical tabs. Use this in conjunction with `tabs-container()`.\n@mixin tabs-container-vertical {\n > li {\n display: block;\n float: none;\n width: auto;\n }\n}\n\n/// Adds styles for the links within a tab container. Apply this to the `` elements inside a tab container.\n@mixin tabs-title (\n $padding: $tab-item-padding,\n $font-size: $tab-item-font-size,\n $color: $tab-color,\n $color-active: $tab-active-color,\n $background-hover: $tab-item-background-hover,\n $background-active: $tab-background-active\n) {\n float: #{$global-left};\n\n > a {\n @include disable-mouse-outline;\n display: block;\n padding: $padding;\n font-size: $font-size;\n line-height: 1;\n color: $color;\n\n &:hover {\n background: $background-hover;\n color: scale-color($color, $lightness: -14%);\n }\n\n &:focus,\n &[aria-selected='true'] {\n background: $background-active;\n color: $color-active;\n }\n }\n}\n\n/// Adds styles for the wrapper that surrounds a tab group's content panes.\n@mixin tabs-content (\n $background: $tab-content-background,\n $color: $tab-content-color,\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-top: 0;\n background: $background;\n color: $color;\n transition: all 0.5s ease;\n}\n\n/// Augments a tab content container to have a vertical style, by shifting the border around. Use this in conjunction with `tabs-content()`.\n@mixin tabs-content-vertical (\n $border-color: $tab-content-border\n) {\n border: 1px solid $border-color;\n border-#{$global-left}: 0;\n}\n\n/// Adds styles for an individual tab content panel within the tab content container.\n@mixin tabs-panel (\n $padding: $tab-content-padding\n) {\n display: none;\n padding: $padding;\n\n &.is-active {\n display: block;\n }\n}\n\n@mixin foundation-tabs {\n .tabs {\n @include tabs-container;\n }\n\n // Vertical\n .tabs.vertical {\n @include tabs-container-vertical;\n }\n\n // Simple\n .tabs.simple {\n > li > a {\n padding: 0;\n\n &:hover {\n background: transparent;\n }\n }\n }\n\n // Primary color\n .tabs.primary {\n background: $primary-color;\n\n > li > a {\n color: color-pick-contrast($primary-color);\n\n &:hover,\n &:focus {\n background: smart-scale($primary-color);\n }\n }\n }\n\n .tabs-title {\n @include tabs-title;\n }\n\n .tabs-content {\n @include tabs-content;\n }\n\n .tabs-content.vertical {\n @include tabs-content-vertical;\n }\n\n .tabs-panel {\n @include tabs-panel;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group thumbnail\n////\n\n/// Border around thumbnail images.\n/// @type Border\n$thumbnail-border: 4px solid $white !default;\n\n/// Bottom margin for thumbnail images.\n/// @type Length\n$thumbnail-margin-bottom: $global-margin !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;\n\n/// Box shadow under thumbnail images.\n/// @type Shadow\n$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;\n\n/// Transition proprties for thumbnail images.\n/// @type Transition\n$thumbnail-transition: box-shadow 200ms ease-out !default;\n\n/// Default radius for thumbnail images.\n/// @type Number\n$thumbnail-radius: $global-radius !default;\n\n/// Adds thumbnail styles to an element.\n@mixin thumbnail {\n display: inline-block;\n max-width: 100%;\n margin-bottom: $thumbnail-margin-bottom;\n\n border: $thumbnail-border;\n border-radius: $thumbnail-radius;\n box-shadow: $thumbnail-shadow;\n\n line-height: 0;\n}\n\n@mixin thumbnail-link {\n transition: $thumbnail-transition;\n\n &:hover,\n &:focus {\n box-shadow: $thumbnail-shadow-hover;\n }\n\n image {\n box-shadow: none;\n }\n}\n\n@mixin foundation-thumbnail {\n .thumbnail {\n @include thumbnail;\n }\n\n a.thumbnail {\n @include thumbnail-link;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group title-bar\n////\n\n/// Background color of a title bar.\n/// @type Color\n$titlebar-background: $black !default;\n\n/// Color of text inside a title bar.\n/// @type Color\n$titlebar-color: $white !default;\n\n/// Padding inside a title bar.\n/// @type Length\n$titlebar-padding: 0.5rem !default;\n\n/// Font weight of text inside a title bar.\n/// @type Weight\n$titlebar-text-font-weight: bold !default;\n\n/// Color of menu icons inside a title bar.\n/// @type Color\n$titlebar-icon-color: $white !default;\n\n/// Color of menu icons inside a title bar on hover.\n/// @type Color\n$titlebar-icon-color-hover: $medium-gray !default;\n\n/// Spacing between the menu icon and text inside a title bar.\n/// @type Length\n$titlebar-icon-spacing: 0.25rem !default;\n\n@mixin foundation-title-bar {\n .title-bar {\n padding: $titlebar-padding;\n background: $titlebar-background;\n color: $titlebar-color;\n\n @if $global-flexbox {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n .menu-icon {\n margin-#{$global-left}: $titlebar-icon-spacing;\n margin-#{$global-right}: $titlebar-icon-spacing;\n }\n }\n\n @if $global-flexbox {\n .title-bar-left,\n .title-bar-right {\n flex: 1 1 0px; // sass-lint:disable-line zero-unit\n }\n\n .title-bar-right {\n text-align: right;\n }\n }\n @else {\n .title-bar-left {\n float: left;\n }\n\n .title-bar-right {\n float: right;\n text-align: right;\n }\n }\n\n .title-bar-title {\n display: inline-block;\n vertical-align: middle;\n font-weight: $titlebar-text-font-weight;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group tooltip\n////\n\n/// Default cursor of the defined term.\n/// @type Keyword\n$has-tip-cursor: help !default;\n\n/// Default font weight of the defined term.\n/// @type Keyword | Number\n$has-tip-font-weight: $global-weight-bold !default;\n\n/// Default border bottom of the defined term.\n/// @type List\n$has-tip-border-bottom: dotted 1px $dark-gray !default;\n\n/// Default color of the tooltip background.\n/// @type Color\n$tooltip-background-color: $black !default;\n\n/// Default color of the tooltip font.\n/// @type Color\n$tooltip-color: $white !default;\n\n/// Default padding of the tooltip background.\n/// @type Number\n$tooltip-padding: 0.75rem !default;\n\n/// Default max width for tooltips.\n/// @type Number\n$tooltip-max-width: 10rem !default;\n\n/// Default font size of the tooltip text. By default, we recommend a smaller font size than the body copy.\n/// @type Number\n$tooltip-font-size: $small-font-size !default;\n\n/// Default pip width for tooltips.\n/// @type Number\n$tooltip-pip-width: 0.75rem !default;\n\n/// Default pip height for tooltips. This is helpful for calculating the distance of the tooltip from the tooltip word.\n/// @type Number\n$tooltip-pip-height: $tooltip-pip-width * 0.866 !default;\n\n/// Default radius for tooltips.\n/// @type Number\n$tooltip-radius: $global-radius !default;\n\n@mixin has-tip {\n position: relative;\n display: inline-block;\n\n border-bottom: $has-tip-border-bottom;\n font-weight: $has-tip-font-weight;\n cursor: $has-tip-cursor;\n}\n\n@mixin tooltip {\n position: absolute;\n top: calc(100% + #{$tooltip-pip-height});\n z-index: 1200;\n\n max-width: $tooltip-max-width;\n padding: $tooltip-padding;\n\n border-radius: $tooltip-radius;\n background-color: $tooltip-background-color;\n font-size: $tooltip-font-size;\n color: $tooltip-color;\n\n &::before {\n position: absolute;\n }\n\n &.bottom {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, up);\n bottom: 100%;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.top {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, down);\n top: 100%;\n bottom: auto;\n }\n\n &.align-center::before {\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.left {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, right);\n left: 100%;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.right {\n &::before {\n @include css-triangle($tooltip-pip-width, $tooltip-background-color, left);\n right: 100%;\n left: auto;\n }\n\n &.align-center::before {\n bottom: auto;\n top: 50%;\n transform: translateY(-50%);\n }\n }\n\n &.align-top::before {\n bottom: auto;\n top: 10%;\n }\n\n &.align-bottom::before {\n bottom: 10%;\n top: auto;\n }\n\n &.align-left::before {\n left: 10%;\n right: auto;\n }\n\n &.align-right::before {\n left: auto;\n right: 10%;\n }\n}\n\n@mixin foundation-tooltip {\n .has-tip {\n @include has-tip;\n }\n\n .tooltip {\n @include tooltip;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group top-bar\n////\n\n/// Padding for the top bar.\n/// @type Number\n$topbar-padding: 0.5rem !default;\n\n/// Background color for the top bar. This color also cascades to menus within the top bar.\n/// @type Color\n$topbar-background: $light-gray !default;\n\n/// Background color submenus within the top bar. Usefull if $topbar-background is transparent.\n/// @type Color\n$topbar-submenu-background: $topbar-background !default;\n\n/// Spacing for the top bar title.\n/// @type Number\n$topbar-title-spacing: 0.5rem 1rem 0.5rem 0 !default;\n\n/// Maximum width of `` elements inside the top bar.\n/// @type Number\n$topbar-input-width: 200px !default;\n\n/// Breakpoint at which top bar switches from mobile to desktop view.\n/// @type Breakpoint\n$topbar-unstack-breakpoint: medium !default;\n\n/// Adds styles for a top bar container.\n@mixin top-bar-container {\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-between;\n align-items: center;\n }\n @else {\n @include clearfix;\n }\n\n padding: $topbar-padding;\n\n &,\n ul {\n background-color: $topbar-background;\n }\n\n // Check if $topbar-background is differnt from $topbar-background-submenu\n @if ($topbar-background != $topbar-submenu-background) {\n ul ul {\n background-color: $topbar-submenu-background;\n }\n }\n\n // Restrain width of inputs by default to make them easier to arrange\n input {\n max-width: $topbar-input-width;\n margin-#{$global-right}: 1rem;\n }\n\n // The above styles shouldn't apply to input group fields\n .input-group-field {\n width: 100%;\n margin-#{$global-right}: 0;\n }\n\n input.button { // sass-lint:disable-line no-qualifying-elements\n width: auto;\n }\n}\n\n/// Makes sections of a top bar stack on top of each other.\n@mixin top-bar-stacked {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 100%;\n max-width: 100%;\n }\n }\n @else {\n // Sub-sections\n .top-bar-left,\n .top-bar-right {\n width: 100%;\n }\n }\n}\n\n/// Undoes the CSS applied by the `top-bar-stacked()` mixin.\n@mixin top-bar-unstack {\n @if $global-flexbox {\n flex-wrap: nowrap;\n\n .top-bar-left {\n flex: 1 1 auto;\n margin-right: auto;\n }\n\n .top-bar-right {\n flex: 0 1 auto;\n margin-left: auto;\n }\n }\n @else {\n .top-bar-left,\n .top-bar-right {\n width: auto;\n }\n }\n}\n\n@mixin foundation-top-bar {\n // Top bar container\n .top-bar {\n @include top-bar-container;\n\n // Stack on small screens by default\n @include top-bar-stacked;\n\n @include breakpoint($topbar-unstack-breakpoint) {\n @include top-bar-unstack;\n }\n\n // Generate classes for stacking on each screen size (defined in $breakpoint-classes)\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n &.stacked-for-#{$size} {\n @include breakpoint($size down) {\n @include top-bar-stacked;\n }\n }\n }\n }\n }\n\n // Sub-sections\n @if $global-flexbox {\n .top-bar-title {\n flex: 0 0 auto;\n margin: $topbar-title-spacing;\n }\n\n .top-bar-left,\n .top-bar-right {\n flex: 0 0 auto;\n }\n }\n @else {\n .top-bar-title {\n display: inline-block;\n float: left;\n padding: $topbar-title-spacing;\n\n .menu-icon {\n bottom: 2px;\n }\n }\n\n .top-bar-left {\n float: left;\n }\n\n .top-bar-right {\n float: right;\n }\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n/// Hide an element by default, only displaying it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for($size) {\n $size: map-get($breakpoints, $size);\n // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).\n // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.\n // See https://github.com/foundation/foundation-sites/issues/11313\n $size: -zf-bp-to-em($size) - 0.00125;\n\n @include breakpoint($size down) {\n display: none !important;\n }\n}\n\n/// Hide an element by default, only displaying it within a certain breakpoint.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin show-for-only($size) {\n $lower-bound-size: map-get($breakpoints, $size);\n $upper-bound-size: -zf-map-next($breakpoints, $size);\n\n // more often than not this will be correct, just one time round the loop it won't so set in scope here\n $lower-bound: -zf-bp-to-em($lower-bound-size) - 0.00125;\n // test actual lower-bound-size, if 0 set it to 0em\n @if strip-unit($lower-bound-size) == 0 {\n $lower-bound: -zf-bp-to-em($lower-bound-size);\n }\n\n @if $upper-bound-size == null {\n @media screen and (max-width: $lower-bound) {\n display: none !important;\n }\n }\n @else {\n $upper-bound: -zf-bp-to-em($upper-bound-size);\n\n @media screen and (max-width: $lower-bound), screen and (min-width: $upper-bound) {\n display: none !important;\n }\n }\n}\n\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for($size) {\n @include breakpoint($size) {\n display: none !important;\n }\n}\n\n/// Show an element by default, and hide it above a certain screen size.\n/// @param {Keyword} $size - Breakpoint to use. **Must be a breakpoint defined in `$breakpoints`.**\n@mixin hide-for-only($size) {\n @include breakpoint($size only) {\n display: none !important;\n }\n}\n\n@mixin foundation-visibility-classes {\n // Basic hiding classes\n .hide {\n display: none !important;\n }\n\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n\n // Responsive visibility classes\n @each $size in $breakpoint-classes {\n @if $size != $-zf-zero-breakpoint {\n .hide-for-#{$size} {\n @include hide-for($size);\n }\n\n .show-for-#{$size} {\n @include show-for($size);\n }\n }\n\n .hide-for-#{$size}-only {\n @include hide-for-only($size);\n }\n\n .show-for-#{$size}-only {\n @include show-for-only($size);\n }\n }\n\n // Screen reader visibility classes\n // Need a \"hide-for-sr\" class? Add aria-hidden='true' to the element\n .show-for-sr,\n .show-on-focus {\n @include element-invisible;\n }\n\n // Only display the element when it's focused\n .show-on-focus {\n &:active,\n &:focus {\n @include element-invisible-off;\n }\n }\n\n // Landscape and portrait visibility\n .show-for-landscape,\n .hide-for-portrait {\n display: block !important;\n\n @include breakpoint(landscape) {\n display: block !important;\n }\n\n @include breakpoint(portrait) {\n display: none !important;\n }\n }\n\n .hide-for-landscape,\n .show-for-portrait {\n display: none !important;\n\n @include breakpoint(landscape) {\n display: none !important;\n }\n\n @include breakpoint(portrait) {\n display: block !important;\n }\n }\n\n // Dark Mode Visibility\n .show-for-dark-mode {\n display: none;\n }\n .hide-for-dark-mode {\n display: block;\n }\n @media screen and (prefers-color-scheme: dark) {\n .show-for-dark-mode {\n display: block !important;\n }\n .hide-for-dark-mode {\n display: none !important;\n }\n }\n\n // IE10+ Visibility\n .show-for-ie {\n display: none;\n }\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n .show-for-ie {\n display: block !important;\n }\n .hide-for-ie {\n display: none !important;\n }\n }\n\n // Sticky Visibility\n .show-for-sticky {\n display: none;\n }\n .is-stuck .show-for-sticky {\n display: block;\n }\n .is-stuck .hide-for-sticky {\n display: none;\n }\n}\n","// Foundation for Sites\n// https://get.foundation\n// Licensed under MIT Open Source\n\n////\n/// @group float\n////\n\n@mixin foundation-float-classes {\n .float-left {\n float: left !important;\n }\n\n .float-right {\n float: right !important;\n }\n\n .float-center {\n display: block;\n margin-right: auto;\n margin-left: auto;\n }\n\n .clearfix {\n @include clearfix;\n }\n}\n","/* -------------------------------------------------------------\n Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library\n By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets\n List of CSS3 Sass Mixins File to be @imported and @included as you need\n The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER\n ENDING css files\n note: All CSS3 Properties are being supported by Safari 5\n more info: http://www.findmebyip.com/litmus/#css3-properties\n------------------------------------------------------------- */\n\n////\n/// @author Matthieu Aussaguel\n/// @group sass-css3-mixins\n////\n\n/// Adds a browser prefix to the property\n/// @param {*} $property Property\n/// @param {*} $value Value\n@mixin css3-prefix($property, $value) {\n -webkit-#{$property}: #{$value};\n -khtml-#{$property}: #{$value};\n -moz-#{$property}: #{$value};\n -ms-#{$property}: #{$value};\n -o-#{$property}: #{$value};\n #{$property}: #{$value};\n }\n \n /// Background Gradient\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(top, $startColor, $endColor);\n background-image: -moz-linear-gradient(top, $startColor, $endColor);\n background-image: -ms-linear-gradient(top, $startColor, $endColor);\n background-image: -o-linear-gradient(top, $startColor, $endColor);\n background-image: linear-gradient(top, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}');\n }\n \n /// Background Horizontal\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Color} $endColor [#999999] - End Color\n @mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) {\n background-color: $startColor;\n background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor));\n background-image: -webkit-linear-gradient(left, $startColor, $endColor);\n background-image: -moz-linear-gradient(left, $startColor, $endColor);\n background-image: -ms-linear-gradient(left, $startColor, $endColor);\n background-image: -o-linear-gradient(left, $startColor, $endColor);\n background-image: linear-gradient(left, $startColor, $endColor);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1');\n }\n\n \n/// Background Gradient\n/// @param {Color} $startColor [#3C3C3C] - Start Color\n/// @param {Color} $endColor [#999999] - End Color\n@mixin background-diagonal-gradient($deg: 90deg, $startColor: #3C3C3C, $startPoint: 50%, $endColor: #999999, $endPoint: 50%) {\n background-image: -webkit-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -moz-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -ms-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: -o-linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n background-image: linear-gradient($deg, $startColor $startPoint, $endColor $endPoint);\n}\n \n /// Background Radial\n /// @param {Color} $startColor [#3C3C3C] - Start Color\n /// @param {Percentage} $startPos [0%] - Start position\n /// @param {Color} $endColor [#999999] - End Color\n /// @param {Percentage} $endPos [100%] - End position\n @mixin background-radial($startColor: #FFFFFF, $startPos: 0%, $endColor: #000000, $endPos:100%) {\n background: -moz-radial-gradient(center, ellipse cover, $startColor $startPos, $endColor $endPos);\n background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop($startPos,$startColor), color-stop($endPos,$endColor));\n background: -webkit-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -o-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: -ms-radial-gradient(center, ellipse cover, $startColor $startPos,$endColor $endPos);\n background: radial-gradient(ellipse at center, $startColor $startPos,$endColor $endPos);\n }\n \n /// Background Size\n /// @param {Size} $width [100%] - Width\n /// @param {Size} $width [$width] - Height\n /// @require {mixin} css3-prefix\n @mixin background-size($width: 100%, $height: $width) {\n @if type-of($width) == 'number' and $height != null {\n @include css3-prefix('background-size', $width $height);\n } @else {\n @include css3-prefix('background-size', $width);\n }\n }\n \n /// Background Color Opacity\n /// @param {Color} $color [100%] - Color\n /// @param {Double} $opacity [0.85] - Opacity\n @mixin background-opacity($color: #000, $opacity: 0.85) {\n background: $color;\n background: rgba($color, $opacity);\n }\n\n @mixin color-opacity($color: #000, $opacity: 0.85) {\n color: $color;\n color: rgba($color, $opacity);\n}\n \n /// Border Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin border-radius($radius: 5px) {\n @include css3-prefix('border-radius', $radius);\n }\n \n /// Border Radius Separate\n /// @param {Size} $topLeftRadius [5px] - Top Left\n /// @param {Size} $topRightRadius [5px] - Top Right\n /// @param {Size} $bottomLeftRadius [5px] - Bottom Left\n /// @param {Size} $bottomRightRadius [5px] - Bottom Right\n @mixin border-radius-separate($topLeftRadius: 5px, $topRightRadius: 5px, $bottomLeftRadius: 5px, $bottomRightRadius: 5px) {\n -webkit-border-top-left-radius: $topLeftRadius;\n -webkit-border-top-right-radius: $topRightRadius;\n -webkit-border-bottom-right-radius: $bottomRightRadius;\n -webkit-border-bottom-left-radius: $bottomLeftRadius;\n \n -moz-border-radius-topleft: $topLeftRadius;\n -moz-border-radius-topright: $topRightRadius;\n -moz-border-radius-bottomright: $bottomRightRadius;\n -moz-border-radius-bottomleft: $bottomLeftRadius;\n \n border-top-left-radius: $topLeftRadius;\n border-top-right-radius: $topRightRadius;\n border-bottom-right-radius: $bottomRightRadius;\n border-bottom-left-radius: $bottomLeftRadius;\n }\n \n /// Box\n /// @param {*} $orient [horizontal] - Orientation\n /// @param {*} $pack [center] - Pack\n /// @param {*} $align [center] - Align\n /// @require {mixin} css3-prefix\n @mixin box($orient: horizontal, $pack: center, $align: center) {\n display: -webkit-box;\n display: -moz-box;\n display: box;\n \n @include css3-prefix('box-orient', $orient);\n @include css3-prefix('box-pack', $pack);\n @include css3-prefix('box-align', $align);\n }\n \n /// Box RGBA\n /// @param {Integer} $r [60] - Red\n /// @param {Integer} $g [3] - Green\n /// @param {Integer} $b [12] - Blue\n /// @param {Double} $opacity [0.23] - Opacity\n /// @param {Color} $color [#3C3C3C] - Color\n @mixin box-rgba($r: 60, $g: 3, $b: 12, $opacity: 0.23, $color: #3C3C3C) {\n background-color: transparent;\n background-color: rgba($r, $g, $b, $opacity);\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color}',endColorstr='#{$color}');\n zoom: 1;\n }\n \n /// Box Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [5px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n /// @param {Boolean} $inset - Inset\n @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $spread: 0px, $color: rgba(0,0,0,.4), $inset: \"\") {\n @if ($inset != \"\") {\n @include css3-prefix('box-shadow', $inset $x $y $blur $spread $color);\n } @else {\n @include css3-prefix('box-shadow', $x $y $blur $spread $color);\n }\n }\n \n /// Box Sizing\n /// @param {*} $type [border-box] - Type\n /// @require {mixin} css3-prefix\n @mixin box-sizing($type: border-box) {\n @include css3-prefix('box-sizing', $type);\n }\n \n /// Columns\n /// @param {Integer} $count [3] - Count\n /// @param {Integer} $gap [10] - Gap\n /// @require {mixin} css3-prefix\n @mixin columns($count: 3, $gap: 10) {\n @include css3-prefix('column-count', $count);\n @include css3-prefix('column-gap', $gap);\n }\n \n /// Double Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} css3-prefix\n /// @require {mixin} border-radius\n @mixin double-borders($colorOne: #3C3C3C, $colorTwo: #999999, $radius: 0) {\n border: 1px solid $colorOne;\n @include css3-prefix('box-shadow', 0 0 0 1px $colorTwo);\n @include border-radius( $radius );\n }\n \n /// Flex\n /// @param {Integer} $value [1] - Value\n /// @require {mixin} css3-prefix\n @mixin flex($value: 1) {\n @include css3-prefix('box-flex', $value);\n }\n \n /// Flip\n /// @param {Double} $scaleX [-1] - ScaleX\n /// @require {mixin} css3-prefix\n @mixin flip($scaleX: -1) {\n @include css3-prefix('transform', scaleX($scaleX));\n filter: FlipH;\n -ms-filter: \"FlipH\";\n }\n \n /// Font Face\n /// @param {Font} $fontFamily [myFont] - Font Family\n /// @param {String} $eotFileSrc ['myFont.eot'] - Eot File Source\n /// @param {String} $woffFileSrc ['myFont.woff'] - Woff File Source\n /// @param {String} $ttfFileSrc ['myFont.ttf'] - Ttf File Source\n /// @param {String} $svgFileSrc ['myFont.svg'] - Svg File Source\n @mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') {\n font-family: $fontFamily;\n src: url($eotFileSrc) format('eot'),\n url($woffFileSrc) format('woff'),\n url($ttfFileSrc) format('truetype'),\n url($svgFileSrc + $svgFontID) format('svg');\n }\n \n /// Opacity\n /// @param {Double} $opacity [0.5] - Opacity\n /// @require {mixin} css3-prefix\n @mixin opacity($opacity: 0.5) {\n $opacityMultiplied: ($opacity * 100);\n \n filter: alpha(opacity=$opacityMultiplied);\n -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=\" + $opacityMultiplied + \")\";\n @include css3-prefix('opacity', $opacity);\n }\n \n /// Outline Radius\n /// @param {Size} $radius [5px] - Radius\n /// @require {mixin} css3-prefix\n @mixin outline-radius($radius: 5px) {\n @include css3-prefix('outline-radius', $radius);\n }\n \n /// Resize\n /// @param {*} $directoin [both] - Direction\n /// @require {mixin} css3-prefix\n @mixin resize($direction: both) {\n @include css3-prefix('resize', $direction);\n }\n \n /// Rotate\n ///\n /// CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html\n /// @param {Double} $deg [0] - Degree\n /// @param {Double} $m11 [0] - M11\n /// @param {Double} $m12 [0] - M12\n /// @param {Double} $m21 [0] - M21\n /// @param {Double} $m22 [0] - M22\n /// @require {mixin} css3-prefix\n @mixin rotate($deg: 0, $m11: 0, $m12: 0, $m21: 0, $m22: 0) {\n @include css3-prefix('transform', rotate($deg + deg));\n filter: progid:DXImageTransform.Microsoft.Matrix(\n M11=#{$m11}, M12=#{$m12}, M21=#{$m21}, M22=#{$m22}, sizingMethod='auto expand');\n zoom: 1;\n }\n \n /// Text Shadow\n /// @param {Size} $x [2px] - X\n /// @param {Size} $y [2px] - Y\n /// @param {Size} $blur [2px] - Blur\n /// @param {Color} $color [rgba(0,0,0,.4)] - Color\n \n @mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {\n text-shadow: $x $y $blur $color;\n }\n \n /// Transform\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform($params) {\n @include css3-prefix('transform', $params);\n }\n \n /// Transform-Origin\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-origin($params) {\n @include css3-prefix('transform-origin', $params);\n }\n \n // Transform-Style\n /// @param {List} $params - Params\n /// @require {mixin} css3-prefix\n @mixin transform-style($style: preserve-3d) {\n @include css3-prefix('transform-style', $style);\n }\n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition($properties...) {\n @if length($properties) >= 1 {\n @include css3-prefix('transition', $properties);\n }\n @else {\n @include css3-prefix('transition', \"all 0.2s ease-in-out 0s\");\n }\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin transition-delay($time) {\n @include css3-prefix('transition-delay', $time);\n }\n \n \n /// Transition\n /// @param {List} $properties - Properties\n /// @require {mixin} css3-prefix\n @mixin placeholder-color($color) {\n &::-webkit-input-placeholder { color: #{$color}; }\n &::-moz-placeholder { color: #{$color}; }\n &:-ms-input-placeholder { color: #{$color}; }\n &:-moz-placeholder { color: #{$color};}\n }\n \n /// Triple Borders\n /// @param {Color} $colorOne [#3C3C3C] - Color One\n /// @param {Color} $colorTwo [#999999] - Color Two\n /// @param {Color} $colorThree [#000000] - Color Three\n /// @param {Size} $radius [0] - Radius\n /// @require {mixin} border-radius\n /// @require {mixin} css3-prefix\n @mixin triple-borders($colorOne: #3C3C3C, $colorTwo: #999999, $colorThree: #000000, $radius: 0) {\n border: 1px solid $colorOne;\n \n @include border-radius($radius);\n \n @include css3-prefix('box-shadow', \"0 0 0 1px #{$colorTwo}, 0 0 0 2px #{$colorThree}\");\n }\n \n /// Keyframes\n /// @param {*} $animation-name - Animation name\n /// @content [Animation css]\n @mixin animation($animate...) {\n $max: length($animate);\n $animations: '';\n \n @for $i from 1 through $max {\n $animations: #{$animations + nth($animate, $i)};\n \n @if $i < $max {\n $animations: #{$animations + \", \"};\n }\n }\n -webkit-animation: $animations;\n -moz-animation: $animations;\n -o-animation: $animations;\n animation: $animations;\n }\n \n @mixin keyframes($animationName) {\n @-webkit-keyframes #{$animationName} {\n @content;\n }\n @-moz-keyframes #{$animationName} {\n @content;\n }\n @-o-keyframes #{$animationName} {\n @content;\n }\n @keyframes #{$animationName} {\n @content;\n }\n } \n\n\n /// Box Shadow\n/// @param {list} $string - shadows list\n\n@mixin multi-box-shadow ($string) {\n -webkit-box-shadow: $string;\n -moz-box-shadow: $string;\n box-shadow: $string;\n}","html.lb-disable-scrolling {\n\toverflow: hidden;\n\t/* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */\n\tposition: fixed;\n\theight: 100vh;\n\twidth: 100vw;\n}\n\n.lightboxOverlay {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground-color: black;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);\n\topacity: 0.8;\n\tdisplay: none;\n}\n\n.lightbox {\n\tposition: fixed;\n\tleft: 0;\n\twidth: 100%;\n\tz-index: 10000;\n\ttext-align: center;\n\tline-height: 0;\n\tfont-weight: normal;\n\ttop: 50%!important;\n\n\t@include transform('translate(0, -50%)');\n}\n\n.lightbox .lb-image {\n\tdisplay: block;\n\theight: auto;\n\tmax-width: inherit;\n\tmax-height: none;\n\tborder-radius: 3px;\n\t/* Image border */\n\tborder: 4px solid white;\n}\n\n.lightbox a img {\n\tborder: none;\n}\n\n.lb-outerContainer {\n\tposition: relative;\n\t*zoom: 1;\n\twidth: 250px;\n\theight: 250px;\n\tmargin: 0 auto;\n\tborder-radius: 4px;\n\t/* Background color behind image.\n\t This is visible during transitions. */\n\tbackground-color: white;\n}\n\n.lb-outerContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-loader {\n\tposition: absolute;\n\ttop: 43%;\n\tleft: 0;\n\theight: 25%;\n\twidth: 100%;\n\ttext-align: center;\n\tline-height: 0;\n}\n\n.lb-cancel {\n\tdisplay: block;\n\twidth: 32px;\n\theight: 32px;\n\tmargin: 0 auto;\n\t// background: url(../img/slider/loading.gif) no-repeat;\n}\n\n.lb-nav {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\theight: 100%;\n\twidth: 100%;\n\tz-index: 10;\n}\n\n.lb-container>.nav {\n\tleft: 0;\n}\n\n.lb-nav a {\n\toutline: none;\n\tbackground-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');\n}\n\n.lb-prev,\n.lb-next {\n\theight: 100%;\n\tcursor: pointer;\n\tdisplay: block;\n}\n\n.lb-nav a.lb-prev {\n\twidth: 34%;\n\tleft: 0;\n\tfloat: left;\n\tbackground: url(../img/slider/prev.png) left 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-prev:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-nav a.lb-next {\n\twidth: 64%;\n\tright: 0;\n\tfloat: right;\n\tbackground: url(../img/slider/next.png) right 48% no-repeat;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);\n\topacity: 0;\n\t-webkit-transition: opacity 0.6s;\n\t-moz-transition: opacity 0.6s;\n\t-o-transition: opacity 0.6s;\n\ttransition: opacity 0.6s;\n}\n\n.lb-nav a.lb-next:hover {\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}\n\n.lb-dataContainer {\n\tmargin: 0 auto;\n\tpadding-top: 5px;\n\t*zoom: 1;\n\twidth: 100%;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tdisplay: none!important;\n}\n\n.lb-dataContainer:after {\n\tcontent: \"\";\n\tdisplay: table;\n\tclear: both;\n}\n\n.lb-data {\n\tpadding: 0 4px;\n\tcolor: #ccc;\n}\n\n.lb-data .lb-details {\n\twidth: 85%;\n\tfloat: left;\n\ttext-align: left;\n\tline-height: 1.1em;\n}\n\n.lb-data .lb-caption {\n\tfont-size: 13px;\n\tfont-weight: bold;\n\tline-height: 1em;\n}\n\n.lb-data .lb-caption a {\n\tcolor: #4ae;\n}\n\n.lb-data .lb-number {\n\tdisplay: block;\n\tclear: left;\n\tpadding-bottom: 1em;\n\tfont-size: 12px;\n\tcolor: #999999;\n}\n\n.lb-data .lb-close {\n\tdisplay: block;\n\tfloat: right;\n\twidth: 30px;\n\theight: 30px;\n\tbackground: url(../img/slider/close.png) top right no-repeat;\n\ttext-align: right;\n\toutline: none;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);\n\topacity: 0.7;\n\t-webkit-transition: opacity 0.2s;\n\t-moz-transition: opacity 0.2s;\n\t-o-transition: opacity 0.2s;\n\ttransition: opacity 0.2s;\n}\n\n.lb-data .lb-close:hover {\n\tcursor: pointer;\n\tfilter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);\n\topacity: 1;\n}",".select2-container {\n box-sizing: border-box;\n\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n\n @import \"single\";\n @import \"multiple\";\n}\n\n@import \"dropdown\";\n\n.select2-close-mask {\n border: 0;\n margin: 0;\n padding: 0;\n display: block;\n position: fixed;\n left: 0;\n top: 0;\n min-height: 100%;\n min-width: 100%;\n height: auto;\n width: auto;\n opacity: 0;\n z-index: 99;\n\n // styles required for IE to work\n\n background-color: #fff;\n filter: alpha(opacity=0);\n}\n\n.select2-hidden-accessible {\n border: 0 !important;\n clip: rect(0 0 0 0) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n}\n\n@import \"theme/default/layout\";\n@import \"theme/classic/layout\";\n",".select2-selection--single {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n height: 28px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: block;\n padding-left: 8px;\n padding-right: 20px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .select2-selection__clear {\n position: relative;\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__rendered {\n padding-right: 8px;\n padding-left: 20px;\n }\n }\n}\n",".select2-selection--multiple {\n box-sizing: border-box;\n\n cursor: pointer;\n display: block;\n\n min-height: 32px;\n\n user-select: none;\n -webkit-user-select: none;\n\n .select2-selection__rendered {\n display: inline-block;\n overflow: hidden;\n padding-left: 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n.select2-search--inline {\n float: left;\n\n .select2-search__field {\n box-sizing: border-box;\n border: none;\n font-size: 100%;\n margin-top: 5px;\n padding: 0;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n}\n",".select2-dropdown {\n background-color: white;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n\n box-sizing: border-box;\n\n display: block;\n\n position: absolute;\n left: -100000px;\n\n width: 100%;\n\n z-index: 1051;\n}\n\n.select2-results {\n display: block;\n}\n\n.select2-results__options {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.select2-results__option {\n padding: 6px;\n\n user-select: none;\n -webkit-user-select: none;\n\n &[aria-selected] {\n cursor: pointer;\n }\n}\n\n.select2-container--open .select2-dropdown {\n left: 0;\n}\n\n.select2-container--open .select2-dropdown--above {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.select2-container--open .select2-dropdown--below {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.select2-search--dropdown {\n display: block;\n padding: 4px;\n\n .select2-search__field {\n padding: 4px;\n width: 100%;\n box-sizing: border-box;\n\n &::-webkit-search-cancel-button {\n -webkit-appearance: none;\n }\n }\n\n &.select2-search--hide {\n display: none;\n }\n}\n",".select2-container--default {\n @import \"single\";\n @import \"multiple\";\n\n &.select2-container--open.select2-container--above {\n .select2-selection--single, .select2-selection--multiple {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--open.select2-container--below {\n .select2-selection--single, .select2-selection--multiple {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid #aaa;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n background: transparent;\n border: none;\n outline: 0;\n box-shadow: none;\n -webkit-appearance: textfield;\n }\n }\n\n .select2-results > .select2-results__options {\n max-height: 200px;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: #999;\n }\n\n &[aria-selected=true] {\n background-color: #ddd;\n }\n\n .select2-results__option {\n padding-left: 1em;\n\n .select2-results__group {\n padding-left: 0;\n }\n\n .select2-results__option {\n margin-left: -1em;\n padding-left: 2em;\n\n .select2-results__option {\n margin-left: -2em;\n padding-left: 3em;\n\n .select2-results__option {\n margin-left: -3em;\n padding-left: 4em;\n\n .select2-results__option {\n margin-left: -4em;\n padding-left: 5em;\n\n .select2-results__option {\n margin-left: -5em;\n padding-left: 6em;\n }\n }\n }\n }\n }\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: #5897fb;\n color: white;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n}\n",".select2-selection--single {\n background-color: #fff;\n border: 1px solid #aaa;\n border-radius: 4px;\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--single {\n background-color: #eee;\n cursor: default;\n\n .select2-selection__clear {\n display: none;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n .select2-selection__arrow {\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n}\n",".select2-selection--multiple {\n background-color: white;\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: text;\n\n .select2-selection__rendered {\n box-sizing: border-box;\n list-style: none;\n margin: 0;\n padding: 0 5px;\n width: 100%;\n\n li {\n list-style: none;\n }\n }\n\n .select2-selection__placeholder {\n color: #999;\n\n margin-top: 5px;\n\n float: left;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-top: 5px;\n margin-right: 10px;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid #aaa;\n border-radius: 4px;\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: #999;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: #333;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice, .select2-selection__placeholder, .select2-search--inline {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--focus {\n .select2-selection--multiple {\n border: solid black 1px;\n outline: 0;\n }\n}\n\n&.select2-container--disabled {\n .select2-selection--multiple {\n background-color: #eee;\n cursor: default;\n }\n\n .select2-selection__choice__remove {\n display: none;\n }\n}\n","@import \"defaults\";\n@import \"../../mixins/gradients\";\n\n.select2-container--classic {\n @import \"single\";\n @import \"multiple\";\n\n .select2-search--dropdown {\n .select2-search__field {\n border: 1px solid $border-color;\n outline: 0;\n }\n }\n\n .select2-search--inline {\n .select2-search__field {\n outline: 0;\n box-shadow: none;\n }\n }\n\n .select2-dropdown {\n background-color: $dropdown-bg-color;\n border: 1px solid transparent;\n }\n\n .select2-dropdown--above {\n border-bottom: none;\n }\n\n .select2-dropdown--below {\n border-top: none;\n }\n\n .select2-results > .select2-results__options {\n max-height: $results-max-height;\n overflow-y: auto;\n }\n\n .select2-results__option {\n &[role=group] {\n padding: 0;\n }\n\n &[aria-disabled=true] {\n color: $results-choice-fg-unselectable-color;\n }\n }\n\n .select2-results__option--highlighted[aria-selected] {\n background-color: $results-choice-bg-hover-color;\n color: $results-choice-fg-hover-color;\n }\n\n .select2-results__group {\n cursor: default;\n display: block;\n padding: 6px;\n }\n\n &.select2-container--open .select2-dropdown {\n border-color: $focus-border-color;\n }\n}\n",".select2-selection--single {\n background-color: mix($selection-bg-top-color, $selection-bg-bottom-color);\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n outline: 0;\n\n @include gradient-vertical($selection-bg-top-color, $selection-bg-bottom-color, 50%, 100%);\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n color: #444;\n line-height: 28px;\n }\n\n .select2-selection__clear {\n cursor: pointer;\n float: right;\n font-weight: bold;\n margin-right: 10px;\n }\n\n .select2-selection__placeholder {\n color: #999;\n }\n\n .select2-selection__arrow {\n background-color: #ddd;\n\n border: none;\n border-left: 1px solid $border-color;\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n\n height: 26px;\n\n position: absolute;\n\n top: 1px;\n right: 1px;\n\n width: 20px;\n\n @include gradient-vertical(#eeeeee, #cccccc, 50%, 100%);\n\n b {\n border-color: #888 transparent transparent transparent;\n border-style: solid;\n border-width: 5px 4px 0 4px;\n\n height: 0;\n left: 50%;\n\n margin-left: -4px;\n margin-top: -2px;\n\n position: absolute;\n\n top: 50%;\n width: 0;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--single {\n .select2-selection__clear {\n float: left;\n }\n\n .select2-selection__arrow {\n border: none;\n border-right: 1px solid $border-color;\n\n border-radius: 0;\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n\n left: 1px;\n right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--single {\n border: 1px solid $focus-border-color;\n\n .select2-selection__arrow {\n background: transparent;\n\n border: none;\n\n b {\n border-color: transparent transparent #888 transparent;\n border-width: 0 4px 5px 4px;\n }\n }\n }\n\n &.select2-container--above {\n .select2-selection--single {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-bottom-color, $selection-opened-bg-top-color, 0%, 50%);\n }\n }\n\n &.select2-container--below {\n .select2-selection--single {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n\n @include gradient-vertical($selection-opened-bg-top-color, $selection-opened-bg-bottom-color, 50%, 100%);\n }\n }\n}\n","$remove-color: #888 !default;\n$remove-hover-color: #555 !default;\n$remove-width: 20px !default;\n\n$selection-color: #444 !default;\n\n$border-color: #aaa !default;\n$border-radius: 4px !default;\n\n$focus-border-color: #5897fb !default;\n\n$container-height: 28px !default;\n\n$selection-bg-top-color: white !default;\n$selection-bg-bottom-color: #eeeeee !default;\n\n$container-placeholder-color: #999 !default;\n\n$container-focus-border-color: blue !default;\n\n$selection-opened-bg-top-color: $selection-bg-bottom-color !default;\n$selection-opened-bg-bottom-color: $selection-bg-top-color !default;\n\n$dropdown-z-index: 1 !default;\n\n$dropdown-bg-color: $selection-bg-top-color !default;\n\n$results-max-height: 200px !default;\n$results-nested-padding: 20px !default;\n\n$results-choice-bg-hover-color: #3875d7 !default;\n$results-choice-fg-hover-color: white !default;\n\n$results-choice-fg-unselectable-color: grey !default;\n","// https://github.com/twbs/bootstrap-sass/blob/3.3-stable/assets/stylesheets/bootstrap/mixins/_gradients.scss#L17-L27\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n// Color stops are not available in IE9 and below.\n@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+\n background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down\n}\n",".select2-selection--multiple {\n background-color: white;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: text;\n\n outline: 0;\n\n &:focus {\n border: 1px solid $focus-border-color;\n }\n\n .select2-selection__rendered {\n list-style: none;\n margin: 0;\n padding: 0 5px;\n }\n\n .select2-selection__clear {\n display: none;\n }\n\n .select2-selection__choice {\n background-color: #e4e4e4;\n\n border: 1px solid $border-color;\n border-radius: $border-radius;\n\n cursor: default;\n\n float: left;\n\n margin-right: 5px;\n margin-top: 5px;\n padding: 0 5px;\n }\n\n .select2-selection__choice__remove {\n color: $remove-color;\n cursor: pointer;\n\n display: inline-block;\n font-weight: bold;\n\n margin-right: 2px;\n\n &:hover {\n color: $remove-hover-color;\n }\n }\n}\n\n&[dir=\"rtl\"] {\n .select2-selection--multiple {\n .select2-selection__choice {\n float: right;\n }\n\n .select2-selection__choice {\n margin-left: 5px;\n margin-right: auto;\n }\n\n .select2-selection__choice__remove {\n margin-left: 2px;\n margin-right: auto;\n }\n }\n}\n\n&.select2-container--open {\n .select2-selection--multiple {\n border: 1px solid $focus-border-color;\n }\n\n &.select2-container--above {\n .select2-selection--multiple {\n border-top: none;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n\n &.select2-container--below {\n .select2-selection--multiple {\n border-bottom: none;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n}\n","/* Slider */\n\n.slick-slider {\n position: relative;\n display: block;\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n -webkit-tap-highlight-color: transparent;\n}\n.slick-list {\n position: relative;\n overflow: hidden;\n display: block;\n margin: 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n\n &.dragging {\n cursor: pointer;\n cursor: hand;\n }\n}\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n position: relative;\n left: 0;\n top: 0;\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n &:before,\n &:after {\n content: \"\";\n display: table;\n }\n\n &:after {\n clear: both;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n}\n.slick-slide {\n float: left;\n height: 100%;\n min-height: 1px;\n [dir=\"rtl\"] & {\n float: right;\n }\n img {\n display: block;\n }\n &.slick-loading img {\n display: none;\n }\n\n display: none;\n\n &.dragging img {\n pointer-events: none;\n }\n\n .slick-initialized & {\n display: block;\n }\n\n .slick-loading & {\n visibility: hidden;\n }\n\n .slick-vertical & {\n display: block;\n height: auto;\n border: 1px solid transparent;\n }\n}\n.slick-arrow.slick-hidden {\n display: none;\n}\n","@font-face {\n\tfont-family: \"iconfont\";\n\tsrc: url('../iconfont/iconfont.eot');\n\tsrc: url('../iconfont/iconfont.eot?#iefix') format('eot'),\n\t\turl('../iconfont/iconfont.woff2') format('woff2'),\n\t\turl('../iconfont/iconfont.woff') format('woff'),\n\t\turl('../iconfont/iconfont.ttf') format('truetype'),\n\t\turl('../iconfont/iconfont.svg#iconfont') format('svg');\n}\n\n@mixin icon-styles {\n\tfont-family: \"iconfont\";\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\tfont-style: normal;\n\tfont-variant: normal;\n\tfont-weight: normal;\n\t// speak: none; // only necessary if not using the private unicode range (firstGlyph option)\n\ttext-decoration: none;\n\ttext-transform: none;\n}\n\n%icon {\n\t@include icon-styles;\n}\n\n@function icon-char($filename) {\n\t$char: \"\";\n\n\t@if $filename == accept {\n\t\t$char: \"\\E001\";\n\t}\n\t@if $filename == account {\n\t\t$char: \"\\E002\";\n\t}\n\t@if $filename == arrow-bottom {\n\t\t$char: \"\\E003\";\n\t}\n\t@if $filename == arrow-left {\n\t\t$char: \"\\E004\";\n\t}\n\t@if $filename == arrow-right {\n\t\t$char: \"\\E005\";\n\t}\n\t@if $filename == arrow-top {\n\t\t$char: \"\\E006\";\n\t}\n\t@if $filename == doc {\n\t\t$char: \"\\E007\";\n\t}\n\t@if $filename == download {\n\t\t$char: \"\\E008\";\n\t}\n\t@if $filename == fb {\n\t\t$char: \"\\E009\";\n\t}\n\t@if $filename == file {\n\t\t$char: \"\\E00A\";\n\t}\n\t@if $filename == jpg {\n\t\t$char: \"\\E00B\";\n\t}\n\t@if $filename == pdf {\n\t\t$char: \"\\E00C\";\n\t}\n\t@if $filename == pin {\n\t\t$char: \"\\E00D\";\n\t}\n\t@if $filename == play-button {\n\t\t$char: \"\\E00E\";\n\t}\n\t@if $filename == play {\n\t\t$char: \"\\E00F\";\n\t}\n\t@if $filename == png {\n\t\t$char: \"\\E010\";\n\t}\n\t@if $filename == search {\n\t\t$char: \"\\E011\";\n\t}\n\t@if $filename == support {\n\t\t$char: \"\\E012\";\n\t}\n\t@if $filename == thin-down {\n\t\t$char: \"\\E013\";\n\t}\n\t@if $filename == thin-up {\n\t\t$char: \"\\E014\";\n\t}\n\t@if $filename == zip {\n\t\t$char: \"\\E015\";\n\t}\n\n\t@return $char;\n}\n\n@mixin icon($filename, $insert: before, $extend: true) {\n\t&:#{$insert} {\n\t\t@if $extend {\n\t\t\t@extend %icon;\n\t\t} @else {\n\t\t\t@include icon-styles;\n\t\t}\n\t\tcontent: icon-char($filename);\n\t}\n}\n\n.icon-accept {\n\t@include icon(accept);\n}\n.icon-account {\n\t@include icon(account);\n}\n.icon-arrow-bottom {\n\t@include icon(arrow-bottom);\n}\n.icon-arrow-left {\n\t@include icon(arrow-left);\n}\n.icon-arrow-right {\n\t@include icon(arrow-right);\n}\n.icon-arrow-top {\n\t@include icon(arrow-top);\n}\n.icon-doc {\n\t@include icon(doc);\n}\n.icon-download {\n\t@include icon(download);\n}\n.icon-fb {\n\t@include icon(fb);\n}\n.icon-file {\n\t@include icon(file);\n}\n.icon-jpg {\n\t@include icon(jpg);\n}\n.icon-pdf {\n\t@include icon(pdf);\n}\n.icon-pin {\n\t@include icon(pin);\n}\n.icon-play-button {\n\t@include icon(play-button);\n}\n.icon-play {\n\t@include icon(play);\n}\n.icon-png {\n\t@include icon(png);\n}\n.icon-search {\n\t@include icon(search);\n}\n.icon-support {\n\t@include icon(support);\n}\n.icon-thin-down {\n\t@include icon(thin-down);\n}\n.icon-thin-up {\n\t@include icon(thin-up);\n}\n.icon-zip {\n\t@include icon(zip);\n}\n","/** Colors */\n$color-theme-main: #FFF;\n$color-theme-main-darker: #0171BA;\n$color-theme-accent: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-accent-second: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-theme-second: #f0f0f0;\n$color-theme-dark: #191919;\n$color-theme-blue-dark: #00182F;\n$color-box: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n\n$color-font-main: #FFFFFF;\n$color-font-accent: #FFFFFF; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent--hover: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-menu--hover: #67AAD6;// pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey: #e1fcf4; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue: #0171BA; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue-dark: #00182F; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-grey--hover: #bbe9da; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-accent-blue--hover: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-light--font: #003061; // pamiętać aby zmienić przy zmianie kolorystyki\n$button-background-dark--font: #CCE3F1; // pamiętać aby zmienić przy zmianie kolorystyki\n$color-font-light: #D1D6DC;\n$color-font-dark: #585F65;\n$color-font-error: #EF4836;\n$color-font-success: #26A65B;\n$color-font-info: #F7CA18;\n$color-grey-light: #878D94;\n\n$color-accept: #7fb800;\n$color-error: #de1a1a;\n$color-info: #00a6ed;\n$color-warning: #ffb400;\n\n$color-border-main:#D1D6DC;\n$color-border-darker: #003061 ;\n\n/** Sizes */\n$size-header-height: 90px;\n$size-header-height--mobile: 70px;\n\n/** Animations */\n$trans-time: .3s;\n$trans-type: ease;\n$standard-trans: .3s ease;\n\n/** Paths */\n$img-path: '../img/';","html {\n font-size: 100%;\n scroll-behavior: smooth;\n}\n\nbody {\n font-family: \"aktiv-grotesk\", sans-serif; \n font-size: 16px;\n font-style: normal;\n background: $color-theme-accent;\n color: $color-font-main;\n @include transition('opacity 0.15s ease-in');\n\n &.home {\n background: $color-theme-main;\n }\n}\n\nstrong, b {\n font-weight: 700;\n}\n\na, p, span, div {\n font-weight: 400;\n}\n* {\n box-sizing: border-box;\n outline: none;\n}\n\nimg {\n max-width: 100%;\n}\n\n.header-wrapper {\n .menu {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n}\n.page-wrapper, .header-wrapper {\n width: 1620px;\n margin: 0 auto;\n\n @include breakpoint(xlarge down) {\n width: 100%;\n padding: 0 15px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n}\n.row, .column, .align-center {\n a {\n margin: 2px 0px;\n }\n}\na {\n color: $color-font-accent;\n text-decoration: none;\n \n &:hover, &:focus {\n color: $color-font-menu--hover;\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color {\n &--error {\n color: $color-font-error;\n }\n &--success {\n color: $color-font-accent;\n }\n}",".js-loader {\n height: 120px;\n display: block;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n position: relative;\n &:after,\n &:before {\n content: '';\n position: absolute;\n width: 30px;\n height: 30px;\n top: 45px;\n z-index: 2;\n }\n &:after {\n right: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n }\n &:before {\n left: 0;\n background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);\n }\n div {\n width: 30px;\n height: 30px;\n position: absolute;\n top: 45px;\n left: -30px;\n z-index: 1;\n border-radius: 50%;\n }\n div:nth-child(1) {\n background-color: $color-theme-accent;\n animation: move 2s infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(2) {\n background-color: lighten($color-theme-accent, 15%);\n animation: move 2s 150ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(3) {\n background-color: lighten($color-theme-accent, 30%);\n animation: move 2s 300ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n div:nth-child(4) {\n background-color: lighten($color-theme-accent, 45%);\n animation: move 2s 450ms infinite cubic-bezier(.2, .64, .81, .23);\n }\n}\n\n@keyframes move {\n 0% {\n left: 0%;\n }\n 100% {\n left: 100%;\n }\n}\n\n.js-loader-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1061;\n display: flex;\n align-items: center;\n justify-content: center;\n width:100%;\n}",".button {\n color: $color-font-accent;\n text-decoration: none;\n // text-transform: uppercase;\n font-size: 12px;\n font-weight: 600!important;\n height: 60px;\n line-height: 60px;\n padding: 0 25px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: $color-font-accent-blue;\n\n @extend .display-font;\n @include border-radius(2px);\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(large down) {\n height: 55px;\n line-height: 55px;\n }\n\n @include breakpoint(medium down) {\n height: 50px;\n line-height: 50px;\n }\n\n @include breakpoint(small down) {\n height: 45px;\n line-height: 45px;\n }\n\n &:hover,\n &:focus {\n color: $color-font-accent-blue-dark;\n background: $color-font-accent-blue--hover;\n }\n\n &--no-padding {\n padding: 0 !important;\n }\n \n &--account {\n background: #0171BA;\n color: #FFF;\n height: auto;\n\n &:hover,\n &:focus {\n background: $color-font-accent-blue--hover;\n }\n \n @include icon(account);\n\n &:before {\n vertical-align: -3px;\n font-size: 15px;\n margin-right: 3px;\n }\n }\n\n &--blue {\n background: $button-background-light;\n color: $color-theme-accent; \n\n &:hover, &:focus {\n color: $button-background-dark--font;\n background: $button-background-dark;\n }\n }\n &--virtual {\n margin: 0!important;\n border: 1px solid transparent;\n &:hover, &:focus {\n border: 1px solid #CCE3F1;\n }\n }\n &--green{\n background: #307772;\n color: #FFF;\n\n &:hover, &:focus {\n color: #FFF !important;\n background: darken(#307772, 10%);\n }\n }\n\n &--arrow-right {\n @include icon(arrow-right, after);\n\n &:after {\n vertical-align: -2px;\n font-size: 14px;\n margin-left: 10px;\n }\n }\n\n &--border {\n border: 1px solid #d9d9d9;\n background: none;\n color: $color-font-main;\n\n &:hover {\n color: $color-font-accent;\n border: 1px solid $color-font-accent;\n background: none;\n }\n }\n\n &--arrow-left {\n @include icon(arrow-left, before);\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--download {\n @include icon(download, before);\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 10px;\n }\n\n }\n\n &--small {\n height: 30px;\n line-height: 30px;\n padding: 0 15px;\n }\n\n &--darkblue {\n background: $color-font-accent;\n color: $color-theme-main;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-font-accent, 15%);\n }\n }\n\n &--white {\n background: $color-theme-main;\n color: $color-font-accent--hover;\n\n &:hover,\n &:focus {\n color: $color-theme-main;\n background: darken($color-theme-main, 15%);\n }\n }\n\n &--red {\n background: #fbd6d6 !important;\n color: #aa0f0f !important;\n\n &:hover,\n &:focus {\n color: #aa0f0f !important;\n background: #f7a7a7 !important;\n }\n }\n\n &--margin-right {\n margin-right: 7px;\n }\n\n &--play-video {\n @include icon(play-button, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n\n &--search-left {\n @include icon(search, before);\n\n &:before {\n vertical-align: -3px;\n font-size: 14px;\n margin-right: 10px;\n }\n }\n}\n\n.account-panel {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n @include breakpoint(large down) {\n position: absolute;\n top: 16px;\n right: 0;\n }\n @include breakpoint(tablet down) {\n position: relative;\n width: 100%;\n top: auto;\n right: auto;\n }\n}",".widget {\n $root: &;\n margin-bottom: 30px;\n\n &__content {\n background: $color-box;\n padding: 24px;\n justify-content: space-between;\n &--info {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n\n }\n &::after {\n content: '';\n display: table;\n clear: both;\n }\n\n &--with-photo {\n\n @include breakpoint(large down) {\n margin-top: 0;\n }\n }\n }\n\n &__photo-box {\n width: 100%;\n @include breakpoint(large down) {\n margin-top: 0;\n }\n\n @include breakpoint(tablet down) {\n margin-right: 15px;\n margin-bottom: 0;\n }\n\n @include breakpoint(small down) {\n float: none;\n width: auto;\n margin-right: 0;\n margin-bottom: 27px;\n }\n }\n\n &__photo {\n display: block;\n max-width: 100%;\n position: relative;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: 24px;\n font-weight: 700;\n line-height: 1.6;\n color: $color-theme-main;\n margin-bottom: 15px;\n text-transform: uppercase;\n }\n\n p {\n font-size: 14px;\n color: #D1D6DC;\n margin-bottom: 0;\n line-height: 19px;\n\n strong {\n font-weight: 900;\n }\n\n &:not(:last-child) {\n margin-bottom: 15px;\n }\n }\n }\n\n &__link {\n margin-top: 15px;\n }\n\n &--dark {\n .button--blue {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n &:hover {\n color: $button-background-light--font;\n background-color: $button-background-light;\n border: 1px solid $button-background-dark;\n }\n }\n #{$root} {\n\n\n &__content {\n background: $button-background-light;\n }\n\n &__text-wysiwyg {\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p {\n color: $color-theme-dark;\n }\n\n }\n\n }\n }\n}",".form {\n input, textarea {\n &::placeholder {\n font-weight: 400;\n }\n }\n .form__info {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n .login {\n color: $color-font-accent-blue-dark;\n a {\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n }\n }\n &__info {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.850em;\n margin-top: 8px;\n display: block;\n \n &--success {\n color: $color-font-success;\n }\n\n &--error {\n color: $color-font-error;\n }\n\n &--info {\n color: $color-font-info;\n }\n\n &--grey {\n color: #929292;\n }\n }\n\n &__label {\n margin: 8px 0 !important;\n display: flex!important;\n }\n}\n\n.input-conditional-group {\n display: none;\n border: 1px dotted $color-border-main;\n margin-top: 10px;\n padding: 9px 27px 15px;\n\n &.is-active {\n display: block;\n }\n}\n\n.input-container {\n display: block;\n padding: 12px 0;\n color: $color-font-accent-blue-dark;\n &__send {\n margin-top: 24px;\n }\n &--error {\n .input {\n border: 1px solid $color-font-error;\n height: 48px;\n color: #878D94;\n }\n\n .input--radio,\n .input--checkbox {\n +label {\n &:before {\n border: 1px solid $color-font-error;\n }\n }\n }\n\n .select2-container--default .select2-selection--single {\n border: 1px solid $color-font-error;\n }\n }\n}\n\nspan.label-text span.required {\n float: left;\n margin-right: 5px;\n color: #FF0000;\n}\n\n.label-text {\n font-size: 12px;\n a {\n color: $color-theme-accent;\n }\n}\n\ninput, textarea {\n font-weight: 400;\n}\n\n.input {\n margin: 0;\n border: 1px solid $color-border-main;\n background-color: #FFF;\n box-shadow: 0 0 0 #FFF;\n line-height: normal;\n font-size: 0.875em; \n padding: 12px 16px;\n \n &:focus {\n border: 1px solid $color-border-darker;\n background-color: #FFF;\n box-shadow: 0 0 5px #FFF;\n }\n\n &__label {\n text-transform: uppercase;\n @extend .display-font;\n font-weight: 500!important;\n font-size: 10px;\n color: $color-font-dark;\n margin-bottom: 8px;\n }\n\n &__error {\n @extend .display-font;\n font-weight: 700;\n font-size: 0.750em;\n color: $color-font-error;\n margin-top: 8px;\n display: inline-block;\n }\n\n &--textarea {\n height: 150px;\n }\n &--file {\n padding: 0px;\n }\n}\n\n\n//checkbox\n.input--radio,\n.input--checkbox {\n position: absolute;\n opacity: 0;\n margin-left: 3px;\n\n +label {\n position: relative;\n display: block;\n padding-left: 28px;\n cursor: pointer;\n margin: 0;\n line-height: 18px;\n font-size: 0.75em;\n\n &:before {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n width: 18px;\n height: 18px;\n content: '';\n border: 1px solid $color-border-main;\n }\n\n &:after {\n position: absolute;\n display: none;\n width: 18px;\n height: 18px;\n top: 0;\n left: 0;\n color: $color-font-accent;\n text-align: center;\n line-height: 16px;\n font-size: 10px;\n border: 1px solid $color-font-accent-blue;\n content: '';\n background: #FFF;\n border: 5px solid $color-font-accent-blue;\n }\n }\n}\n\n//radio\n.input--radio {\n +label {\n &:before {\n @include border-radius(100%);\n }\n\n &:after {\n @include border-radius(100%);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n.input--file, .input-container > input {\n color: #878D94;\n font-family: 'aktiv-grotesk', sans-serif;\n font-weight: 400;\n height: 48px;\n line-height: 48px;\n padding: 0px 16px;\n position: relative;\n &::file-selector-button {\n font-family: 'aktiv-grotesk', sans-serif;\n position: absolute;\n right: 0;\n color: #585F65;\n text-decoration: none;\n font-size: 16px;\n font-weight: 400;\n height: 48px;\n line-height: 40px;\n padding: 0 25px;\n margin-right: 10px;\n margin: 0;\n white-space: nowrap;\n cursor: pointer;\n background: #ececec;\n border-color: transparent;\n transition: all 0.15s ease-in;\n }\n \n &::file-selector-button:hover {\n color: #7e7e7e;\n background: #dbdbdb;\n }\n\n}\n\n//checkbox\n.input--checkbox {\n +label {\n &:before {\n @include border-radius(3px);\n }\n\n &:after {\n @include border-radius(3px);\n }\n }\n\n &:checked+label {\n &:after {\n display: block;\n }\n }\n}\n\n//select2 \n.select2 {\n width: 100% !important;\n\n *:focus {\n outline: none;\n }\n}\n\n.select2-container--default .select2-selection--single {\n height: 39px;\n border: 1px solid $color-border-main;\n @include border-radius(0);\n\n .select2-selection__rendered {\n line-height: 39px;\n font-size: 0.875em;\n }\n\n .select2-selection__arrow {\n height: 36px;\n }\n}\n\n.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {\n border-color: $color-border-darker;\n}\n\n.select2-dropdown {\n background-color: #fff;\n border: 1px solid $color-border-darker;\n @include border-radius(0);\n box-sizing: border-box;\n display: block;\n position: absolute;\n left: -100000px;\n width: 100%;\n z-index: 1051;\n}\n\n.select2-results__option {\n font-size: 0.875em;\n}\n\n.select2-container--default .select2-results__option--highlighted[aria-selected] {\n background: $color-font-accent;\n}\n\np.form-output {\n display: block;\n padding: 5px 10px;\n text-align: center;\n width: 100%;\n margin: 20px 0 0;\n font-size: 14px;\n font-weight: 500;\n border: 1px solid $color-warning;\n\n &--errors {\n border: 1px solid $color-error;\n color: $color-error;\n }\n\n &--success {\n border: 1px solid $color-accept;\n color: darken($color-accept, 20);\n }\n}\n\n.input-container--error {\n border-color: $color-error;\n}\n\n.recaptcha-error {\n >div {\n border: 1px solid $color-error;\n }\n}\n\n\np.input__error {\n margin-bottom: 0;\n}\n\n.form-loading {\n position: relative;\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: -20px;\n background: rgba(255, 255, 255, 0.75);\n }\n}\n\n#team-input {\n width: 80px;\n text-align: center;\n flex: none;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n /* display: none; <- Crashes Chrome on hover */\n -webkit-appearance: none;\n margin: 0;\n /* <-- Apparently some margin are still there even though it's hidden */\n }\n\n &[type=number] {\n -moz-appearance: textfield;\n /* Firefox */\n }\n}\n\n.mda-search {\n [type=\"submit\"] {\n line-height: 1;\n font-size: 0.75em;\n font-weight: 700;\n }\n\n .input-group-label {\n background: none;\n border: none;\n font-weight: 700;\n color: #fff;\n }\n}\n\n.js-ajax-form-graphic input[type=\"file\"] {\n display: none;\n}\n\n.project-state {\n .input-container {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n\n#loginform, #registerform, .universal-form {\n .input {\n &--checkbox {\n display: none;\n }\n }\n}\n\n#registerform {\n ol, ul, li, p {\n color: $color-font-accent-blue-dark;\n }\n}\n\n.register {\n &--success {\n display: flex;\n justify-content: center;\n }\n .page-title {\n margin: 60px 0 60px 0;\n }\n .form__info {\n margin-bottom: 40px;\n font-size: 1em;\n }\n}",".display-font {\n font-family: \"aktiv-grotesk\", sans-serif;\n font-weight: 400;\n}\n\n.box-shadow {\n &--big {\n @include multi-box-shadow((0px 30px 50px rgba(0, 0, 0, 0.15),\n 0 0 100px 0 rgba(25, 25, 25, 0.1)));\n }\n\n &--glow {\n @include multi-box-shadow((0px 0px 75px rgba(0, 0, 0, 0.15),\n 0 0 35px 0 rgba(25, 25, 25, 0.1)));\n }\n}","#ajax-progress {\n text-align: center;\n color: $color-font-accent;\n font-weight: 700;\n font-size: 24px;\n pointer-events: none;\n line-height: 1.15;\n}",".site-header {\n padding: 22px 0;\n background: #00182F;\n width: 100%;\n position: sticky;\n top: 0;\n z-index: 100;\n a {\n margin: 0;\n }\n &__logo {\n margin-top: 9px;\n vertical-align: middle;\n max-width: 156px;\n\n &--nom {\n margin-bottom: 7px;\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n @include breakpoint(tablet down) {\n object-fit: contain;\n max-width: 156px;\n }\n \n @include breakpoint(small down) {\n height: 35px;\n max-width: 90%;\n margin-top: 0px;\n\n }\n }\n\n &__logo-divider {\n display: inline-block;\n width: 1px;\n height: 65px;\n background: $color-border-main;\n vertical-align: middle;\n margin: 0 25px;\n\n @include breakpoint(small down) {\n margin: 0 15px;\n height: 45px;\n }\n }\n\n @include breakpoint(large down) {\n padding: 30px 0;\n }\n @include breakpoint(tablet down) {\n padding: 20px 0;\n }\n}\n\n.header-menu {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n margin-bottom: 0;\n ul {\n margin-left: 0;\n }\n\n @include breakpoint(tablet down) {\n display: block;\n margin: 0 0 15px 0;\n }\n @include breakpoint(small down) {\n margin: 20px 0 15px 0;\n }\n\n &__item {\n display: inline-block;\n width: auto;\n max-width: none;\n font-size: 0.875em;\n // text-transform: uppercase;\n @extend .display-font;\n strong {\n font-weight: 400;\n }\n &.current_page_item,\n &.current-menu-item {\n .header-menu__link {\n color: $color-font-menu--hover;\n }\n }\n\n @include breakpoint(xlarge down) {\n font-size: 0.813em;\n }\n\n @include breakpoint(tablet down) {\n width: 100%;\n text-align: right;\n }\n\n &.vote-badge {\n position: relative;\n\n &:after {\n content: \"trwa głosowanie Internautów\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n width: 150%;\n transform: translate(-50%, 0);\n font-size: 13px;\n text-transform: none;\n text-align: center;\n color: #ff0000;\n animation: vote 1.5s ease infinite;\n }\n @include breakpoint(tablet down) {\n padding-bottom: 20px;\n\n &:after {\n bottom: 10px;\n left: auto;\n right: 0;\n width: 100%;\n transform: translate(0, 0);\n text-align: right;\n }\n }\n }\n }\n\n &__link {\n color: $color-font-main;\n text-decoration: none;\n display: inline-block;\n padding: 7px 0;\n font-size: 16px;\n @include transition(\"color 0.15s ease-in\");\n\n @include breakpoint(small down) {\n padding: 9px 0;\n }\n\n &:hover {\n color: $color-font-menu--hover;\n }\n }\n}\n\n@keyframes vote {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.3;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.account-nav {\n text-align: left;\n display: flex;\n flex-direction: row-reverse;\n gap: 20px;\n justify-content: space-between;\n\n &--mobile {\n @include breakpoint(tablet down) {\n margin-bottom: 20px;\n }\n }\n\n @include breakpoint(small down) {\n .button {\n margin-bottom: 0;\n }\n }\n\n &__logout {\n display: inline-block;\n font-size: 0.75em;\n padding: 2px 0 0 7px;\n vertical-align: middle;\n @extend .display-font;\n text-transform: uppercase;\n }\n}\n\n@include breakpoint(tablet down) {\n .menu {\n a {\n padding: .7rem .5rem; \n }\n }\n}\n.menu {\n &-voting {\n .site-header__logo--nom {\n height: 20px;\n }\n }\n .button {\n &--account {\n font-size: 13px;\n text-transform: none;\n }\n }\n}\n\n.menu-icon {\n &:focus {\n outline: none;\n }\n &:active {\n background: transparent;\n }\n}\n\n.burger-icon {\n width: 30px;\n height: 22px;\n position: relative;\n @include transform(\"rotate(0deg)\");\n @include transition(\".25s ease-in-out\");\n cursor: pointer;\n display: inline-block;\n vertical-align: middle;\n margin-bottom: 8px;\n\n @include breakpoint(small down) {\n margin-bottom: 2px;\n }\n\n &__bar {\n display: block;\n position: absolute;\n height: 3px;\n width: 100%;\n background: $color-font-main;\n opacity: 1;\n left: 0;\n @include transform(\"rotate(0deg)\");\n @include transition(\".15s ease-in-out\");\n\n &:nth-child(1) {\n top: 0;\n }\n\n &:nth-child(2),\n &:nth-child(3) {\n top: 9px;\n }\n\n &:nth-child(4) {\n top: 18px;\n }\n }\n\n &.burger-icon--open {\n .burger-icon__bar {\n &:nth-child(1) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n &:nth-child(2) {\n @include transform(\"rotate(45deg)\");\n }\n &:nth-child(3) {\n @include transform(\"rotate(-45deg)\");\n }\n &:nth-child(4) {\n top: 7px;\n width: 0%;\n left: 50%;\n }\n }\n }\n}\n\n.header-logos {\n text-align: right;\n display: flex;\n flex-direction: column;\n}\n",".popup-video {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n z-index: 1001;\n background: rgba(10, 10, 10, 0.45);\n transition: all .6s;\n opacity: 0;\n visibility: hidden;\n padding: 26px;\n video {\n width: 100%;\n }\n &__container {\n position: relative;\n button {\n position: absolute;\n top: 16px;\n right: 16px;\n background-color: $color-theme-main;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n z-index: 3;\n cursor: pointer;\n border-radius: 50%;\n transition: background .2s;\n &:hover {\n background-color: $color-font-light;\n }\n span {\n width: 60%;\n height: 2px;\n position: absolute;\n background-color: $color-theme-main-darker;\n &:first-child {\n transform: rotate(45deg);\n margin-top: -1px;\n }\n &:last-child {\n transform: rotate(-45deg);\n }\n }\n }\n }\n &.-show {\n opacity: 1;\n visibility: visible;\n }\n}",".section {\n padding: 30px 0;\n background-color: $color-theme-accent-second;\n @include breakpoint(tablet down) {\n padding: 30px 20px;\n }\n &--no-bottom-padding {\n padding-bottom: 0;\n }\n\n &--white {\n background: #FFF;\n }\n &__contest {\n &-info {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 82px;\n }\n }\n &__title-box {\n \n gap: 20px;\n text-align: center;\n margin: 50px 0 81px 0;\n\n &--title {\n font-size: 50px;\n padding-bottom: 40px;\n text-transform: uppercase;\n border-bottom: 1px solid #FFFFFF;\n p {\n line-height: 56px;\n font-weight: 300;\n }\n strong {\n font-weight: 800;\n }\n @include breakpoint (tablet down) {\n font-size: 36px;\n p {\n line-height: 42px;\n }\n padding-bottom: 10px;\n }\n @include breakpoint(small down) {\n font-size: 32px;\n p {\n line-height: 32px;\n }\n padding-bottom: 0px;\n\n }\n }\n\n &--left {\n text-align: left;\n }\n @include breakpoint(small down) {\n margin: 30px 0;\n }\n }\n\n &__button-end{\n display: flex;\n justify-content: end;\n align-items: flex-end;\n margin-bottom: 40px;\n }\n\n &__title {\n text-transform: uppercase;\n font-weight: 700; \n font-size: 2.625em;\n @extend .display-font;\n margin: 0;\n\n @include breakpoint(tablet down) {\n font-size: 2.2em\n }\n\n @include breakpoint(small down) {\n font-size: 2em;\n line-height: 1.3;\n }\n strong {\n }\n }\n\n &__text {\n margin: 30px 0 56px 0;\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n margin: 20px 0 25px 0;\n }\n }\n\n &__subtitle {\n color: $color-font-light;\n font-size: 1.375em;\n position: relative;\n width: auto;\n display: inline-block;\n @extend .display-font;\n margin: 8px 0 0 0;\n line-height: 24px;\n \n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1em;\n }\n\n .icon {\n position: relative;\n font-size: 24px;\n vertical-align: middle;\n margin: 0 10px 0 0;\n\n @include breakpoint(small down) {\n font-size: 18px;\n margin: 0 5px 0 0;\n }\n \n }\n }\n}\n",".page-title {\n text-align: center;\n margin: 100px 0 80px 0;\n font-size: 1.875em;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n\n &--small {\n font-size: 1.5em;\n margin: 60px 0 40px 0;\n }\n}\n\n.single-page-title {\n text-align: left;\n font-weight: 300;\n font-size: 42px;\n margin: 72px 0 32px 0;\n @include breakpoint (tablet down) {\n font-size: 28px;\n }\n}\n\n.single {\n &-content {\n font-size: 20px;\n a {\n color: $color-font-menu--hover;\n font-weight: 700;\n }\n }\n &-virtual-btn {\n a {\n text-wrap: auto;\n display: flex;\n font-size: 16px;\n flex-wrap: wrap;\n height: auto;\n line-height: 2;\n padding: 16px 32px;\n @include breakpoint (medium down) {\n padding: 16px;\n line-height: 1.3;\n }\n }\n }\n}\n\n.page-subtitle {\n color: $color-font-dark;\n text-align: center;\n margin: 0 0 20px 0;\n font-size: 1.375em;\n font-weight: 800;\n text-transform: uppercase;\n\n @extend .display-font;\n\n @include breakpoint(tablet down) {\n margin: 50px 0 40px 0;\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 40px 0 30px 0;\n font-size: 1.5em;\n }\n}","//\n// home - banner\n//\nbody.hidden, header.hidden {\n background: none;\n .site-header {\n background: none;\n }\n}\n.banner {\n background-position: center;\n background-size: cover;\n background-repeat: no-repeat;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n height: 670px;\n position: relative;\n @include breakpoint(medium down) {\n height: auto;\n }\n &-hidden {\n background-size: 100%;\n background-position: top;\n height: 670px;\n background-color: transparent;\n .hidden-page {\n color: #fff;\n display: flex;\n align-items: center;\n p, h1, h2, h3, h4 {\n font-size: 28px;\n line-height: 36px;\n @media (max-width: 991px) {\n font-size: 18px;\n line-height: 26px;\n }\n }\n b,strong {\n font-size: 130%;\n }\n }\n @include breakpoint (medium down) {\n background-size: 135%;\n background-position: top right;\n .hidden-page {\n align-items: flex-end;\n text-align: center;\n justify-content: center;\n margin-bottom: -20px\n }\n }\n @include breakpoint (small down) {\n background-size: 150%;\n .hidden-page {\n margin-bottom: 100px;\n }\n }\n }\n &--movie {\n position: relative;\n \n @media (min-width: 1920px) {\n height: 80vh;\n }\n @include breakpoint (small down) {\n padding-top: 0px!important;\n margin-bottom: -1px!important;\n }\n \n video {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 0;\n }\n }\n \n &__button-block {\n display: flex;\n flex-wrap: wrap;\n margin-bottom: 96px;\n\n @include breakpoint(tablet down) {\n margin-top: 30px;\n justify-content: flex-start;\n margin-bottom: 0px;\n }\n }\n\n &__button {\n margin: 5px 0;\n min-width: 250px;\n max-width: 100%;\n height: 56px;\n line-height: 56px;\n font-size: 13px;\n text-transform: none;\n @include breakpoint(small down) {\n width: 100%;\n }\n }\n &__gradient {\n &--full {\n background-color: #00306158;\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n &--top, &--bottom {\n background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0.00) 100%);\n z-index: 0;\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n }\n &--top {\n top: 0;\n transform: rotate(180deg);\n }\n &--bottom {\n bottom: 0;\n }\n }\n &__row {\n height: 100%;\n z-index: 2;\n position: relative;\n padding: 12px 0px;\n &.row {\n max-width: 100rem;\n }\n }\n\n &__box {\n\n @include breakpoint(medium down) {\n padding: 20px;\n }\n }\n\n &__box-content {\n justify-content: space-between;\n flex-direction: column;\n gap: 56px;\n &.-right {\n justify-content: flex-end;\n align-items: flex-end;\n text-align: right;\n }\n @include breakpoint(large down) {\n min-height: 40vh;\n justify-content: flex-end;\n }\n @include breakpoint(medium down) {\n gap: 0px;\n .column {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n }\n &__edition {\n margin-bottom: 26px;\n display: flex;\n }\n &__title, &__text, &__edition {\n text-transform: uppercase;\n }\n &__title {\n font-size: 50px;\n font-weight: 300;\n line-height: 1.12;\n color: $color-font-accent;\n margin: 0;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n &__text {\n font-size: 50px;\n font-weight: 800;\n margin: 0;\n line-height: 1.12;\n @include breakpoint(large down) {\n font-size: 32px;\n }\n }\n\n @include breakpoint(medium down) {\n &__title, &__text {\n font-size: 36px;\n line-height: 42px;\n }\n }\n &__terms {\n font-size: 18px;\n margin: 0;\n }\n\n &__photo-desc {\n height: 75px;\n font-size: 10px;\n color: #FFF;\n align-items: center;\n display: flex;\n\n @include breakpoint(medium down) {\n height: 30px;\n }\n }\n\n @include breakpoint(medium down) {\n // margin-top: 10px;\n // margin-bottom: 20px;\n }\n\n @include breakpoint(tablet down) {\n // margin-top: 45px;\n }\n\n @include breakpoint(small down) {\n // margin-top: 10px;\n padding-top: 10px;\n margin-bottom: 0;\n }\n\n &__term-info {\n position: absolute;\n bottom: -45px;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n position: relative;\n bottom: auto;\n }\n\n strong {\n font-weight: 800;\n }\n }\n}\n\n\n@include breakpoint(small) {\n .reveal {\n width: calc(100% - 40px);\n left: 20px;\n right: 20px;\n top: 40px;\n height: auto;\n min-height: auto;\n h3 {\n font-size: 26px!important;\n }\n li {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n }\n}\n\n@include breakpoint(medium) {\n .reveal {\n right: auto;\n left: auto;\n }\n}\n\n\n.reveal {\n overflow: hidden;\n .button {\n max-width: 200px;\n width: 100%;\n }\n &__background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: .43;\n z-index: -1;\n }\n &-dark {\n border: none; \n background-color: $color-theme-accent;\n .text, .close-button {\n color: $color-theme-main\n }\n }\n div {\n color: $color-font-dark;\n }\n}\n.reveal-no-bg {\n padding: 0;\n border: 0;\n background-color: transparent;\n outline: none;\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 5%;\n top: 20px;\n height: auto;\n min-height: 1px;\n }\n \n}\n\n.poster {\n margin-top: -50px;\n margin-bottom: -100px;\n text-align: right;\n\n @include breakpoint(medium down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 90%;\n margin-left: 10%;\n }\n\n @include breakpoint(tablet down) {\n margin-top: -30px;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n margin-bottom: 20px;\n width: 100%;\n margin-left: 0;\n }\n\n &__img {\n @extend .box-shadow--big;\n\n &:hover {\n cursor: pointer;\n }\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(search);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n }\n }\n}\n\n.movie {\n width: 800px;\n border: 5px solid #FFF;\n\n .video-wrapper {\n padding-bottom: 52.55%;\n }\n\n @include breakpoint(medium down) {\n width: 96%;\n margin: 0 2%;\n }\n\n iframe {\n width: 100%;\n height: 120%;\n }\n\n &__zoom {\n color: $color-font-accent;\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n margin-top: 15px;\n display: inline-block;\n text-decoration: none;\n cursor: pointer;\n\n @extend .display-font;\n @include icon(play);\n\n &:focus,\n &:active {\n outline: none;\n }\n\n &:before {\n vertical-align: -2px;\n font-size: 14px;\n margin-right: 8px;\n margin-left: 20px;\n }\n }\n}\n\n.claim {\n font-size: 24px;\n\n @include breakpoint(tablet down) {\n font-size: 19px;\n }\n\n @include breakpoint(small down) {\n font-size: 16px;\n }\n\n &__text {\n display: block;\n line-height: 1.6;\n width: 80%;\n\n @include breakpoint(tablet down) {\n margin-left: 40px;\n }\n\n @include breakpoint(medium down) {\n margin-left: 20px;\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n\n &--number {\n font-size: 5em;\n line-height: 1;\n font-weight: 800;\n @extend .display-font;\n width: 100%;\n }\n\n &--header {\n font-size: 1.458em;\n line-height: 1.25;\n text-transform: uppercase;\n margin-bottom: 40px;\n @extend .display-font;\n width: 100%;\n\n strong {\n display: block;\n font-weight: 800;\n font-size: 1.1em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n }\n }\n\n &--award {\n font-size: 0.833em;\n margin-top: 40px;\n margin-bottom: 20px;\n\n @include breakpoint(small down) {\n font-size: 1em;\n margin-top: 20px;\n }\n\n strong {\n color: $color-font-accent;\n font-weight: 900;\n }\n }\n }\n}\n\n// \n// home - taby\n// \n.tabs-container {\n font-size: 1em;\n @extend .box-shadow--big;\n @include border-radius(5px);\n a {\n margin: 0;\n height: 100%;\n @include breakpoint (tablet down) {\n margin-top: 0;\n }\n }\n}\n\n.tabs {\n padding: 0;\n margin: 0;\n border: 0;\n @include breakpoint (medium down) {\n display: flex;\n flex-direction:column;\n }\n @include breakpoint (small down) {\n &-container {\n .tabs-content {\n .button {\n width: 100%;\n } \n }\n }\n }\n &.row {\n margin-left: 0;\n margin-right: 0;\n }\n\n &__item {\n text-align: center;\n text-transform: uppercase;\n background: transparent;\n\n &:focus {\n outline: none;\n }\n }\n\n &__link {\n text-decoration: none;\n font-size: 1em !important;\n background: $color-theme-second;\n border-top: 3px solid #FFF;\n padding: 55px 0 !important;\n color: #585F65!important;\n @extend .display-font;\n\n @include transition('all 0.15s ease-in');\n\n @include breakpoint(tablet down) {\n font-size: 0.875em !important;\n padding: 40px 0 !important;\n }\n @include breakpoint (medium down) {\n border-top: 1px solid #f0f0f0;\n background-color: #fff;\n }\n\n @include breakpoint(small down) {\n font-size: 0px !important;\n color: #FFF;\n display: flex!important;\n gap: 5px;\n justify-content: center;\n }\n\n @include breakpoint (tablet down) {\n padding: 56px 0 !important;\n }\n\n span {\n color: #585F65;\n\n @include breakpoint(small down) {\n display: block;\n font-size: 16px;\n }\n }\n\n &:focus {\n outline: none;\n background: $color-theme-second !important;\n border-top: 2px solid #FFF;\n }\n &[aria-selected=true] {\n color: $color-font-accent-blue-dark!important;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n .tabs__link--number {\n font-weight: 700;\n color: $color-font-accent-blue;\n }\n }\n &[aria-selected=true],\n &:hover {\n outline: none;\n background: #FFF !important;\n border-top: 3px solid $color-font-accent-blue;\n box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08);\n }\n }\n}\n\n.tabs-content {\n border: 0;\n @include border-radius-separate(0, 0, 5px, 5px);\n font-size: 18px;\n position: relative;\n z-index: 99;\n @include breakpoint (medium down) {\n &--desktop {\n display: none;\n } \n }\n ul {\n @include breakpoint (tablet up) {\n .tabs-panel {\n display: none;\n }\n }\n }\n &__panel {\n height: 500px;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: right center;\n @include border-radius-separate(0, 0, 5px, 5px);\n padding: 25px 50px;\n position: relative;\n\n @include breakpoint(tablet down) {\n padding: 25px 50px;\n height: 600px;\n border-radius: 0px;\n }\n @include breakpoint (medium down) {\n background-size: none;\n }\n @include breakpoint(small down) {\n padding: 30px;\n background-position: bottom right 15%;\n height: 550px;\n\n .align-self-middle {\n align-self: normal;\n }\n }\n }\n\n &__panel-background {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n @include background-diagonal-gradient(90deg, #FFFFFF, 45%, rgba(255, 255, 255, 0), 75%);\n\n @include breakpoint(medium down) {\n background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%);\n }\n }\n\n &__row {\n height: 100%;\n position: relative;\n z-index: 2;\n }\n\n &__text {\n display: block;\n line-height: 24px;\n padding: 0 6px;\n margin-bottom: 40px;\n // color: #585F65;\n color: $color-font-dark;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n font-size: 0.875em;\n }\n\n &--number {\n @extend .tabs-content__text;\n @extend .display-font;\n font-size: 8.333em;\n color: $color-font-accent-blue-dark;\n line-height: 1;\n padding-left: 0;\n margin-bottom: 5px;\n font-weight: 250;\n\n @include breakpoint(tablet down) {\n font-size: 7em;\n }\n\n @include breakpoint(small down) {\n font-size: 4.500em;\n }\n }\n\n &--title {\n @extend .tabs-content__text;\n @extend .display-font;\n line-height: 1;\n font-weight: 800;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n display: inline-block;\n font-size: 42px;\n margin-bottom: 28px;\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n }\n }\n }\n\n &__label {\n color: #FFF;\n position: absolute;\n bottom: 0;\n right: 0;\n padding: 15px 30px;\n font-size: 0.722em;\n text-align: right;\n line-height: 1.6;\n\n @include breakpoint(small down) {\n font-size: 0.625em;\n padding: 10px 20px;\n }\n\n strong {\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include background-opacity($color-font-accent, 0.75);\n @include border-radius-separate(0, 0, 0, 5px);\n }\n}\n\n//\n// home - mapa\n//\n.map {\n min-height: 631px;\n background: $color-theme-second;\n position: relative;\n margin-bottom: 200px;\n @include breakpoint(large down) {\n margin-bottom: 40px;\n }\n @include breakpoint(small down) {\n background: #FFF;\n min-height: 400px;\n\n &.map__container {\n height: auto;\n }\n }\n\n &__button {\n position: absolute;\n z-index: 9;\n top: 40px;\n left: 50%;\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(small down) {\n position: relative;\n }\n }\n &__container {\n position: relative;\n &__extra {\n margin-top: 20rem;\n iframe {\n height: auto;\n aspect-ratio: 6/3;\n }\n @include breakpoint (large down) {\n margin-top: 10rem;\n padding: 1.5rem;\n }\n @include breakpoint (medium down) {\n margin-top: 3rem;\n padding: unset;\n }\n }\n }\n &__info {\n position: absolute;\n bottom: -40px;\n left: 50%;\n background: #FFF;\n padding: 15px 0;\n width: 996px;\n @include transform('translate(-50%, 0)');\n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(tablet down) {\n width: 100%;\n margin-right: 0 !important;\n margin-left: 0 !important;\n top: 20px;\n border-radius: 0px;\n position: relative;\n bottom: auto;\n left: auto;\n @include transform('translate(0, 0)');\n }\n @include breakpoint (small down) {\n width: 100%;\n \n }\n }\n\n &__info-box {\n display: block;\n float: left;\n padding: 15px 30px !important;\n font-size: 0.813em;\n line-height: 1.7;\n border-left: 1px solid $color-border-main;\n .row {\n display: flex;\n flex-direction: column;\n .shrink {\n margin-bottom: 20px;\n }\n .column {\n color: #585F65;\n font-size: 12px;\n }\n }\n @include breakpoint(tablet down) {\n font-size: 0.75em;\n border-left: 0;\n border-top: 1px solid $color-border-main;\n }\n\n &:first-of-type {\n border-left: 0;\n\n @include breakpoint(small down) {\n border-left: 0;\n border-top: 0;\n }\n }\n\n img {\n margin-top: 3px;\n vertical-align: middle;\n\n @include breakpoint(small down) {\n margin-bottom: 15px;\n }\n }\n }\n}\n\n//\n// home - timeline\n//\n.timeline {\n .section__title-box {\n margin: 56px 0 81px 0;\n }\n}\n.tl-point {\n text-align: center;\n\n @include breakpoint(small down) {\n text-align: left;\n position: relative;\n padding: 10px 0 30px 0;\n }\n\n &__date {\n @extend .display-font;\n font-weight: 700;\n font-size: 2.625em;\n position: relative;\n display: inline-block;\n\n &--green {\n color: $color-font-accent;\n }\n\n @include breakpoint(tablet down) {\n font-size: 1.25em;\n }\n\n @include breakpoint(medium down) {\n font-size: 1.25em;\n vertical-align: bottom;\n height: 3em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 1.563em;\n height: auto;\n }\n\n &--prefix {\n font-size: 0.560em;\n position: absolute;\n bottom: 4px;\n right: 100%;\n text-transform: uppercase;\n padding-right: 5px;\n font-weight: 300;\n\n @include breakpoint(medium down) {\n position: relative;\n right: auto;\n bottom: auto;\n padding-right: 0;\n }\n }\n }\n\n &__dot {\n width: 44px;\n height: 44px; \n margin: 60px auto;\n @include border-radius(100%);\n // border: 5px solid #FFF;\n box-sizing: content-box;\n position: relative;\n z-index: 2;\n background: #67AAD6;\n\n @include breakpoint (small down) {\n margin: 16px auto;\n }\n \n &--background {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 16px;\n height: 16px; \n background: $color-font-accent-blue;\n @include border-radius(100%);\n border: 5px solid #FFF;\n box-sizing: content-box;\n\n\n @include breakpoint(small down) {\n width: 16px;\n height: 16px;\n // margin: 22px 22px 0 22px;\n }\n\n &:before {\n position: absolute;\n // top: -14px;\n // left: -15px;\n // width: 44px;\n // height: 44px;\n top: 0;\n left: 0;\n\n background: #67AAD6;\n content: '';\n }\n }\n }\n\n &__dot-container {\n position: relative;\n\n @include breakpoint(small down) {\n position: absolute;\n top: 0;\n height: 100%;\n }\n\n &:before {\n @extend .line-styles;\n left: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n left: 29px;\n height: 23px;\n width: 0px;\n width: 0px!important;\n\n }\n }\n\n &:after {\n @extend .line-styles;\n right: 0;\n z-index: 1;\n \n @include breakpoint(small down) {\n top: 22px!important;\n left: 22px;\n }\n }\n }\n\n &:first-of-type {\n .tl-point__dot-container {\n &:before {\n display: none;\n }\n }\n }\n\n &:last-of-type {\n .tl-point__dot-container {\n &:after {\n display: none;\n }\n }\n }\n\n &--current {\n .tl-point__dot {\n border: 20px solid #FFF;\n margin: 39px auto;\n width: 17px;\n height: 17px;\n @extend .box-shadow--glow;\n\n @include breakpoint(small down) {\n margin: 0 0;\n }\n }\n\n .tl-point__dot-container {\n &:before {\n background: $color-font-accent;\n }\n }\n\n .tl-point__text {\n .button {\n display: inline-block;\n }\n }\n }\n\n &--past {\n .tl-point__dot-container {\n\n &:before,\n &:after {\n background: $color-font-accent;\n }\n }\n }\n\n &__text {\n padding: 0 15px;\n .button {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding-left: 80px;\n font-size: 0.875em;\n }\n\n a:not(.button) {\n color: $color-font-main;\n }\n }\n}\n\n.archive {\n &__photo {\n background-image: url(../img/home/archive-background.png);\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n height: 600px;\n position: relative;\n\n @include breakpoint(tablet down) {\n height: 400px;\n }\n\n @include breakpoint(small down) {\n display: none;\n }\n }\n\n &__image {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 65%;\n border: 10px solid #FFF;\n\n @extend .box-shadow--big;\n @include transform('translate(-50%, -50%)');\n\n >img {\n width: 100%;\n height: auto;\n }\n }\n\n &__label {\n position: absolute;\n font-size: 0.722em;\n line-height: 0.75;\n text-align: right;\n top: -9px;\n right: -9px;\n background: #FFF;\n color: $color-font-light;\n padding: 20px;\n\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 1.231em;\n @extend .display-font;\n }\n\n @include breakpoint(tablet down) {\n display: none;\n }\n }\n}\n\n.timeline, .realizations {\n h3 {\n line-height: 48px;\n font-weight: 300;\n @include breakpoint (tablet down) {\n line-height: 40px;\n }\n strong {\n font-weight: 700;\n }\n }\n}",".juror-list {\n gap: 24px;\n overflow: hidden;\n}\n.jury {\n background: #FFFFFF;\n height: 100%;\n min-height: 292px;\n // min-height: 292px;\n .row {\n height: 100%;\n }\n &-info {\n flex: 0 0 587px;\n $largeWidth: calc(50% - 24px);\n @include breakpoint (large down) {\n flex: 0 0 $largeWidth;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 $largeWidth; \n }\n @include breakpoint (small down) {\n flex: 0 0 100%\n }\n }\n @extend .box-shadow--big;\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n .large-5 {\n // min-height: 292px;\n // max-height: 292px;\n }\n\n &__image {\n height: 100%;\n position: relative;\n overflow: hidden;\n\n @include breakpoint (medium down) {\n max-height: 292px;\n height: 100%;\n }\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n object-fit: cover;\n width: 100%;\n filter: grayscale(1);\n\n @include transform(\"translate(-50%, 0)\");\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n \n @include breakpoint(medium down) {\n position: relative;\n left: auto;\n height: 100%;\n transform: none;\n max-width: auto;\n \n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1em;\n color: $color-theme-blue-dark;\n margin: 40px 0 8px 0;\n font-weight: 700;\n small {\n font-size: 9px; \n color: $color-theme-blue-dark;\n font-weight: 400;\n }\n @include breakpoint(small down) {\n margin: 30px 0 8px 0;\n }\n }\n\n &__text {\n font-size: 12px;\n line-height: 19px;\n overflow: hidden;\n color: $color-theme-accent;\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 40px 0 20px 0;\n height: 48px;\n line-height: 46px;\n font-size: 13px;\n line-height: 13px;\n padding: 16px 24px;\n background-color: $button-background-light;\n color: $button-background-light--font;\n text-transform: none;\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-theme-blue-dark;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0, 0, 0, 0.3));\n }\n}\n\n.juror {\n margin-bottom: 140px;\n margin-top: 72px;\n padding: 56px 102px 56px 175px;\n background: #fff;\n justify-content: space-between;\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n padding: 28px 45px;\n }\n @include breakpoint (small down) {\n padding: 12px 28px;\n }\n &__top {\n display: flex;\n gap: 25px;\n position: relative;\n left: -73px;\n margin-bottom: 43px;\n\n @include breakpoint (medium down) {\n left: 0px;\n flex-wrap: wrap;\n }\n &--title {\n color: $color-font-accent-blue-dark;\n font-size: 42px;\n line-height: 48px;\n font-weight: 700;\n font-family: 'aktiv-grotesk', sans-serif;\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 42px;\n }\n\n @include breakpoint (small down) {\n font-size: 28px;\n line-height: 34px;\n }\n }\n &--link {\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: 48px;\n height: 48px;\n background-color: $button-background-light;\n color: $color-font-accent-blue;\n transition: all .5s;\n box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06);\n &:hover {\n background-color: $button-background-dark;\n color: $button-background-dark--font;\n }\n }\n }\n &__image {\n position: relative;\n z-index: 1;\n\n > img {\n width: 100%;\n filter: grayscale(1);\n\n }\n }\n\n &__description {\n padding: 0px 24px!important;\n @include breakpoint(medium down) {\n order: 1;\n padding: 0px 0px!important;\n }\n }\n\n &__text {\n color: #585F65;\n position: relative;\n z-index: 0;\n font-size: 1em;\n line-height: 1.5em;\n p {\n line-height: 1.5em;\n }\n @include breakpoint(medium down) {\n padding: 18px 0px;\n }\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n .video-wrapper {\n margin-top: 50px;\n\n @include breakpoint(small down) {\n margin-top: 30px;\n margin-bottom: 20px;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-theme-blue-dark;\n margin: 0 0 40px 0;\n font-weight: 700;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n font-size: 0.75em;\n text-transform: uppercase;\n font-weight: 600;\n\n .icon {\n color: $color-font-accent-blue;\n padding-right: 7px;\n }\n\n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n",".project {\n background: #FFF;\n padding: 15px;\n margin-bottom: 30px;\n \n @extend .box-shadow--big;\n @include border-radius(5px);\n\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n\n &__image {\n height: 350px;\n background: #000;\n position: relative;\n overflow: hidden;\n\n @include border-radius-separate(5px, 0, 5px, 0);\n\n > img {\n position: absolute;\n width: auto;\n height: 100%;\n max-width: none;\n left: 50%;\n\n @include transform('translate(-50%, 0)');\n\n @include breakpoint(medium down) {\n width: 100%;\n height: auto;\n }\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.250em;\n color: $color-font-accent-blue-dark;\n margin: 20px 0 20px 0;\n font-weight: 900;\n\n @include breakpoint(tablet down) {\n font-size: 1em;\n }\n\n @include breakpoint(small down) {\n margin: 30px 0 10px 0;\n }\n }\n\n &__text {\n font-size: 0.938em;\n line-height: 1.8em;\n // height: 10.8em;\n overflow: hidden;\n\n p {\n color: $color-font-accent-blue;\n margin: 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n\n @include breakpoint(tablet down) {\n font-size: 0.875em;\n }\n\n @include breakpoint(small down) {\n height: auto;\n max-height: 9em;\n }\n }\n\n .button {\n margin: 30px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__movie {\n position: absolute;\n z-index: 3;\n color: $color-font-accent;\n font-size: 40px;\n bottom: 22px;\n right: 10px;\n\n @include text-shadow(0, 2px, 5px, rgba(0,0,0,.3));\n }\n}",".history {\n background: #FFF;\n margin-bottom: 30px;\n display: block;\n .row {\n height: 100%;\n }\n @include breakpoint(medium down) {\n text-align: center;\n }\n\n &:hover {\n .history__image {\n opacity: 0.75;\n }\n }\n\n \n\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n @include transition('all 0.25s ease-in');\n @include border-radius-separate(5px, 5px, 0, 0);\n\n > img {\n width: 100%;\n height: auto;\n object-fit: cover;\n min-height: 100%;\n max-width: 100%;\n }\n }\n\n &__title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n padding: 8px 20px;\n }\n }\n\n .button {\n margin: 10px 0 20px 0;\n\n @include breakpoint(small down) {\n margin: 20px auto;\n }\n }\n\n &__subtitle {\n font-size: 1em;\n color: $color-font-accent-blue-dark;\n margin: 0 0 10px 0;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n}\n\n.single-contest {\n margin-bottom: 140px;\n\n @include breakpoint(medium down) {\n margin-bottom: 60px;\n }\n\n &__image {\n position: relative;\n z-index: 1;\n \n @include breakpoint(medium down) {\n order: 2;\n margin-top: -90px;\n }\n\n @include breakpoint(small down) {\n order: 2;\n margin-top: -30px;\n }\n\n > img {\n @include border-radius(5px);\n border: 10px solid #FFF;\n @extend .box-shadow--big;\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n\n &__description {\n @include breakpoint(medium down) {\n order: 1;\n }\n }\n\n &__text {\n background: $color-font-accent-blue;\n position: relative;\n z-index: 0;\n padding: 85px;\n font-size: 0.938em;\n line-height: 1.8em;\n\n @include breakpoint(medium down) {\n padding: 50px;\n }\n @include breakpoint(small down) {\n padding: 40px 30px;\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n margin: 10px 0 25px 0;\n padding: 0;\n\n @extend .display-font;\n }\n }\n\n &__title {\n @extend .display-font;\n font-size: 1.875em;\n color: $color-font-accent;\n margin: 0 0 40px 0;\n font-weight: 900;\n\n @include breakpoint(medium down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n\n &__back-link {\n display: block;\n margin: 30px 0 0 0;\n padding: 0;\n font-size: 0.750em;\n text-transform: uppercase;\n font-weight: 600;\n @extend .display-font;\n\n .icon {\n padding-right: 7px;\n }\n\n \n @include breakpoint(medium down) {\n position: relative;\n }\n }\n}\n\n.winner {\n &__header {\n span {\n display: block;\n }\n }\n\n &__text {\n padding: 0 0 15px 0;\n } \n\n &__gallery {\n margin: 0 0 30px 0;\n }\n\n &__gallery-item {\n margin-bottom: 50px;\n\n img {\n @include transition('all 0.25s ease-in');\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 20px 0 rgba(25,25,25,0.1)\n ));\n }\n\n &:hover {\n img {\n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.25),\n 0 0 25px 0 rgba(25,25,25,0.2)\n ));\n }\n }\n }\n}\n\n.history-banner {\n position: relative;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n\n &__text { \n\n @include breakpoint(tablet down) {\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n font-size: 0.875em;\n }\n }\n\n &__movie {\n\n @extend .box-shadow--big;\n\n @include breakpoint(tablet down) {\n margin-right: 0;\n }\n\n @include breakpoint(small down) {\n margin-left: 0;\n }\n }\n}\n\n.history-video {\n margin-top: 48px;\n margin-bottom: -60px;\n padding-bottom: 60px;\n overflow: hidden;\n background-color: $color-font-accent-blue-dark;\n .section__title-box {\n margin: 48px 0 36px 0;\n text-align: left;\n }\n .history-card {\n a {\n display: flex;\n height: 100%;\n }\n }\n \n}\n\n.custom-video {\n .video-wrapper {\n padding-top: 0px;\n overflow: hidden;\n video {\n max-width: 100%;\n }\n }\n}\n\n.history-list {\n justify-content: center;\n row-gap: 24px;\n .column {\n min-height: 100%;\n }\n}\n.history-archive {\n height: 100%;\n .info {\n background-color: #fff;\n height: 100%\n }\n &__image {\n position: relative;\n overflow: hidden;\n opacity: 1;\n border-radius: 0px!important;\n min-height: 329px; \n height: 100%;\n\n > img {\n width: 100%;\n \n @include breakpoint(medium down) {\n width: 50%;\n margin: 0 0 0 46%;\n }\n\n @include breakpoint(small down) {\n width: 90%;\n margin: 0 0 0 5%;\n }\n }\n }\n &__title {\n font-size: 1.8rem;\n font-weight: 500;\n }\n\n &__title, &__subtitle {\n color: $color-font-accent-blue-dark;\n }\n &__data {\n padding: 10px 0px;\n }\n}\n\n.winners-section {\n margin-top: 0px;\n background: none;\n}\n\n.video-wrapper {\n position: relative;\n\tpadding-bottom: 51.75%; /* 16:9 */\n\tpadding-top: 25px;\n height: 0;\n \n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n.realizations {\n padding-top: 10px;\n .section__title {\n font-size: 42px;\n &-box {\n margin: 50px 0 32px 0;\n }\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px;\n .page-wrapper {\n padding: 0;\n }\n .section__title {\n font-size: 32px;\n &-box {\n margin: 50px 0 24px 0;\n }\n }\n\n }\n}\n\n.slide {\n position: relative;\n padding: 10px 0 70px 0;\n\n @include breakpoint(small down) {\n padding: 10px 0 30px 0;\n }\n\n &__image-container {\n // position: relative;\n }\n\n &__image { \n @include multi-box-shadow((\n 0px 10px 15px rgba(0, 0, 0, 0.15),\n 0 0 30px 0 rgba(25,25,25,0.1)\n ));\n\n \n @include breakpoint(tablet down) {\n border: 10px solid #FFF;\n }\n }\n\n &__arrow {\n position: absolute;\n top: 42%;\n left: 40px;\n font-size: 20px;\n line-height: 40px;\n color: $color-font-accent;\n cursor: pointer;\n display: block;\n width: 40px;\n height: 40px;\n border: 1px solid #fff;\n background: hsla(0, 0%, 100%, 0.16);\n text-align: center;\n z-index: 2;\n\n @include border-radius(100%);\n @include transform('translate(0, -50%)');\n @include multi-box-shadow((\n 0px 3px 7px rgba(0, 0, 0, 0.15),\n 0 0 10px 0 rgba(25,25,25,0.1)\n ));\n\n &--next {\n left: auto;\n right: 40px;\n }\n\n @include breakpoint(xlarge down) {\n left: 20px;\n line-height: 35px;\n width: 35px;\n height: 35px;\n font-size: 18px;\n\n &--next {\n left: auto;\n right: 20px;\n }\n }\n @include breakpoint(small down) {\n top: 30%;\n line-height: 50px;\n width: 50px;\n font-size: 21px;\n height: 50px;\n left: 0px;\n &--next {\n right: 0px;\n left: auto;\n }\n }\n }\n\n &__label {\n font-size: 12px;\n color: #D1D6DC;\n margin-top: 20px;\n line-height: 1.4;\n .color-accent {\n color: $color-font-accent-blue;\n }\n strong {\n color: $color-font-main;\n text-transform: uppercase;\n display: block;\n font-size: 24px;\n margin-bottom: 6px;\n @extend .display-font; \n }\n\n @include breakpoint(small down) {\n position: absolute;\n top: 10px;\n }\n }\n p {\n font-weight: 300;\n }\n &__title {\n font-size: 32px;\n line-height: 36px;\n text-transform: uppercase;\n p {\n font-size: 32px;\n line-height: 36px;\n }\n @extend .display-font;\n\n width: 80%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n margin-top: 20px;\n text-align: center;\n font-size: 1.15em;\n }\n }\n\n &__subtitle {\n font-size: 1.125em;\n width: 70%;\n\n @include breakpoint(large down) {\n width: 100%;\n }\n\n @include breakpoint(small down) {\n text-align: center;\n font-size: 0.875em;\n }\n }\n .align-middle {\n background: $color-theme-blue-dark;\n padding: 24px;\n @include breakpoint(small down) {\n padding-top: 96px;\n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n }\n}","\n.partners {\n background-color: #fff;\n padding-top: 96px;\n \n &__title {\n color: $color-font-accent-blue-dark;\n text-transform: uppercase;\n font-size: 42px;\n @extend .display-font;\n margin: 0;\n font-weight: 300;\n p {\n font-weight: 300;\n }\n @include breakpoint(tablet down) {\n font-size: 1.5em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.25em;\n line-height: 1.3;\n }\n }\n &__info {\n color: #585F65;\n }\n\n &__divider {\n width: 100%;\n margin: 40px 0;\n border-bottom: 1px solid $color-border-main;\n }\n}\n\n.partner {\n text-align: center;\n padding: 0 60px;\n @include breakpoint(small down) {\n padding: 0 40px;\n }\n\n img {\n max-width: 100%;\n max-height: 85px;\n max-width: 177px;\n }\n\n &--divider {\n padding: 0 60px 30px;\n\n .partner__label {\n margin: 0;\n }\n }\n\n &__label {\n display: block;\n font-size: 1em;\n color: $color-font-dark;\n text-transform: uppercase;\n font-weight: 700;\n margin: 32px 0;\n\n @extend .display-font;\n }\n}\n\n.patrons {\n display: flex;\n flex-wrap: wrap;\n\n justify-content: center;\n}\n\n.patron {\n display: flex;\n flex-basis: 11.1%;\n padding-right: 30px;\n justify-content: center;\n\n &:nth-child(9n + 1) {\n justify-content: flex-start;\n }\n\n &:nth-child(9n) {\n padding-right: 0;\n justify-content: flex-end;\n }\n\n @include breakpoint(tablet down) {\n flex-basis: 25%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n\n @include breakpoint(small down) {\n flex-basis: 50%;\n\n &:nth-child(n) {\n padding: 0 15px 15px;\n }\n }\n}",".contact {\n display: flex;\n flex-wrap: wrap;\n &-title {\n margin: 72px 0px 40px 0px;\n }\n &__form {\n padding: 45px;\n margin-bottom: 60px;\n background: #FFF;\n @include breakpoint(large down) {\n padding: 30px;\n }\n @include breakpoint(medium down) {\n padding: 15px;\n }\n @include breakpoint (small down) {\n padding: 10px;\n }\n @extend .box-shadow--big;\n h1,\n h2, \n h3,\n h4,\n h5,\n h6 {\n color: $color-font-accent-blue-dark;\n }\n p, a, span {\n color: $color-font-dark;\n }\n }\n}\n.contact-form {\n text-align: left; \n \n br {\n display: none;\n }\n\n @include breakpoint(small down) {\n padding: 25px 25px 35px 25px;\n }\n\n\n &__text {\n\n @include breakpoint(tablet down) {\n margin: -20px 0 30px 0;\n }\n\n @include breakpoint(small down) {\n margin: 0 0 20px 0;\n }\n }\n .js-cf-response {\n }\n}\n\n.location-form, .contact__form {\n &__title, h2 {\n font-size: 1.5em;\n line-height: 1.875em;\n font-weight: 700;\n margin-bottom: 18px;\n text-transform: uppercase;\n color: $color-font-accent-blue-dark;\n }\n\n}\n",".contest {\n padding-top: 60px;\n margin-top: -1px;\n scroll-margin-top: 180px;\n &-stages {\n padding-top: 120px;\n }\n .section__title-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n \n }\n .section__subtitle {\n margin: 40px 0 0 0;\n }\n} ",".location {\n background-color: $color-font-accent-blue-dark;\n margin-top: -102px;\n padding-top: 120px;\n padding-bottom: 100px;\n position: relative;\n\n .section__title-box {\n margin: 56px 0 12px 0;\n &--virtual {\n margin: 56px 0 0 0;\n }\n }\n .section__button {\n &--locations {\n margin: 35px 0;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 15px;\n }\n }\n .section__button-end {\n margin-bottom: 75px;\n }\n .section__subtitle {\n font-size: 1em;\n }\n .map {\n max-width: 75rem;\n margin-right: auto;\n margin-left: auto;\n \n }\n \n .column {\n }\n \n @include breakpoint(tablet down) {\n .section__button-end {\n align-items: flex-start;\n justify-content: flex-start;\n }\n .map {\n .button {\n width: 75%;\n } \n }\n }\n @include breakpoint(small down) {\n .button {\n width: 100%;\n }\n .map {\n .button {\n width: 100%;\n top: 0;\n } \n }\n }\n}","// home - nagrody\n\n.prizes {\n background: #FFF;\n max-width: 1620px;\n z-index: 99;\n position: relative;\n\n @extend .box-shadow--big;\n &-info {\n padding: 0;\n @include breakpoint (tablet down) {\n padding-top: 0;\n }\n .section__title {\n font-size: 42px;\n @include breakpoint(tablet down) {\n font-size: 32px;\n }\n &-box {\n margin: 62px 0 32px 0;\n }\n }\n \n }\n}\n\n.prize {\n text-align: center;\n padding: 75px 40px;\n font-size: 1.125em;\n border-top: 1px solid $color-border-main;\n border-right: 1px solid $color-border-main;\n $root: &;\n .space-between {\n justify-content: space-between;\n @include breakpoint (small down) {\n display: inline;\n }\n }\n &.-large {\n padding: 64px 210px;\n #{$root}__text {\n &--photo {\n display: flex;\n flex-direction: column;\n justify-content: center;\n video {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n &--amount {\n margin-bottom: 1rem;\n }\n } \n @include breakpoint(large down) {\n padding: 48px 120px;\n }\n @include breakpoint(medium down) {\n padding: 24px;\n }\n }\n @include breakpoint(tablet down) {\n padding: 40px 30px;\n font-size: 0.913em;\n }\n\n @include breakpoint(small down) {\n padding: 30px 30px;\n font-size: 0.875em;\n border-right: 0;\n }\n\n &:first-of-type {\n border-top: 0;\n }\n &__text-photo {\n strong {\n font-weight: 500;\n color: $color-font-dark;\n }\n \n p {\n color: $color-grey-light;\n }\n }\n &__text {\n display: block;\n margin: 10px 0 0 0;\n color: #585F65;\n strong {\n text-transform: uppercase;\n }\n\n &--amount {\n @extend .display-font;\n color: $color-font-accent-blue;\n font-weight: 700;\n font-size: 2.778em;\n position: relative;\n line-height: 1;\n display: inline-block;\n margin: 0;\n }\n\n >span {\n font-size: 0.260em;\n position: absolute;\n bottom: 7px;\n padding-left: 7px;\n left: 100%;\n }\n }\n\n &--full {\n font-size: 1.375em;\n\n @include breakpoint(tablet down) {\n font-size: 1.13em;\n }\n\n @include breakpoint(small down) {\n font-size: 1.15em;\n padding: 50px 30px;\n }\n }\n}\n\n\n.line-styles {\n content: '';\n display: block;\n width: 50%;\n height: 1px;\n position: absolute;\n background: $color-border-main;\n top: 50%;\n\n @include breakpoint(small down) {\n top: 0;\n width: 1px;\n height: 100%;\n background-color: #fff;\n }\n}\n","table {\n tbody {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n}\n\n.table-ranking {\n table {\n display: block;\n overflow: scroll;\n }\n .expand {\n display: flex;\n justify-content: center;\n }\n}",".universal-form {\n background: #FFF;\n padding: 25px;\n \n @extend .box-shadow--big;\n\n &__row {\n border-top: 1px solid $color-border-darker;\n margin-top: 28px;\n padding-top: 22px;\n }\n}",".text {\n font-size: 1em;\n line-height: 1.5;\n\n @include breakpoint(tablet down) {\n font-size: 0.938em;\n }\n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: 1.25em;\n font-weight: 700;\n @extend .display-font;\n margin: 15px 0;\n }\n\n p, ul, ol {\n margin-top: 15px;\n margin-bottom: 15px;\n }\n\n ul, ol {\n li {\n margin-top: 15px;\n margin-bottom: 15px;\n\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n }\n}\n\n.color-accent {\n color: $color-font-accent;\n}\n\n.color-grey {\n color: $color-border-darker;\n}",".accordion {\n width: 100%;\n font-size: 1em;\n background: transparent;\n display: flex;\n flex-direction: column;\n gap: 24px; \n\n @include breakpoint(small down) {\n font-size: 0.875em;\n }\n\n &-item {\n font-size: 1em;\n background-color: #fff;\n\n &.is-active {\n .accordion-title {\n color: $color-font-accent-blue;\n &:before {\n content: icon-char(thin-up);\n }\n }\n }\n }\n .text {\n p {\n margin-top: 0;\n color: $color-theme-accent;\n }\n }\n &-title {\n font-size: 1em;\n line-height: 1.45;\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n padding: 26px 57px 26px 47px;\n border: 0px;\n display: flex;\n gap: 16px;\n \n @include breakpoint(small down) {\n padding: 20px 25px;\n font-size: 1em;\n }\n \n &:before {\n top: 20px;\n right: 42px;\n font-size: 24px;\n margin-top: 0;\n font-weight: 900;\n color: $color-font-accent-blue-dark;\n @include breakpoint(small down) {\n top: 19px;\n right: 15px;\n }\n }\n\n &:focus, &:hover {\n background-color: #fff;\n color: $color-font-accent-blue;\n }\n }\n &-question {\n p {\n font-weight: 700;\n margin-bottom: 0;\n padding: 0;\n color: $color-theme-accent;\n @include breakpoint(small down) {\n padding-right: 10px;\n }\n }\n }\n &-counter {\n min-width: 24px;\n margin-top: 2px;\n width: 24px;\n height: 24px;\n color: $color-font-dark;\n border-radius: 50%;\n border: 1px solid #0171BA;\n text-align: center;\n font-size: 16px;\n line-height: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n \n }\n \n @include breakpoint(small down) {\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 13px;\n line-height: 16px;\n }\n }\n\n &-content {\n padding: 0 47px 20px 40px;\n border-top: 0;\n margin-left: 47px;\n border: none;\n\n @include breakpoint(small down) {\n font-size: 1em;\n padding: 4px 26px 0px 8px;\n }\n }\n\n @extend .box-shadow--big;\n}",".files, .for-media {\n gap: 24px;\n min-height: auto;\n @include breakpoint (large down) {\n justify-content: center;\n }\n .section {\n &__title, &__subtitle {\n text-align: left;\n width: 100%;\n }\n &__title {\n font-weight: 300;\n font-size: 2em;\n }\n &__subtitle {\n font-size: 16px;\n margin-top: 40px;\n }\n &__title-box {\n margin: 40px 0px 40px 0px;\n }\n }\n}\n\n.main-file {\n .section {\n &__title {\n font-size: 2.625em;\n }\n }\n}\n\n\n.files {\n margin-top: 24px; \n}\n.file {\n background: #FFF;\n padding: 15px;\n margin: 15px 0;\n display: block;\n @extend .box-shadow--big;\n \n &--card {\n flex: 0 0 384px;\n max-width: 23.5%;\n min-height: auto;\n padding: 0!important;\n transition: all .5s;\n @include breakpoint (large down) {\n flex: 0 0 45%;\n max-width: 45%;\n }\n \n @include breakpoint (small down) {\n flex: 0 0 90%;\n max-width: 90%;\n }\n a {\n margin: 0!important;\n padding: 24px;\n\n @include breakpoint (medium down) {\n padding: 20px; \n }\n\n }\n }\n\n &__icon {\n font-size: 57px;\n display: block;\n color: $color-font-menu--hover;\n height: 76px;\n @include breakpoint(small down) {\n font-size: 50px;\n margin: 2px 15px 0 10px;\n }\n }\n &__title {\n @extend .display-font;\n font-size: 1.2rem;\n line-height: 1.4rem;\n color: $color-font-accent-blue-dark;\n margin: 10px 0 40px 0;\n font-weight: 700;\n @include breakpoint(tablet down) {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n @include breakpoint(small down) {\n margin: 10px 0;\n }\n }\n &__preview {\n transform-style: preserve-3d;\n transition: $standard-trans;\n position: relative;\n max-height: 419px;\n min-height: 419px;\n img {\n cursor: pointer;\n max-width: 100%;\n width: 100%;\n }\n &:hover {\n opacity: 0.75;\n }\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n margin-left: -30px;\n margin-top: -45px;\n @include icon(play);\n &:before {\n font-size: 60px;\n }\n }\n }\n .button--small {\n margin: 0 0 20px 0;\n color: $color-font-accent-blue-dark;\n font-size: 13px;\n background-color: $color-font-accent-blue--hover;\n font-weight: 600;\n padding: 16px 40px 16px 24px!important;\n position: relative;\n\n @include breakpoint(small down) {\n margin: 10px auto 0 auto;\n }\n .button--arrow-right {\n position: absolute;\n transform: rotate(-45deg);\n bottom: 6px;\n }\n }\n}\n",".winners {\n background: none;\n &__card {\n margin-bottom: 30px;\n display: block;\n .info {\n background-color: #FFF;\n height: 100%;\n }\n \n &--content {\n &-img {\n a {\n margin: 0;\n }\n max-height: 356px;\n min-height: 356px;\n overflow: hidden;\n display: flex;\n img {\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n }\n &-title {\n @extend .display-font;\n margin-bottom: 0px;\n height: 100%;\n padding: 20px 32px;\n font-size: 1em;\n line-height: 1em;\n color: $color-font-accent-blue-dark;\n font-weight: 700;\n text-transform: uppercase; \n }\n }\n }\n .history {\n &__image {\n min-height: 356px;\n max-height: 356px;\n }\n } \n}",".block {\n @extend .universal-form;\n position: relative;\n color: $color-font-dark;\n &__title {\n @extend .page-subtitle;\n margin-bottom: 0;\n & + .button {\n margin-top: 20px;\n }\n }\n\n &__alert {\n @extend .form__info;\n @extend .form__info--error;\n\n font-size: 0.55em;\n text-transform: uppercase;\n }\n\n h1, h2, h3, h4, h5, h6 {\n @extend .display-font;\n margin-bottom: 20px;\n }\n p {\n margin: 0;\n }\n\n\n .graphic {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n\n &--placeholder {\n border: 1px solid $color-border-main; \n margin: 0; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n\n &--edit {\n border: 1px solid $color-border-main; \n &:hover {\n border: 1px solid $color-font-accent--hover; \n }\n }\n }\n}\n\n.project-state {\n padding: 40px 0;\n border-bottom: 1px solid $color-border-main; \n\n &--bottom {\n border-bottom: 0;\n }\n\n &--divider {\n padding-top: 18px;\n }\n}\n\n.image-placeholder {\n\n &--edit {\n .graphic {\n \n &--placeholder {\n margin: 0; \n }\n }\n }\n}\n\n.button-user-submit{\n margin-top: 12px;\n}\n\n\n.annotation-text{\n padding: 20px 10px 0 40px;\n font-size: 12px;\n color: $color-font-accent-blue-dark;\n}\n\n.checkbox {\n &-container {\n a {\n padding: 25px 15px;\n }\n &__hidden {\n .small-4 {\n text-align: center;\n }\n .small-8 {\n margin-bottom: 20px;\n }\n }\n }\n}\n",".listing-topbar {\n &__label {\n color: #929292;\n margin-right: 8px;\n }\n \n &__filters {\n padding-top: 15px;\n padding-bottom: 15px;\n @include breakpoint(small down) {\n padding-top: 15px;\n padding-bottom: 0;\n }\n }\n\n ul {\n list-style: none;\n margin: 0;\n padding: 15px 15px;\n background: #FFF;\n @extend .box-shadow--glow;\n @include border-radius(5px);\n @include breakpoint(medium down) {\n text-align: center;\n }\n &:after {\n display: table;\n content: '';\n clear: both;\n }\n li {\n display: block;\n float: left;\n widtH: 30px;\n height: 30px;\n line-height: 30px;\n text-align: center;\n border: 1px solid #F0F0F0;\n border-radius: 5px;\n &:not(:first-child) {\n margin-left: 5px;\n }\n &.is-borderless {\n border: none;\n }\n a {\n color: $color-font-main;\n transition: .3s ease;\n &:hover {\n color: $color-font-accent;\n }\n }\n &.is-active {\n border-color: $color-font-accent;\n a {\n color: $color-font-accent;\n }\n }\n }\n }\n}\n\n\n.projects-container {\n position: relative;\n padding-top: 15px;\n .listing-topbar {\n ul {\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n }\n #paginator-fixed {\n &.is-fixed {\n width: 100%;\n left: 0;\n right: 0;\n top: 0;\n top: 20px;\n position: fixed;\n background: red;\n border-bottom: blue;\n border-radius: 5px;\n background: #FFF;\n @extend .box-shadow--glow;\n .listing-topbar ul {\n background: transparent;\n box-shadow: none;\n li {\n &.is-active {\n a {\n color: $color-font-accent-blue-dark;\n }\n }\n a {\n color: $color-font-dark;\n }\n }\n }\n @include breakpoint(small down) {\n .listing-topbar__filters {\n display: none;\n }\n }\n }\n }\n}",".counter {\n display: flex;\n justify-content: center;\n\n &__single-item {\n margin: 0 15px;\n float: left;\n }\n\n &__circular-chart {\n display: block;\n height: 100px; // Wysokość okręgu\n width: 100px;\n\n @include breakpoint(medium down) {\n height: 50px;\n width: auto;\n }\n }\n\n &__circle-bottom {\n fill: none;\n stroke: #ffffff52;\n stroke-width: 1.5;\n }\n\n &__circle-top {\n fill: none;\n stroke-width: 1.8;\n stroke-linecap: square;\n stroke: $color-theme-main;\n transition: all 0.5s ease-in-out;\n }\n\n &__time {\n fill: $color-theme-main;\n font-size: 0.7em; // Ma być em dla skalowalności na mobile!\n font-weight: 700;\n text-anchor: middle;\n }\n\n &__text {\n margin-top: 10px;\n font-family: 'Muli', sans-serif;\n text-align: center;\n color: $color-theme-main;\n }\n}\n",".merlini {\n background-color: #003061;\n padding-top: 40px;\n &__title {\n font-size: 42px;\n font-weight: 700;\n \n\n @include breakpoint( tablet down ) {\n font-size: 32px;\n }\n @include breakpoint (small down) {\n word-wrap: break-word;\n }\n &--accent {\n color: $color-font-accent;\n display: block;\n font-weight: 300;\n }\n }\n .align-middle {\n justify-content: space-between;\n }\n &__photo-desc {\n font-size: 10px;\n opacity: .75;\n\n @include breakpoint(tablet down) {\n padding: 0 30px;\n }\n\n @include breakpoint(small down) {\n padding: 0 15px;\n }\n }\n @include breakpoint (small down) {\n padding-top: 20px;\n .button {\n width: 100%;\n }\n }\n @include breakpoint (tablet down) {\n .align-middle {\n .column {\n padding: 0;\n }\n }\n }\n .section__title-box {\n @include breakpoint (small down) {\n margin-top: 0px;\n }\n }\n}",".blog {\n &__list {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n \n &--item {\n flex: 0 0 24%; \n margin-bottom: 20px;\n height: auto!important;\n @include breakpoint (large down) {\n flex: 0 0 30%;\n }\n @include breakpoint (tablet down) {\n flex: 0 0 32%;\n }\n @include breakpoint (medium down) {\n flex: 0 0 45%;\n }\n @include breakpoint (small down) {\n flex: 0 0 100%;\n }\n &__content {\n background: $color-theme-main;\n box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1);\n height: 100%;\n }\n\n &__wrap {\n padding: 18px 26px;\n }\n\n &__photo-box {\n max-height: 286px;\n min-height: 286px;\n height: 100%;\n overflow: hidden;\n img {\n max-height: 384px;\n min-height: 384px;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n\n &__date {\n font-size: 12px;\n line-height: 1.87;\n color: $color-font-dark;\n margin: 0;\n }\n &__title {\n font-size: 16px;\n line-height: 1.2;\n margin: 15px 0;\n > a, > h2 {\n font-weight: 700;\n\n }\n }\n &__title {\n color: $color-font-dark;\n a {\n color: $color-font-dark;\n }\n }\n\n &__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: $color-font-dark;\n margin: 0;\n }\n\n &__readmore {\n margin-top: 15px;\n a {\n color: #00182F;\n font-size: 13px;\n font-weight: 600;\n }\n }\n a, p, h1, h2, h3, h4, h5, h6, span {\n color: $color-font-accent-blue-dark;\n }\n time {\n color: $color-border-darker;\n font-size: 12px;\n }\n }\n }\n}\n",".blog-single {\n background: $color-theme-main;\n margin-top: 56px;\n justify-content: center;\n @include breakpoint (small down) {\n max-width: 95%;\n margin: 2.5% auto;\n }\n @include breakpoint (large down) {\n max-width: 90%;\n margin: 5% auto;\n }\n &__top {\n position: relative;\n &--link {\n position: absolute;\n color: $color-border-darker;\n top: 3px;\n left: -64px;\n margin: 0;\n display: flex;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n border: 2px solid $color-border-darker;\n justify-content: center;\n align-items: center;\n transition: all .5s;\n \n &:before {\n font-size: 16px;\n font-weight: 700;\n margin-right: 0;\n }\n\n &:hover {\n cursor: pointer;\n color: $button-background-dark--font;\n background-color: $button-background-dark;\n }\n }\n &--title {\n color: $color-font-accent-blue-dark;\n text-align: left;\n text-transform: none;\n font-weight: 700;\n font-size: 42px;\n line-height: 48px;\n margin: 52px 0px 24px 0px;\n\n @include breakpoint (tablet down) {\n font-size: 36px;\n line-height: 40px;\n }\n\n @include breakpoint (medium down) {\n font-size: 28px;\n line-height: 32px;\n }\n }\n &--date {\n time {\n color: #585F65;\n font-size: 20px;\n\n }\n }\n\n }\n\n &__content {\n margin: 24px 0px 40px 0px;\n }\n\n &__bottom--back {\n position: relative;\n left: -70px;\n \n @include breakpoint (small down) {\n left: 0;\n }\n button {\n \n margin-bottom: 56px;\n border: 1px solid $color-border-darker;\n color: $color-border-darker;\n border-radius: 2px;\n padding: 16px 14px;\n font-size: 13px;\n font-weight: 600;\n display: flex;\n align-items: center;\n text-transform: none;\n height: 48px;\n &:hover {\n background-color: $button-background-light;\n border: 1px solid $button-background-light;\n color: $button-background-light--font;\n }\n }\n\n }\n\n &__date {\n font-size: 22px;\n line-height: 1.09;\n color: $color-font-dark;\n text-transform: uppercase;\n }\n\n &__photo-box {\n margin-bottom: 15px;\n }\n\n &__text-wysiwyg {\n\n h2,\n h3,\n h4 {\n line-height: 1.6;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n\n h2 {\n font-size: 22px;\n }\n\n h3 {\n font-size: 16px;\n }\n\n p {\n line-height: 1.5;\n color: $color-font-dark;\n margin-bottom: 15px;\n }\n \n strong {\n font-weight: 700;\n color: $color-font-accent-blue-dark;\n }\n \n\n figure {\n display: block;\n margin: 0;\n\n &.wp-block-image {\n margin-top: 35px;\n margin-bottom: 50px;\n text-align: center;\n }\n\n &.wp-block-image:last-child {\n margin-top: 35px;\n margin-bottom: 0;\n }\n\n &.wp-block-image:first-child {\n margin: 0;\n }\n }\n\n figcaption {\n font-size: 12px;\n margin-top: 10px;\n margin-bottom: 0;\n }\n\n .blue {\n figcaption {\n color: #00AEEF;\n }\n }\n\n .wp-block-columns {\n margin-top: 0;\n margin-bottom: 50px;\n\n &--low-margin {\n margin-bottom: 15px;\n }\n\n &.wp-block-image:last-child {\n margin-top: 0;\n margin-bottom: 0;\n }\n }\n\n .wp-block-embed-youtube {\n position: relative;\n padding-bottom: 56.25%;\n /* 16:9 */\n height: 0;\n }\n iframe {\n max-width: 100%;\n }\n .wp-block-embed-youtube iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n [mda-readmore] {\n display: block;\n color: $color-font-accent;\n cursor: pointer;\n @include transition('all 0.15s ease-in');\n\n &:hover {\n color: $color-font-accent--hover;\n }\n\n @include icon(arrow-bottom, after);\n\n &:after {\n vertical-align: -1px;\n font-size: 12px;\n margin-left: 10px;\n }\n }\n\n [mda-readmore-id] {\n display: none;\n }\n\n .free-space {\n height: 30px;\n width: 100%;\n display: block;\n }\n }\n}",".site-footer {\n color: $color-font-main;\n margin-top: 60px;\n font-size: 0.813em;\n font-size: 13px;\n background-color: $color-font-accent-blue-dark;\n width: 100%;\n .row {\n padding: 25px 0px;\n max-width: 1620px!important;\n }\n &__line {\n &::after {\n content: '';\n width: 100%;\n displaY: block;\n border-bottom: 1px solid $color-border-main;\n }\n\n @include breakpoint(small down) {\n margin-bottom: 20px\n }\n }\n\n @include breakpoint(tablet down) {\n padding: 0 0 40px;\n }\n\n @include breakpoint(small down) {\n padding: 0;\n }\n \n @include breakpoint(small down) {\n text-align: center;\n }\n\n &--right {\n text-align: right;\n\n @include breakpoint(small down) {\n text-align: center;\n margin-top: 24px;\n }\n }\n &--left {\n display: flex;\n gap: 16px;\n @include breakpoint(small down) {\n flex-direction: column; \n }\n \n }\n\n &--bottom {\n\n img {\n vertical-align: -2px;\n height: 16px;\n @include breakpoint(small down) {\n object-fit: contain;\n }\n }\n }\n\n &__logo {\n height: 68px;\n\n @include breakpoint(small down) {\n margin-bottom: 30px;\n }\n }\n\n &__social-media {\n text-transform: uppercase;\n\n @include breakpoint(small down) {\n display: inline-block;\n\n &:last-of-type {\n margin-bottom: 30px;\n }\n }\n\n .icon {\n font-size: 36px;\n vertical-align: middle;\n margin-left: 10px;\n }\n\n a {\n color: #FFF;\n }\n }\n}"]} @charset "UTF-8"; /** * Foundation for Sites * Version 6.7.4 * https://get.foundation * Licensed under MIT Open Source */ @import url("https://use.typekit.net/fzj6pjt.css"); @media print, screen and (min-width: 40em) { .reveal, .reveal.tiny, .reveal.small, .reveal.large { right: auto; left: auto; margin: 0 auto; } } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } [data-whatintent="mouse"] *, [data-whatintent="mouse"] *:focus, [data-whatintent="touch"] *, [data-whatintent="touch"] *:focus, [data-whatinput="mouse"] *, [data-whatinput="mouse"] *:focus, [data-whatinput="touch"] *, [data-whatinput="touch"] *:focus { outline: none; } [draggable=false] { -webkit-touch-callout: none; -webkit-user-select: none; } .foundation-mq { font-family: "small=0em&medium=40em&tablet=48.0625em&large=64.0625em&xlarge=75em&xxlarge=101.25em"; } html { box-sizing: border-box; font-size: 100%; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; padding: 0; background: #fefefe; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } textarea { height: auto; min-height: 50px; border-radius: 0; } select { box-sizing: border-box; width: 100%; border-radius: 0; } .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; } button { padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent; line-height: 1; cursor: auto; } [data-whatinput='mouse'] button { outline: 0; } pre { overflow: auto; -webkit-overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; } .is-visible { display: block !important; } .is-hidden { display: none !important; } .row { max-width: 75rem; margin-right: auto; margin-left: auto; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .row .row { margin-right: -1.25rem; margin-left: -1.25rem; } @media print, screen and (min-width: 40em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 75em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } @media screen and (min-width: 101.25em) { .row .row { margin-right: -0.9375rem; margin-left: -0.9375rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; padding-right: 1.25rem; padding-left: 1.25rem; min-width: 0; } @media print, screen and (min-width: 40em) { .column, .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .small-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .small-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .small-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .small-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 1.25rem; padding-left: 1.25rem; } @media print, screen and (min-width: 40em) { .medium-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .medium-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .medium-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .medium-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .medium-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 40em) and (min-width: 40em) { .medium-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 40em) { .row.medium-unstack > .column, .row.medium-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 40em) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 48.0625em) { .tablet-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .tablet-offset-0 { margin-left: 0%; } .tablet-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-offset-1 { margin-left: 8.33333%; } .tablet-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-offset-2 { margin-left: 16.66667%; } .tablet-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-offset-3 { margin-left: 25%; } .tablet-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .tablet-offset-4 { margin-left: 33.33333%; } .tablet-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-offset-5 { margin-left: 41.66667%; } .tablet-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .tablet-offset-6 { margin-left: 50%; } .tablet-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .tablet-offset-7 { margin-left: 58.33333%; } .tablet-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tablet-offset-8 { margin-left: 66.66667%; } .tablet-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .tablet-offset-9 { margin-left: 75%; } .tablet-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .tablet-offset-10 { margin-left: 83.33333%; } .tablet-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-offset-11 { margin-left: 91.66667%; } .tablet-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-1 > .column, .tablet-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tablet-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-2 > .column, .tablet-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tablet-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-3 > .column, .tablet-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .tablet-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-4 > .column, .tablet-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tablet-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-5 > .column, .tablet-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tablet-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-6 > .column, .tablet-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .tablet-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-7 > .column, .tablet-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .tablet-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tablet-up-8 > .column, .tablet-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 48.0625em) and (min-width: 48.0625em) { .tablet-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 48.0625em) { .row.tablet-unstack > .column, .row.tablet-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .tablet-collapse > .column, .tablet-collapse > .columns { padding-right: 0; padding-left: 0; } .tablet-uncollapse > .column, .tablet-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media print, screen and (min-width: 64.0625em) { .large-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-offset-3 { margin-left: 25%; } .large-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .large-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .large-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .large-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .large-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media print, screen and (min-width: 64.0625em) and (min-width: 64.0625em) { .large-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media print, screen and (min-width: 64.0625em) { .row.large-unstack > .column, .row.large-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 75em) { .xlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xlarge-offset-0 { margin-left: 0%; } .xlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-offset-1 { margin-left: 8.33333%; } .xlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-offset-2 { margin-left: 16.66667%; } .xlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-offset-3 { margin-left: 25%; } .xlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xlarge-offset-4 { margin-left: 33.33333%; } .xlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-offset-5 { margin-left: 41.66667%; } .xlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xlarge-offset-6 { margin-left: 50%; } .xlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xlarge-offset-7 { margin-left: 58.33333%; } .xlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xlarge-offset-8 { margin-left: 66.66667%; } .xlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xlarge-offset-9 { margin-left: 75%; } .xlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xlarge-offset-10 { margin-left: 83.33333%; } .xlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-offset-11 { margin-left: 91.66667%; } .xlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-1 > .column, .xlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-2 > .column, .xlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-3 > .column, .xlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-4 > .column, .xlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-5 > .column, .xlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-6 > .column, .xlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-7 > .column, .xlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xlarge-up-8 > .column, .xlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 75em) and (min-width: 75em) { .xlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 75em) { .row.xlarge-unstack > .column, .row.xlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .xlarge-collapse > .column, .xlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xlarge-uncollapse > .column, .xlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } @media screen and (min-width: 101.25em) { .xxlarge-1 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .xxlarge-offset-0 { margin-left: 0%; } .xxlarge-2 { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-offset-1 { margin-left: 8.33333%; } .xxlarge-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-offset-2 { margin-left: 16.66667%; } .xxlarge-4 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-offset-3 { margin-left: 25%; } .xxlarge-5 { -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .xxlarge-offset-4 { margin-left: 33.33333%; } .xxlarge-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-offset-5 { margin-left: 41.66667%; } .xxlarge-7 { -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .xxlarge-offset-6 { margin-left: 50%; } .xxlarge-8 { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .xxlarge-offset-7 { margin-left: 58.33333%; } .xxlarge-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .xxlarge-offset-8 { margin-left: 66.66667%; } .xxlarge-10 { -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .xxlarge-offset-9 { margin-left: 75%; } .xxlarge-11 { -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .xxlarge-offset-10 { margin-left: 83.33333%; } .xxlarge-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-offset-11 { margin-left: 91.66667%; } .xxlarge-up-1 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-1 > .column, .xxlarge-up-1 > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .xxlarge-up-2 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-2 > .column, .xxlarge-up-2 > .columns { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .xxlarge-up-3 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-3 > .column, .xxlarge-up-3 > .columns { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .xxlarge-up-4 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-4 > .column, .xxlarge-up-4 > .columns { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .xxlarge-up-5 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-5 > .column, .xxlarge-up-5 > .columns { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .xxlarge-up-6 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-6 > .column, .xxlarge-up-6 > .columns { -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .xxlarge-up-7 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-7 > .column, .xxlarge-up-7 > .columns { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; } .xxlarge-up-8 { -ms-flex-wrap: wrap; flex-wrap: wrap; } .xxlarge-up-8 > .column, .xxlarge-up-8 > .columns { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 101.25em) and (min-width: 101.25em) { .xxlarge-expand { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 0 0 100%; flex: 0 0 100%; } @media screen and (min-width: 101.25em) { .row.xxlarge-unstack > .column, .row.xxlarge-unstack > .columns { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .xxlarge-collapse > .column, .xxlarge-collapse > .columns { padding-right: 0; padding-left: 0; } .xxlarge-uncollapse > .column, .xxlarge-uncollapse > .columns { padding-right: 0.9375rem; padding-left: 0.9375rem; } } .shrink { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 2.5rem; } .column-block > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } } .align-left { -ms-flex-pack: start; justify-content: flex-start; } .align-right { -ms-flex-pack: end; justify-content: flex-end; } .align-center { -ms-flex-pack: center; justify-content: center; } .align-justify { -ms-flex-pack: justify; justify-content: space-between; } .align-spaced { -ms-flex-pack: distribute; justify-content: space-around; } .align-left.vertical.menu > li > a { -ms-flex-pack: start; justify-content: flex-start; } .align-right.vertical.menu > li > a { -ms-flex-pack: end; justify-content: flex-end; } .align-center.vertical.menu > li > a { -ms-flex-pack: center; justify-content: center; } .align-top { -ms-flex-align: start; align-items: flex-start; } .align-self-top { -ms-flex-item-align: start; align-self: flex-start; } .align-bottom { -ms-flex-align: end; align-items: flex-end; } .align-self-bottom { -ms-flex-item-align: end; align-self: flex-end; } .align-middle { -ms-flex-align: center; align-items: center; } .align-self-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-stretch { -ms-flex-align: stretch; align-items: stretch; } .align-self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; } .align-center-middle { -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .small-order-1 { -ms-flex-order: 1; order: 1; } .small-order-2 { -ms-flex-order: 2; order: 2; } .small-order-3 { -ms-flex-order: 3; order: 3; } .small-order-4 { -ms-flex-order: 4; order: 4; } .small-order-5 { -ms-flex-order: 5; order: 5; } .small-order-6 { -ms-flex-order: 6; order: 6; } @media print, screen and (min-width: 40em) { .medium-order-1 { -ms-flex-order: 1; order: 1; } .medium-order-2 { -ms-flex-order: 2; order: 2; } .medium-order-3 { -ms-flex-order: 3; order: 3; } .medium-order-4 { -ms-flex-order: 4; order: 4; } .medium-order-5 { -ms-flex-order: 5; order: 5; } .medium-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 48.0625em) { .tablet-order-1 { -ms-flex-order: 1; order: 1; } .tablet-order-2 { -ms-flex-order: 2; order: 2; } .tablet-order-3 { -ms-flex-order: 3; order: 3; } .tablet-order-4 { -ms-flex-order: 4; order: 4; } .tablet-order-5 { -ms-flex-order: 5; order: 5; } .tablet-order-6 { -ms-flex-order: 6; order: 6; } } @media print, screen and (min-width: 64.0625em) { .large-order-1 { -ms-flex-order: 1; order: 1; } .large-order-2 { -ms-flex-order: 2; order: 2; } .large-order-3 { -ms-flex-order: 3; order: 3; } .large-order-4 { -ms-flex-order: 4; order: 4; } .large-order-5 { -ms-flex-order: 5; order: 5; } .large-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 75em) { .xlarge-order-1 { -ms-flex-order: 1; order: 1; } .xlarge-order-2 { -ms-flex-order: 2; order: 2; } .xlarge-order-3 { -ms-flex-order: 3; order: 3; } .xlarge-order-4 { -ms-flex-order: 4; order: 4; } .xlarge-order-5 { -ms-flex-order: 5; order: 5; } .xlarge-order-6 { -ms-flex-order: 6; order: 6; } } @media screen and (min-width: 101.25em) { .xxlarge-order-1 { -ms-flex-order: 1; order: 1; } .xxlarge-order-2 { -ms-flex-order: 2; order: 2; } .xxlarge-order-3 { -ms-flex-order: 3; order: 3; } .xxlarge-order-4 { -ms-flex-order: 4; order: 4; } .xxlarge-order-5 { -ms-flex-order: 5; order: 5; } .xxlarge-order-6 { -ms-flex-order: 6; order: 6; } } .flex-container { display: -ms-flexbox; display: flex; } .flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } @media print, screen and (min-width: 40em) { .medium-flex-container { display: -ms-flexbox; display: flex; } .medium-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .medium-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .medium-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .medium-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .medium-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .medium-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .medium-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 48.0625em) { .tablet-flex-container { display: -ms-flexbox; display: flex; } .tablet-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .tablet-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .tablet-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .tablet-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .tablet-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .tablet-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .tablet-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media print, screen and (min-width: 64.0625em) { .large-flex-container { display: -ms-flexbox; display: flex; } .large-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .large-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .large-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .large-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .large-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .large-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .large-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 75em) { .xlarge-flex-container { display: -ms-flexbox; display: flex; } .xlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media screen and (min-width: 101.25em) { .xxlarge-flex-container { display: -ms-flexbox; display: flex; } .xxlarge-flex-child-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .xxlarge-flex-child-grow { -ms-flex: 1 0 auto; flex: 1 0 auto; } .xxlarge-flex-child-shrink { -ms-flex: 0 1 auto; flex: 0 1 auto; } .xxlarge-flex-dir-row { -ms-flex-direction: row; flex-direction: row; } .xxlarge-flex-dir-row-reverse { -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .xxlarge-flex-dir-column { -ms-flex-direction: column; flex-direction: column; } .xxlarge-flex-dir-column-reverse { -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 80%; line-height: inherit; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-style: normal; font-weight: normal; color: inherit; text-rendering: optimizeLegibility; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small { line-height: 0; color: #cacaca; } h1, .h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h2, .h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { font-size: 1.0625rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } @media print, screen and (min-width: 40em) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.5rem; } h3, .h3 { font-size: 1.9375rem; } h4, .h4 { font-size: 1.5625rem; } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } } a { line-height: inherit; color: #307772; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: #296662; } a img { border: 0; } hr { clear: both; max-width: 75rem; height: 0; margin: 1.25rem auto; border-top: 0; border-right: 0; border-bottom: 1px solid #cacaca; border-left: 0; } ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; line-height: 1.6; } li { font-size: inherit; } ul { margin-left: 1.25rem; list-style-type: disc; } ol { margin-left: 1.25rem; } ul ul, ol ul, ul ol, ol ol { margin-left: 1.25rem; margin-bottom: 0; } dl { margin-bottom: 1rem; } dl dt { margin-bottom: 0.3rem; font-weight: bold; } blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #cacaca; } blockquote, blockquote p { line-height: 1.6; color: #8a8a8a; } abbr, abbr[title] { border-bottom: 1px dotted #0a0a0a; cursor: help; text-decoration: none; } figure { margin: 0; } kbd { margin: 0; padding: 0.125rem 0.25rem 0; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; } .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: normal; line-height: 1.4; color: #8a8a8a; } .lead { font-size: 125%; line-height: 1.6; } .stat { font-size: 2.5rem; line-height: 1; } p + .stat { margin-top: -1rem; } ul.no-bullet, ol.no-bullet { margin-left: 0; list-style: none; } cite, .cite-block { display: block; color: #8a8a8a; font-size: 0.8125rem; } cite:before, .cite-block:before { content: "— "; } code, .code-inline { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: inline; max-width: 100%; word-wrap: break-word; padding: 0.125rem 0.3125rem 0.0625rem; } .code-block { border: 1px solid #cacaca; background-color: #e6e6e6; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; color: #0a0a0a; display: block; overflow: auto; white-space: pre; padding: 1rem; margin-bottom: 1.5rem; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } @media print, screen and (min-width: 40em) { .medium-text-left { text-align: left; } .medium-text-right { text-align: right; } .medium-text-center { text-align: center; } .medium-text-justify { text-align: justify; } } @media print, screen and (min-width: 48.0625em) { .tablet-text-left { text-align: left; } .tablet-text-right { text-align: right; } .tablet-text-center { text-align: center; } .tablet-text-justify { text-align: justify; } } @media print, screen and (min-width: 64.0625em) { .large-text-left { text-align: left; } .large-text-right { text-align: right; } .large-text-center { text-align: center; } .large-text-justify { text-align: justify; } } @media screen and (min-width: 75em) { .xlarge-text-left { text-align: left; } .xlarge-text-right { text-align: right; } .xlarge-text-center { text-align: center; } .xlarge-text-justify { text-align: justify; } } @media screen and (min-width: 101.25em) { .xxlarge-text-left { text-align: left; } .xxlarge-text-right { text-align: right; } .xxlarge-text-center { text-align: center; } .xxlarge-text-justify { text-align: justify; } } .show-for-print { display: none !important; } @media print { * { background: transparent !important; color: black !important; color-adjust: economy; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #8a8a8a; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .print-break-inside { page-break-inside: auto; } } [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, textarea:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } textarea { max-width: 100%; } textarea[rows] { height: auto; } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: #e6e6e6; cursor: not-allowed; } [type='submit'], [type='button'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } input[type='search'] { box-sizing: border-box; } :-ms-input-placeholder { color: #cacaca; } ::placeholder { color: #cacaca; } [type='file'], [type='checkbox'], [type='radio'] { margin: 0 0 1rem; } [type='checkbox'] + label, [type='radio'] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; margin-bottom: 0; } [type='checkbox'] + label[for], [type='radio'] + label[for] { cursor: pointer; } label > [type='checkbox'], label > [type='radio'] { margin-right: 0.5rem; } [type='file'] { width: 100%; } label { display: block; margin: 0; font-size: 0.875rem; font-weight: normal; line-height: 1.8; color: #0a0a0a; } label.middle { margin: 0 0 1rem; line-height: 1.5; padding: 0.5625rem 0; } .help-text { margin-top: -0.5rem; font-size: 0.8125rem; font-style: italic; color: #0a0a0a; } .input-group { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 1rem; -ms-flex-align: stretch; align-items: stretch; } .input-group > :first-child, .input-group > :first-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group > :last-child, .input-group > :last-child.input-group-button > * { border-radius: 0 0 0 0; } .input-group-label, .input-group-field, .input-group-button, .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; } .input-group-label { padding: 0 1rem; border: 1px solid #cacaca; background: #e6e6e6; color: #0a0a0a; text-align: center; white-space: nowrap; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-align: center; align-items: center; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; -ms-flex: 1 1 0px; flex: 1 1 0px; min-width: 0; } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; flex: 0 0 auto; } .input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; height: auto; padding-top: 0; padding-bottom: 0; font-size: 1rem; } fieldset { margin: 0; padding: 0; border: 0; } legend { max-width: 100%; margin-bottom: 0.5rem; } .fieldset { margin: 1.125rem 0; padding: 1.25rem; border: 1px solid #cacaca; } .fieldset legend { margin: 0; margin-left: -0.1875rem; padding: 0 0.1875rem; } select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-family: inherit; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #0a0a0a; background-image: url('data:image/svg+xml;utf8,'); background-origin: content-box; background-position: right -1rem center; background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } @media screen and (min-width: 0\0) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } select:focus { outline: none; border: 1px solid #8a8a8a; background-color: #fefefe; box-shadow: 0 0 5px #cacaca; transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } select:disabled { background-color: #e6e6e6; cursor: not-allowed; } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } select:not([multiple]) { padding-top: 0; padding-bottom: 0; } .is-invalid-input:not(:focus) { border-color: #cc4b37; background-color: #f9ecea; } .is-invalid-input:not(:focus):-ms-input-placeholder { color: #cc4b37; } .is-invalid-input:not(:focus)::placeholder { color: #cc4b37; } .is-invalid-label { color: #cc4b37; } .form-error { display: none; margin-top: -0.5rem; margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; color: #cc4b37; } .form-error.is-visible { display: block; } .button { display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; padding: 0.85em 1em; border: 1px solid transparent; border-radius: 0; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; } [data-whatinput='mouse'] .button { outline: 0; } .button.tiny { font-size: 0.6rem; } .button.small { font-size: 0.75rem; } .button.large { font-size: 1.25rem; } .button.expanded { display: block; width: 100%; margin-right: 0; margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button:hover, .button:focus { background-color: #296561; color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { background-color: #307772; color: #fefefe; } .button.primary:hover, .button.primary:focus { background-color: #265f5b; color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { background-color: #767676; color: #fefefe; } .button.secondary:hover, .button.secondary:focus { background-color: #5e5e5e; color: #fefefe; } .button.success, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button.success:hover, .button.success:focus { background-color: #22bb5b; color: #0a0a0a; } .button.warning, .button.warning.disabled, .button.warning[disabled], .button.warning.disabled:hover, .button.warning[disabled]:hover, .button.warning.disabled:focus, .button.warning[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button.warning:hover, .button.warning:focus { background-color: #cc8b00; color: #0a0a0a; } .button.alert, .button.alert.disabled, .button.alert[disabled], .button.alert.disabled:hover, .button.alert[disabled]:hover, .button.alert.disabled:focus, .button.alert[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button.alert:hover, .button.alert:focus { background-color: #a53b2a; color: #fefefe; } .button.hollow, .button.hollow:hover, .button.hollow:focus, .button.hollow.disabled, .button.hollow.disabled:hover, .button.hollow.disabled:focus, .button.hollow[disabled], .button.hollow[disabled]:hover, .button.hollow[disabled]:focus { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow:hover, .button.hollow:focus { border-color: #183c39; color: #183c39; } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button.hollow.primary:hover, .button.hollow.primary:focus { border-color: #183c39; color: #183c39; } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button.hollow.secondary:hover, .button.hollow.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button.hollow.success, .button.hollow.success.disabled, .button.hollow.success[disabled], .button.hollow.success.disabled:hover, .button.hollow.success[disabled]:hover, .button.hollow.success.disabled:focus, .button.hollow.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button.hollow.success:hover, .button.hollow.success:focus { border-color: #157539; color: #157539; } .button.hollow.warning, .button.hollow.warning.disabled, .button.hollow.warning[disabled], .button.hollow.warning.disabled:hover, .button.hollow.warning[disabled]:hover, .button.hollow.warning.disabled:focus, .button.hollow.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button.hollow.warning:hover, .button.hollow.warning:focus { border-color: #805700; color: #805700; } .button.hollow.alert, .button.hollow.alert.disabled, .button.hollow.alert[disabled], .button.hollow.alert.disabled:hover, .button.hollow.alert[disabled]:hover, .button.hollow.alert.disabled:focus, .button.hollow.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button.hollow.alert:hover, .button.hollow.alert:focus { border-color: #67251a; color: #67251a; } .button.clear, .button.clear:hover, .button.clear:focus, .button.clear.disabled, .button.clear.disabled:hover, .button.clear.disabled:focus, .button.clear[disabled], .button.clear[disabled]:hover, .button.clear[disabled]:focus { border-color: transparent; background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { color: #307772; } .button.clear:hover, .button.clear:focus { color: #183c39; } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { color: #307772; } .button.clear.primary:hover, .button.clear.primary:focus { color: #183c39; } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; } .button.clear.secondary:hover, .button.clear.secondary:focus { color: #3b3b3b; } .button.clear.success, .button.clear.success.disabled, .button.clear.success[disabled], .button.clear.success.disabled:hover, .button.clear.success[disabled]:hover, .button.clear.success.disabled:focus, .button.clear.success[disabled]:focus { color: #3adb76; } .button.clear.success:hover, .button.clear.success:focus { color: #157539; } .button.clear.warning, .button.clear.warning.disabled, .button.clear.warning[disabled], .button.clear.warning.disabled:hover, .button.clear.warning[disabled]:hover, .button.clear.warning.disabled:focus, .button.clear.warning[disabled]:focus { color: #ffae00; } .button.clear.warning:hover, .button.clear.warning:focus { color: #805700; } .button.clear.alert, .button.clear.alert.disabled, .button.clear.alert[disabled], .button.clear.alert.disabled:hover, .button.clear.alert[disabled]:hover, .button.clear.alert.disabled:focus, .button.clear.alert[disabled]:focus { color: #cc4b37; } .button.clear.alert:hover, .button.clear.alert:focus { color: #67251a; } .button.disabled, .button[disabled] { opacity: 0.25; cursor: not-allowed; } .button.dropdown::after { display: block; width: 0; height: 0; border-style: solid; border-width: 0.4em; content: ''; border-bottom-width: 0; border-color: #fefefe transparent transparent; position: relative; top: 0.4em; display: inline-block; float: right; margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { border-top-color: #307772; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { border-top-color: #307772; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; } .button.dropdown.hollow.success::after, .button.dropdown.clear.success::after { border-top-color: #3adb76; } .button.dropdown.hollow.warning::after, .button.dropdown.clear.warning::after { border-top-color: #ffae00; } .button.dropdown.hollow.alert::after, .button.dropdown.clear.alert::after { border-top-color: #cc4b37; } .button.arrow-only::after { top: -0.1em; float: none; margin-left: 0; } a.button:hover, a.button:focus { text-decoration: none; } .accordion { margin-left: 0; background: #fefefe; list-style-type: none; } .accordion[disabled] .accordion-title { cursor: not-allowed; } .accordion-item:first-child > :first-child { border-radius: 0 0 0 0; } .accordion-item:last-child > :last-child { border-radius: 0 0 0 0; } .accordion-title { position: relative; display: block; padding: 1.25rem 1rem; border: 1px solid #e6e6e6; border-bottom: 0; font-size: 0.75rem; line-height: 1; color: #307772; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; border-radius: 0 0 0 0; } .accordion-title:hover, .accordion-title:focus { background-color: #e6e6e6; } .accordion-title::before { position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; content: "+"; } .is-active > .accordion-title::before { content: "–"; } .accordion-content { display: none; padding: 1rem; border: 1px solid #e6e6e6; border-bottom: 0; background-color: #fefefe; color: #0a0a0a; } :last-child > .accordion-content:last-child { border-bottom: 1px solid #e6e6e6; } .accordion-menu li { width: 100%; } .accordion-menu a { padding: 0.7rem 1rem; } .accordion-menu .is-accordion-submenu a { padding: 0.7rem 1rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; margin-left: 1rem; } .accordion-menu.align-right .nested.is-accordion-submenu { margin-right: 1rem; margin-left: 0; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a { position: relative; } .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; position: absolute; top: 50%; margin-top: -3px; right: 1rem; } .accordion-menu.align-left .is-accordion-submenu-parent > a::after { right: 1rem; left: auto; } .accordion-menu.align-right .is-accordion-submenu-parent > a::after { right: auto; left: 1rem; } .accordion-menu .is-accordion-submenu-parent[aria-expanded='true'] > a::after { -ms-transform: rotate(180deg); transform: rotate(180deg); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .is-accordion-submenu-parent { position: relative; } .has-submenu-toggle > a { margin-right: 40px; } .submenu-toggle { position: absolute; top: 0; right: 0; width: 40px; height: 40px; cursor: pointer; } .submenu-toggle::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; top: 0; bottom: 0; margin: auto; } .submenu-toggle[aria-expanded='true']::after { -ms-transform: scaleY(-1); transform: scaleY(-1); -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .submenu-toggle-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .badge { display: inline-block; min-width: 2.1em; padding: 0.3em; border-radius: 50%; font-size: 0.6rem; text-align: center; background: #307772; color: #fefefe; } .badge.primary { background: #307772; color: #fefefe; } .badge.secondary { background: #767676; color: #fefefe; } .badge.success { background: #3adb76; color: #0a0a0a; } .badge.warning { background: #ffae00; color: #0a0a0a; } .badge.alert { background: #cc4b37; color: #fefefe; } .breadcrumbs { margin: 0 0 1rem 0; list-style: none; } .breadcrumbs::before, .breadcrumbs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .breadcrumbs::after { clear: both; } .breadcrumbs li { float: left; font-size: 0.6875rem; color: #0a0a0a; cursor: default; text-transform: uppercase; } .breadcrumbs li:not(:last-child)::after { position: relative; margin: 0 0.75rem; opacity: 1; content: "/"; color: #cacaca; } .breadcrumbs a { color: #307772; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs .disabled { color: #cacaca; cursor: not-allowed; } .button-group { margin-bottom: 1rem; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; -ms-flex-positive: 1; flex-grow: 1; } .button-group::before, .button-group::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .button-group::after { clear: both; } .button-group::before, .button-group::after { display: none; } .button-group .button { margin: 0; margin-right: 1px; margin-bottom: 1px; font-size: 0.9rem; -ms-flex: 0 0 auto; flex: 0 0 auto; } .button-group .button:last-child { margin-right: 0; } .button-group.tiny .button { font-size: 0.6rem; } .button-group.small .button { font-size: 0.75rem; } .button-group.large .button { font-size: 1.25rem; } .button-group.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { background-color: #307772; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { background-color: #265f5b; color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { background-color: #767676; color: #fefefe; } .button-group.secondary .button:hover, .button-group.secondary .button:focus { background-color: #5e5e5e; color: #fefefe; } .button-group.success .button, .button-group.success .button.disabled, .button-group.success .button[disabled], .button-group.success .button.disabled:hover, .button-group.success .button[disabled]:hover, .button-group.success .button.disabled:focus, .button-group.success .button[disabled]:focus { background-color: #3adb76; color: #0a0a0a; } .button-group.success .button:hover, .button-group.success .button:focus { background-color: #22bb5b; color: #0a0a0a; } .button-group.warning .button, .button-group.warning .button.disabled, .button-group.warning .button[disabled], .button-group.warning .button.disabled:hover, .button-group.warning .button[disabled]:hover, .button-group.warning .button.disabled:focus, .button-group.warning .button[disabled]:focus { background-color: #ffae00; color: #0a0a0a; } .button-group.warning .button:hover, .button-group.warning .button:focus { background-color: #cc8b00; color: #0a0a0a; } .button-group.alert .button, .button-group.alert .button.disabled, .button-group.alert .button[disabled], .button-group.alert .button.disabled:hover, .button-group.alert .button[disabled]:hover, .button-group.alert .button.disabled:focus, .button-group.alert .button[disabled]:focus { background-color: #cc4b37; color: #fefefe; } .button-group.alert .button:hover, .button-group.alert .button:focus { background-color: #a53b2a; color: #fefefe; } .button-group.hollow .button, .button-group.hollow .button:hover, .button-group.hollow .button:focus, .button-group.hollow .button.disabled, .button-group.hollow .button.disabled:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled], .button-group.hollow .button[disabled]:hover, .button-group.hollow .button[disabled]:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { border: 1px solid #307772; color: #307772; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { border-color: #183c39; color: #183c39; } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; color: #767676; } .button-group.hollow.secondary .button:hover, .button-group.hollow.secondary .button:focus, .button-group.hollow .button.secondary:hover, .button-group.hollow .button.secondary:focus { border-color: #3b3b3b; color: #3b3b3b; } .button-group.hollow.success .button, .button-group.hollow.success .button.disabled, .button-group.hollow.success .button[disabled], .button-group.hollow.success .button.disabled:hover, .button-group.hollow.success .button[disabled]:hover, .button-group.hollow.success .button.disabled:focus, .button-group.hollow.success .button[disabled]:focus, .button-group.hollow .button.success, .button-group.hollow .button.success.disabled, .button-group.hollow .button.success[disabled], .button-group.hollow .button.success.disabled:hover, .button-group.hollow .button.success[disabled]:hover, .button-group.hollow .button.success.disabled:focus, .button-group.hollow .button.success[disabled]:focus { border: 1px solid #3adb76; color: #3adb76; } .button-group.hollow.success .button:hover, .button-group.hollow.success .button:focus, .button-group.hollow .button.success:hover, .button-group.hollow .button.success:focus { border-color: #157539; color: #157539; } .button-group.hollow.warning .button, .button-group.hollow.warning .button.disabled, .button-group.hollow.warning .button[disabled], .button-group.hollow.warning .button.disabled:hover, .button-group.hollow.warning .button[disabled]:hover, .button-group.hollow.warning .button.disabled:focus, .button-group.hollow.warning .button[disabled]:focus, .button-group.hollow .button.warning, .button-group.hollow .button.warning.disabled, .button-group.hollow .button.warning[disabled], .button-group.hollow .button.warning.disabled:hover, .button-group.hollow .button.warning[disabled]:hover, .button-group.hollow .button.warning.disabled:focus, .button-group.hollow .button.warning[disabled]:focus { border: 1px solid #ffae00; color: #ffae00; } .button-group.hollow.warning .button:hover, .button-group.hollow.warning .button:focus, .button-group.hollow .button.warning:hover, .button-group.hollow .button.warning:focus { border-color: #805700; color: #805700; } .button-group.hollow.alert .button, .button-group.hollow.alert .button.disabled, .button-group.hollow.alert .button[disabled], .button-group.hollow.alert .button.disabled:hover, .button-group.hollow.alert .button[disabled]:hover, .button-group.hollow.alert .button.disabled:focus, .button-group.hollow.alert .button[disabled]:focus, .button-group.hollow .button.alert, .button-group.hollow .button.alert.disabled, .button-group.hollow .button.alert[disabled], .button-group.hollow .button.alert.disabled:hover, .button-group.hollow .button.alert[disabled]:hover, .button-group.hollow .button.alert.disabled:focus, .button-group.hollow .button.alert[disabled]:focus { border: 1px solid #cc4b37; color: #cc4b37; } .button-group.hollow.alert .button:hover, .button-group.hollow.alert .button:focus, .button-group.hollow .button.alert:hover, .button-group.hollow .button.alert:focus { border-color: #67251a; color: #67251a; } .button-group.clear .button, .button-group.clear .button:hover, .button-group.clear .button:focus, .button-group.clear .button.disabled, .button-group.clear .button.disabled:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled], .button-group.clear .button[disabled]:hover, .button-group.clear .button[disabled]:focus { border-color: transparent; background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { color: #307772; } .button-group.clear .button:hover, .button-group.clear .button:focus { color: #183c39; } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { color: #307772; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { color: #183c39; } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; } .button-group.clear.secondary .button:hover, .button-group.clear.secondary .button:focus, .button-group.clear .button.secondary:hover, .button-group.clear .button.secondary:focus { color: #3b3b3b; } .button-group.clear.success .button, .button-group.clear.success .button.disabled, .button-group.clear.success .button[disabled], .button-group.clear.success .button.disabled:hover, .button-group.clear.success .button[disabled]:hover, .button-group.clear.success .button.disabled:focus, .button-group.clear.success .button[disabled]:focus, .button-group.clear .button.success, .button-group.clear .button.success.disabled, .button-group.clear .button.success[disabled], .button-group.clear .button.success.disabled:hover, .button-group.clear .button.success[disabled]:hover, .button-group.clear .button.success.disabled:focus, .button-group.clear .button.success[disabled]:focus { color: #3adb76; } .button-group.clear.success .button:hover, .button-group.clear.success .button:focus, .button-group.clear .button.success:hover, .button-group.clear .button.success:focus { color: #157539; } .button-group.clear.warning .button, .button-group.clear.warning .button.disabled, .button-group.clear.warning .button[disabled], .button-group.clear.warning .button.disabled:hover, .button-group.clear.warning .button[disabled]:hover, .button-group.clear.warning .button.disabled:focus, .button-group.clear.warning .button[disabled]:focus, .button-group.clear .button.warning, .button-group.clear .button.warning.disabled, .button-group.clear .button.warning[disabled], .button-group.clear .button.warning.disabled:hover, .button-group.clear .button.warning[disabled]:hover, .button-group.clear .button.warning.disabled:focus, .button-group.clear .button.warning[disabled]:focus { color: #ffae00; } .button-group.clear.warning .button:hover, .button-group.clear.warning .button:focus, .button-group.clear .button.warning:hover, .button-group.clear .button.warning:focus { color: #805700; } .button-group.clear.alert .button, .button-group.clear.alert .button.disabled, .button-group.clear.alert .button[disabled], .button-group.clear.alert .button.disabled:hover, .button-group.clear.alert .button[disabled]:hover, .button-group.clear.alert .button.disabled:focus, .button-group.clear.alert .button[disabled]:focus, .button-group.clear .button.alert, .button-group.clear .button.alert.disabled, .button-group.clear .button.alert[disabled], .button-group.clear .button.alert.disabled:hover, .button-group.clear .button.alert[disabled]:hover, .button-group.clear .button.alert.disabled:focus, .button-group.clear .button.alert[disabled]:focus { color: #cc4b37; } .button-group.clear.alert .button:hover, .button-group.clear.alert .button:focus, .button-group.clear .button.alert:hover, .button-group.clear .button.alert:focus { color: #67251a; } .button-group.no-gaps .button { margin-right: -0.0625rem; } .button-group.no-gaps .button + .button { border-left-color: transparent; } .button-group.stacked, .button-group.stacked-for-small, .button-group.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { -ms-flex: 0 0 100%; flex: 0 0 100%; } .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { margin-bottom: 0; } .button-group.stacked.expanded .button, .button-group.stacked-for-small.expanded .button, .button-group.stacked-for-medium.expanded .button { -ms-flex: 1 1 0px; flex: 1 1 0px; } @media print, screen and (min-width: 40em) { .button-group.stacked-for-small .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (min-width: 64.0625em) { .button-group.stacked-for-medium .button { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .button-group.stacked-for-small.expanded { display: block; } .button-group.stacked-for-small.expanded .button { display: block; margin-right: 0; } } @media print, screen and (max-width: 48.06125em) { .button-group.stacked-for-medium.expanded { display: block; } .button-group.stacked-for-medium.expanded .button { display: block; margin-right: 0; } } .callout { position: relative; margin: 0 0 1rem 0; padding: 1rem; border: 1px solid rgba(10, 10, 10, 0.25); border-radius: 0; background-color: white; color: #0a0a0a; } .callout > :first-child { margin-top: 0; } .callout > :last-child { margin-bottom: 0; } .callout.primary { background-color: #daf0ef; color: #0a0a0a; } .callout.secondary { background-color: #eaeaea; color: #0a0a0a; } .callout.success { background-color: #e1faea; color: #0a0a0a; } .callout.warning { background-color: #fff3d9; color: #0a0a0a; } .callout.alert { background-color: #f7e4e1; color: #0a0a0a; } .callout.small { padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } .callout.large { padding-top: 3rem; padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; } .card { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 1rem; border: 1px solid #e6e6e6; border-radius: 0; background: #fefefe; box-shadow: none; overflow: hidden; color: #0a0a0a; } .card > :last-child { margin-bottom: 0; } .card-divider { display: -ms-flexbox; display: flex; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 1rem; background: #e6e6e6; } .card-divider > :last-child { margin-bottom: 0; } .card-section { -ms-flex: 1 0 auto; flex: 1 0 auto; padding: 1rem; } .card-section > :last-child { margin-bottom: 0; } .card-image { min-height: 1px; } .close-button { position: absolute; z-index: 10; color: #8a8a8a; cursor: pointer; } [data-whatinput='mouse'] .close-button { outline: 0; } .close-button:hover, .close-button:focus { color: #0a0a0a; } .close-button.small { right: 0.66rem; top: 0.33em; font-size: 1.5em; line-height: 1; } .close-button, .close-button.medium { right: 1rem; top: 0.5rem; font-size: 2em; line-height: 1; } .menu { padding: 0; margin: 0; list-style: none; position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-whatinput='mouse'] .menu li { outline: 0; } .menu a, .menu .button { line-height: 1; text-decoration: none; display: block; padding: 0.7rem 1rem; } .menu input, .menu select, .menu a, .menu button { margin-bottom: 0; } .menu input { display: inline-block; } .menu, .menu.horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.vertical.icon-top li a img, .menu.vertical.icon-top li a i, .menu.vertical.icon-top li a svg, .menu.vertical.icon-bottom li a img, .menu.vertical.icon-bottom li a i, .menu.vertical.icon-bottom li a svg { text-align: left; } .menu.expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.expanded.icon-top li a img, .menu.expanded.icon-top li a i, .menu.expanded.icon-top li a svg, .menu.expanded.icon-bottom li a img, .menu.expanded.icon-bottom li a i, .menu.expanded.icon-bottom li a svg { text-align: left; } .menu.simple { -ms-flex-align: center; align-items: center; } .menu.simple li + li { margin-left: 1rem; } .menu.simple a { padding: 0; } @media print, screen and (min-width: 40em) { .menu.medium-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.medium-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.medium-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.medium-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 48.0625em) { .menu.tablet-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.tablet-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.tablet-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.tablet-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media print, screen and (min-width: 64.0625em) { .menu.large-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.large-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.large-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.large-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 75em) { .menu.xlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } @media screen and (min-width: 101.25em) { .menu.xxlarge-horizontal { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; } .menu.xxlarge-vertical { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-direction: column; flex-direction: column; } .menu.xxlarge-expanded li { -ms-flex: 1 1 0px; flex: 1 1 0px; } .menu.xxlarge-simple li { -ms-flex: 1 1 0px; flex: 1 1 0px; } } .menu.nested { margin-right: 0; margin-left: 1rem; } .menu.icons a { display: -ms-flexbox; display: flex; } .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a { display: -ms-flexbox; display: flex; } .menu.icon-left li a, .menu.nested.icon-left li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-left li a img, .menu.icon-left li a i, .menu.icon-left li a svg, .menu.nested.icon-left li a img, .menu.nested.icon-left li a i, .menu.nested.icon-left li a svg { margin-right: 0.25rem; } .menu.icon-right li a, .menu.nested.icon-right li a { -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .menu.icon-right li a img, .menu.icon-right li a i, .menu.icon-right li a svg, .menu.nested.icon-right li a img, .menu.nested.icon-right li a i, .menu.nested.icon-right li a svg { margin-left: 0.25rem; } .menu.icon-top li a, .menu.nested.icon-top li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-top li a img, .menu.icon-top li a i, .menu.icon-top li a svg, .menu.nested.icon-top li a img, .menu.nested.icon-top li a i, .menu.nested.icon-top li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu.icon-bottom li a, .menu.nested.icon-bottom li a { -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .menu.icon-bottom li a img, .menu.icon-bottom li a i, .menu.icon-bottom li a svg, .menu.nested.icon-bottom li a img, .menu.nested.icon-bottom li a i, .menu.nested.icon-bottom li a svg { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; margin-bottom: 0.25rem; text-align: center; } .menu .is-active > a { background: #307772; color: #fefefe; } .menu .active > a { background: #307772; color: #fefefe; } .menu.align-left { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right li { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; } .menu.align-right li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu.align-right.vertical li { display: block; text-align: right; } .menu.align-right.vertical li .submenu li { text-align: right; } .menu.align-right.icon-top li a img, .menu.align-right.icon-top li a i, .menu.align-right.icon-top li a svg, .menu.align-right.icon-bottom li a img, .menu.align-right.icon-bottom li a i, .menu.align-right.icon-bottom li a svg { text-align: right; } .menu.align-right .nested { margin-right: 1rem; margin-left: 0; } .menu.align-center li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu.align-center li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .menu .menu-text { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; color: inherit; } .menu-centered > .menu { -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .menu-centered > .menu li .submenu li { -ms-flex-pack: start; justify-content: flex-start; } .no-js [data-responsive-menu] ul { display: none; } .menu-icon { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #fefefe; box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe; content: ''; } .menu-icon:hover::after { background: #cacaca; box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; } .menu-icon.dark { position: relative; display: inline-block; vertical-align: middle; width: 20px; height: 16px; cursor: pointer; } .menu-icon.dark::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 2px; background: #0a0a0a; box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; content: ''; } .menu-icon.dark:hover::after { background: #8a8a8a; box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; } .is-drilldown { position: relative; overflow: hidden; } .is-drilldown li { display: block; } .is-drilldown.animate-height { transition: height 0.5s; } .drilldown a { padding: 0.7rem 1rem; background: #fefefe; } .drilldown .is-drilldown-submenu { position: absolute; top: 0; left: 100%; z-index: -1; width: 100%; background: #fefefe; transition: transform 0.15s linear; } .drilldown .is-drilldown-submenu.is-active { z-index: 1; display: block; -ms-transform: translateX(-100%); transform: translateX(-100%); } .drilldown .is-drilldown-submenu.is-closing { -ms-transform: translateX(100%); transform: translateX(100%); } .drilldown .is-drilldown-submenu a { padding: 0.7rem 1rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; margin-left: 0; } .drilldown .drilldown-submenu-cover-previous { min-height: 100%; } .drilldown .is-drilldown-submenu-parent > a { position: relative; } .drilldown .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; position: absolute; top: 50%; margin-top: -6px; right: 1rem; } .drilldown.align-left .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; right: 1rem; left: auto; } .drilldown.align-right .is-drilldown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 1rem; } .drilldown .js-drilldown-back > a::before { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; } .dropdown-pane { position: absolute; z-index: 10; display: none; width: 300px; padding: 1rem; visibility: hidden; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; font-size: 1rem; } .dropdown-pane.is-opening { display: block; } .dropdown-pane.is-open { display: block; visibility: visible; } .dropdown-pane.tiny { width: 100px; } .dropdown-pane.small { width: 200px; } .dropdown-pane.large { width: 400px; } .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } [data-whatinput='mouse'] .dropdown.menu a { outline: 0; } .dropdown.menu > li > a { background: #fefefe; padding: 0.7rem 1rem; } .dropdown.menu > li.is-active > a { background: transparent; color: #307772; } .no-js .dropdown.menu ul { display: none; } .dropdown.menu .nested.is-dropdown-submenu { margin-right: 0; margin-left: 0; } .dropdown.menu.vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.vertical > li > a::after { right: 14px; } .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.medium-vertical > li > a::after { right: 14px; } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 48.0625em) { .dropdown.menu.tablet-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.tablet-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.tablet-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.tablet-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.tablet-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.tablet-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.tablet-vertical > li > a::after { right: 14px; } .dropdown.menu.tablet-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.tablet-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media print, screen and (min-width: 64.0625em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.large-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.large-vertical > li > a::after { right: 14px; } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 75em) { .dropdown.menu.xlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } @media screen and (min-width: 101.25em) { .dropdown.menu.xxlarge-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; left: auto; } .dropdown.menu.xxlarge-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; left: 0; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a { position: relative; padding-right: 1.5rem; } .dropdown.menu.xxlarge-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-bottom-width: 0; border-color: #307772 transparent transparent; right: 5px; left: auto; margin-top: -3px; } .dropdown.menu.xxlarge-vertical > li .is-dropdown-submenu { top: 0; } .dropdown.menu.xxlarge-vertical > li.opens-left > .is-dropdown-submenu { top: 0; right: 100%; left: auto; } .dropdown.menu.xxlarge-vertical > li.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .dropdown.menu.xxlarge-vertical > li > a::after { right: 14px; } .dropdown.menu.xxlarge-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .dropdown.menu.xxlarge-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; left: auto; } .is-dropdown-menu.vertical { width: 100px; } .is-dropdown-menu.vertical.align-right { float: right; } .is-dropdown-submenu-parent { position: relative; } .is-dropdown-submenu-parent a::after { position: absolute; top: 50%; right: 5px; left: auto; margin-top: -6px; } .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { top: 100%; left: auto; } .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { right: 100%; left: auto; } .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { right: auto; left: 100%; } .is-dropdown-submenu { position: absolute; top: 0; left: 100%; z-index: 1; display: none; min-width: 200px; border: 1px solid #cacaca; background: #fefefe; } .dropdown .is-dropdown-submenu a { padding: 0.7rem 1rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-left-width: 0; border-color: transparent #307772 transparent transparent; right: auto; left: 5px; } .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { display: block; width: 0; height: 0; border-style: solid; border-width: 6px; content: ''; border-right-width: 0; border-color: transparent transparent transparent #307772; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; } .is-dropdown-submenu > li { width: 100%; } .is-dropdown-submenu.js-dropdown-active { display: block; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; overflow: hidden; } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; } .label { display: inline-block; padding: 0.33333rem 0.5rem; border-radius: 0; font-size: 0.8rem; line-height: 1; white-space: nowrap; cursor: default; background: #307772; color: #fefefe; } .label.primary { background: #307772; color: #fefefe; } .label.secondary { background: #767676; color: #fefefe; } .label.success { background: #3adb76; color: #0a0a0a; } .label.warning { background: #ffae00; color: #0a0a0a; } .label.alert { background: #cc4b37; color: #fefefe; } .media-object { display: -ms-flexbox; display: flex; margin-bottom: 1rem; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .media-object img { max-width: none; } @media print, screen and (max-width: 39.99875em) { .media-object.stack-for-small { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .media-object-section { -ms-flex: 0 1 auto; flex: 0 1 auto; } .media-object-section:first-child { padding-right: 1rem; } .media-object-section:last-child:not(:nth-child(2)) { padding-left: 1rem; } .media-object-section > :last-child { margin-bottom: 0; } @media print, screen and (max-width: 39.99875em) { .stack-for-small .media-object-section { padding: 0; padding-bottom: 1rem; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .stack-for-small .media-object-section img { width: 100%; } } .media-object-section.main-section { -ms-flex: 1 1 0px; flex: 1 1 0px; } .is-off-canvas-open { overflow: hidden; } .js-off-canvas-overlay { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; transition: opacity 0.5s ease, visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; overflow: hidden; } .js-off-canvas-overlay.is-visible { opacity: 1; visibility: visible; } .js-off-canvas-overlay.is-closable { cursor: pointer; } .js-off-canvas-overlay.is-overlay-absolute { position: absolute; } .js-off-canvas-overlay.is-overlay-fixed { position: fixed; } .off-canvas-wrapper { position: relative; overflow: hidden; } .off-canvas { position: fixed; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas { outline: 0; } .off-canvas.is-transition-push { z-index: 12; } .off-canvas.is-closed { visibility: hidden; } .off-canvas.is-transition-overlap { z-index: 13; } .off-canvas.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-absolute { position: absolute; z-index: 12; transition: transform 0.5s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #e6e6e6; } [data-whatinput='mouse'] .off-canvas-absolute { outline: 0; } .off-canvas-absolute.is-transition-push { z-index: 12; } .off-canvas-absolute.is-closed { visibility: hidden; } .off-canvas-absolute.is-transition-overlap { z-index: 13; } .off-canvas-absolute.is-transition-overlap.is-open { box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } .off-canvas-absolute.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left { -ms-transform: translateX(-250px); transform: translateX(-250px); } .off-canvas-content .off-canvas.position-left.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-left.has-transition-push { -ms-transform: translateX(250px); transform: translateX(250px); } .position-left.is-transition-push { box-shadow: inset -13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-right { top: 0; right: 0; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; width: 250px; -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right { -ms-transform: translateX(250px); transform: translateX(250px); } .off-canvas-content .off-canvas.position-right.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-right.has-transition-push { -ms-transform: translateX(-250px); transform: translateX(-250px); } .position-right.is-transition-push { box-shadow: inset 13px 0 20px -13px rgba(10, 10, 10, 0.25); } .position-top { top: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top { -ms-transform: translateY(-250px); transform: translateY(-250px); } .off-canvas-content .off-canvas.position-top.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-top.has-transition-push { -ms-transform: translateY(250px); transform: translateY(250px); } .position-top.is-transition-push { box-shadow: inset 0 -13px 20px -13px rgba(10, 10, 10, 0.25); } .position-bottom { bottom: 0; left: 0; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; height: 250px; -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom { -ms-transform: translateY(250px); transform: translateY(250px); } .off-canvas-content .off-canvas.position-bottom.is-transition-overlap.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content.is-open-bottom.has-transition-push { -ms-transform: translateY(-250px); transform: translateY(-250px); } .position-bottom.is-transition-push { box-shadow: inset 0 13px 20px -13px rgba(10, 10, 10, 0.25); } .off-canvas-content { -ms-transform: none; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .off-canvas-content.has-transition-overlap, .off-canvas-content.has-transition-push { transition: transform 0.5s ease; } .off-canvas-content.has-transition-push { -ms-transform: translate(0, 0); transform: translate(0, 0); } .off-canvas-content .off-canvas.is-open { -ms-transform: translate(0, 0); transform: translate(0, 0); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-left.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-medium ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-right.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-medium ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-top.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-medium ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-medium .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-medium { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-medium ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 48.0625em) { .position-left.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-left.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-tablet ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-right.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-tablet ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-top.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-tablet ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-tablet .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-tablet { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-tablet ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 64.0625em) { .position-left.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-large .close-button { display: none; } .off-canvas-content .position-left.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-large ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-large .close-button { display: none; } .off-canvas-content .position-right.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-large ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-large .close-button { display: none; } .off-canvas-content .position-top.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-large ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-large { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-large .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-large { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-large ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 75em) { .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media screen and (min-width: 101.25em) { .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-left.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-left.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-left { margin-left: 250px; } .position-left.reveal-for-xxlarge ~ .off-canvas-content { margin-left: 250px; } .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-right.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-right.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-right { margin-right: 250px; } .position-right.reveal-for-xxlarge ~ .off-canvas-content { margin-right: 250px; } .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-top.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-top.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-top { margin-top: 250px; } .position-top.reveal-for-xxlarge ~ .off-canvas-content { margin-top: 250px; } .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; z-index: 12; transition: none; visibility: visible; } .position-bottom.reveal-for-xxlarge .close-button { display: none; } .off-canvas-content .position-bottom.reveal-for-xxlarge { -ms-transform: none; transform: none; } .off-canvas-content.has-reveal-bottom { margin-bottom: 250px; } .position-bottom.reveal-for-xxlarge ~ .off-canvas-content { margin-bottom: 250px; } } @media print, screen and (min-width: 40em) { .off-canvas.in-canvas-for-medium { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-medium.position-left, .off-canvas.in-canvas-for-medium.position-right, .off-canvas.in-canvas-for-medium.position-top, .off-canvas.in-canvas-for-medium.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-medium .close-button { display: none; } } @media print, screen and (min-width: 48.0625em) { .off-canvas.in-canvas-for-tablet { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-tablet.position-left, .off-canvas.in-canvas-for-tablet.position-right, .off-canvas.in-canvas-for-tablet.position-top, .off-canvas.in-canvas-for-tablet.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-tablet .close-button { display: none; } } @media print, screen and (min-width: 64.0625em) { .off-canvas.in-canvas-for-large { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-large.position-left, .off-canvas.in-canvas-for-large.position-right, .off-canvas.in-canvas-for-large.position-top, .off-canvas.in-canvas-for-large.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-large .close-button { display: none; } } @media screen and (min-width: 75em) { .off-canvas.in-canvas-for-xlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xlarge.position-left, .off-canvas.in-canvas-for-xlarge.position-right, .off-canvas.in-canvas-for-xlarge.position-top, .off-canvas.in-canvas-for-xlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xlarge .close-button { display: none; } } @media screen and (min-width: 101.25em) { .off-canvas.in-canvas-for-xxlarge { visibility: visible; height: auto; position: static; background: none; width: auto; overflow: visible; transition: none; } .off-canvas.in-canvas-for-xxlarge.position-left, .off-canvas.in-canvas-for-xxlarge.position-right, .off-canvas.in-canvas-for-xxlarge.position-top, .off-canvas.in-canvas-for-xxlarge.position-bottom { box-shadow: none; -ms-transform: none; transform: none; } .off-canvas.in-canvas-for-xxlarge .close-button { display: none; } } .orbit { position: relative; } .orbit-container { position: relative; height: 0; margin: 0; list-style: none; overflow: hidden; } .orbit-slide { width: 100%; position: absolute; } .orbit-slide.no-motionui.is-active { top: 0; left: 0; } .orbit-figure { margin: 0; } .orbit-image { width: 100%; max-width: 100%; margin: 0; } .orbit-caption { position: absolute; bottom: 0; width: 100%; margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); color: #fefefe; } .orbit-previous, .orbit-next { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; padding: 1rem; color: #fefefe; } [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { outline: 0; } .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { background-color: rgba(10, 10, 10, 0.5); } .orbit-previous { left: 0; } .orbit-next { left: auto; right: 0; } .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; text-align: center; } [data-whatinput='mouse'] .orbit-bullets { outline: 0; } .orbit-bullets button { width: 1.2rem; height: 1.2rem; margin: 0.1rem; border-radius: 50%; background-color: #cacaca; } .orbit-bullets button:hover { background-color: #8a8a8a; } .orbit-bullets button.is-active { background-color: #8a8a8a; } .pagination { margin-left: 0; margin-bottom: 1rem; } .pagination::before, .pagination::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .pagination::after { clear: both; } .pagination li { margin-right: 0.0625rem; border-radius: 0; font-size: 0.875rem; display: none; } .pagination li:last-child, .pagination li:first-child { display: inline-block; } @media print, screen and (min-width: 40em) { .pagination li { display: inline-block; } } .pagination a, .pagination button { display: block; padding: 0.1875rem 0.625rem; border-radius: 0; color: #0a0a0a; } .pagination a:hover, .pagination button:hover { background: #e6e6e6; } .pagination .current { padding: 0.1875rem 0.625rem; background: #307772; color: #fefefe; cursor: default; } .pagination .disabled { padding: 0.1875rem 0.625rem; color: #cacaca; cursor: not-allowed; } .pagination .disabled:hover { background: transparent; } .pagination .ellipsis::after { padding: 0.1875rem 0.625rem; content: '\2026'; color: #0a0a0a; } .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; content: "«"; } .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; content: "»"; } .progress { height: 1rem; margin-bottom: 1rem; border-radius: 0; background-color: #cacaca; } .progress.primary .progress-meter { background-color: #307772; } .progress.secondary .progress-meter { background-color: #767676; } .progress.success .progress-meter { background-color: #3adb76; } .progress.warning .progress-meter { background-color: #ffae00; } .progress.alert .progress-meter { background-color: #cc4b37; } .progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: #307772; } .progress-meter-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; } .slider { position: relative; height: 0.5rem; margin-top: 1.25rem; margin-bottom: 2.25rem; background-color: #e6e6e6; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; } .slider-fill { position: absolute; top: 0; left: 0; display: inline-block; max-width: 100%; height: 0.5rem; background-color: #cacaca; transition: all 0.2s ease-in-out; } .slider-fill.is-dragging { transition: all 0s linear; } .slider-handle { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 1; cursor: grab; display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 0; background-color: #307772; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; touch-action: manipulation; } [data-whatinput='mouse'] .slider-handle { outline: 0; } .slider-handle:hover { background-color: #296561; } .slider-handle.is-dragging { transition: all 0s linear; cursor: grabbing; } .slider.disabled, .slider[disabled] { opacity: 0.25; cursor: not-allowed; } .slider.vertical { display: inline-block; width: 0.5rem; height: 12.5rem; margin: 0 1.25rem; -ms-transform: scale(1, -1); transform: scale(1, -1); } .slider.vertical .slider-fill { top: 0; width: 0.5rem; max-height: 100%; } .slider.vertical .slider-handle { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 1.4rem; -ms-transform: translateX(-50%); transform: translateX(-50%); } .sticky-container { position: relative; } .sticky { position: relative; z-index: 0; transform: translate3d(0, 0, 0); } .sticky.is-stuck { position: fixed; z-index: 5; width: 100%; } .sticky.is-stuck.is-at-top { top: 0; } .sticky.is-stuck.is-at-bottom { bottom: 0; } .sticky.is-anchored { position: relative; right: auto; left: auto; } .sticky.is-anchored.is-at-bottom { bottom: 0; } html.is-reveal-open { position: fixed; width: 100%; overflow-y: hidden; } html.is-reveal-open.zf-has-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; } html.is-reveal-open body { overflow-y: hidden; } .reveal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); overflow-y: auto; -webkit-overflow-scrolling: touch; } .reveal { z-index: 1006; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: none; padding: 1rem; border: 1px solid #cacaca; border-radius: 0; background-color: #fefefe; position: relative; top: 100px; margin-right: auto; margin-left: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } [data-whatinput='mouse'] .reveal { outline: 0; } @media print, screen and (min-width: 40em) { .reveal { min-height: 0; } } .reveal .column, .reveal .columns { min-width: 0; } .reveal > :last-child { margin-bottom: 0; } @media print, screen and (min-width: 40em) { .reveal { width: 600px; max-width: 75rem; } } .reveal.collapse { padding: 0; } @media print, screen and (min-width: 40em) { .reveal.tiny { width: 30%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.small { width: 50%; max-width: 75rem; } } @media print, screen and (min-width: 40em) { .reveal.large { width: 90%; max-width: 75rem; } } .reveal.full { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } @media print, screen and (max-width: 39.99875em) { .reveal { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; min-height: 100%; margin-left: 0; border: 0; border-radius: 0; } } .reveal.without-overlay { position: fixed; } .switch { position: relative; margin-bottom: 1rem; outline: 0; font-size: 0.875rem; font-weight: bold; color: #fefefe; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 2rem; } .switch-input { position: absolute; margin-bottom: 0; opacity: 0; } .switch-paddle { position: relative; display: block; width: 4rem; height: 2rem; border-radius: 0; background: #cacaca; transition: all 0.25s ease-out; font-weight: inherit; color: inherit; cursor: pointer; } input + .switch-paddle { margin: 0; } .switch-paddle::after { position: absolute; top: 0.25rem; left: 0.25rem; display: block; width: 1.5rem; height: 1.5rem; transform: translate3d(0, 0, 0); border-radius: 0; background: #fefefe; transition: all 0.25s ease-out; content: ''; } input:checked ~ .switch-paddle { background: #307772; } input:checked ~ .switch-paddle::after { left: 2.25rem; } input:disabled ~ .switch-paddle { cursor: not-allowed; opacity: 0.5; } [data-whatinput='mouse'] input:focus ~ .switch-paddle { outline: 0; } .switch-active, .switch-inactive { position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .switch-active { left: 8%; display: none; } input:checked + label > .switch-active { display: block; } .switch-inactive { right: 15%; } input:checked + label > .switch-inactive { display: none; } .switch.tiny { height: 1.5rem; } .switch.tiny .switch-paddle { width: 3rem; height: 1.5rem; font-size: 0.625rem; } .switch.tiny .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1rem; height: 1rem; } .switch.tiny input:checked ~ .switch-paddle::after { left: 1.75rem; } .switch.small { height: 1.75rem; } .switch.small .switch-paddle { width: 3.5rem; height: 1.75rem; font-size: 0.75rem; } .switch.small .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 1.25rem; height: 1.25rem; } .switch.small input:checked ~ .switch-paddle::after { left: 2rem; } .switch.large { height: 2.5rem; } .switch.large .switch-paddle { width: 5rem; height: 2.5rem; font-size: 1rem; } .switch.large .switch-paddle::after { top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; } .switch.large input:checked ~ .switch-paddle::after { left: 2.75rem; } table { border-collapse: collapse; width: 100%; margin-bottom: 1rem; border-radius: 0; } thead, tbody, tfoot { border: 1px solid #f1f1f1; background-color: #fefefe; } caption { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; } thead { background: #f8f8f8; color: #0a0a0a; } tfoot { background: #f1f1f1; color: #0a0a0a; } thead tr, tfoot tr { background: transparent; } thead th, thead td, tfoot th, tfoot td { padding: 0.5rem 0.625rem 0.625rem; font-weight: bold; text-align: left; } tbody th, tbody td { padding: 0.5rem 0.625rem 0.625rem; } tbody tr:nth-child(even) { border-bottom: 0; background-color: #f1f1f1; } table.unstriped tbody { background-color: #fefefe; } table.unstriped tbody tr { border-bottom: 1px solid #f1f1f1; background-color: #fefefe; } @media print, screen and (max-width: 48.06125em) { table.stack thead { display: none; } table.stack tfoot { display: none; } table.stack tr, table.stack th, table.stack td { display: block; } table.stack td { border-top: 0; } } table.scroll { display: block; width: 100%; overflow-x: auto; } table.hover thead tr:hover { background-color: #f3f3f3; } table.hover tfoot tr:hover { background-color: #ececec; } table.hover tbody tr:hover { background-color: #f9f9f9; } table.hover:not(.unstriped) tr:nth-of-type(even):hover { background-color: #ececec; } .table-scroll { overflow-x: auto; } .tabs { margin: 0; border: 1px solid #e6e6e6; background: #fefefe; list-style-type: none; } .tabs::before, .tabs::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .tabs::after { clear: both; } .tabs.vertical > li { display: block; float: none; width: auto; } .tabs.simple > li > a { padding: 0; } .tabs.simple > li > a:hover { background: transparent; } .tabs.primary { background: #307772; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { background: #35837e; } .tabs-title { float: left; } .tabs-title > a { display: block; padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; color: #307772; } [data-whatinput='mouse'] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; color: #296662; } .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { background: #e6e6e6; color: #307772; } .tabs-content { border: 1px solid #e6e6e6; border-top: 0; background: #fefefe; color: #0a0a0a; transition: all 0.5s ease; } .tabs-content.vertical { border: 1px solid #e6e6e6; border-left: 0; } .tabs-panel { display: none; padding: 1rem; } .tabs-panel.is-active { display: block; } .thumbnail { display: inline-block; max-width: 100%; margin-bottom: 1rem; border: solid 4px #fefefe; border-radius: 0; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); line-height: 0; } a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { box-shadow: 0 0 6px 1px rgba(48, 119, 114, 0.5); } a.thumbnail image { box-shadow: none; } .title-bar { padding: 0.5rem; background: #0a0a0a; color: #fefefe; display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; } .title-bar .menu-icon { margin-left: 0.25rem; margin-right: 0.25rem; } .title-bar-left, .title-bar-right { -ms-flex: 1 1 0px; flex: 1 1 0px; } .title-bar-right { text-align: right; } .title-bar-title { display: inline-block; vertical-align: middle; font-weight: bold; } .has-tip { position: relative; display: inline-block; border-bottom: dotted 1px #8a8a8a; font-weight: bold; cursor: help; } .tooltip { position: absolute; top: calc(100% + 0.6495rem); z-index: 1200; max-width: 10rem; padding: 0.75rem; border-radius: 0; background-color: #0a0a0a; font-size: 80%; color: #fefefe; } .tooltip::before { position: absolute; } .tooltip.bottom::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-top-width: 0; border-color: transparent transparent #0a0a0a; bottom: 100%; } .tooltip.bottom.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.top::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-bottom-width: 0; border-color: #0a0a0a transparent transparent; top: 100%; bottom: auto; } .tooltip.top.align-center::before { left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); } .tooltip.left::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-right-width: 0; border-color: transparent transparent transparent #0a0a0a; left: 100%; } .tooltip.left.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.right::before { display: block; width: 0; height: 0; border-style: solid; border-width: 0.75rem; content: ''; border-left-width: 0; border-color: transparent #0a0a0a transparent transparent; right: 100%; left: auto; } .tooltip.right.align-center::before { bottom: auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .tooltip.align-top::before { bottom: auto; top: 10%; } .tooltip.align-bottom::before { bottom: 10%; top: auto; } .tooltip.align-left::before { left: 10%; right: auto; } .tooltip.align-right::before { left: auto; right: 10%; } .top-bar { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; padding: 0.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar, .top-bar ul { background-color: #e6e6e6; } .top-bar input { max-width: 200px; margin-right: 1rem; } .top-bar .input-group-field { width: 100%; margin-right: 0; } .top-bar input.button { width: auto; } .top-bar .top-bar-left, .top-bar .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media print, screen and (min-width: 40em) { .top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .top-bar .top-bar-left { -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: auto; } .top-bar .top-bar-right { -ms-flex: 0 1 auto; flex: 0 1 auto; margin-left: auto; } } @media print, screen and (max-width: 48.06125em) { .top-bar.stacked-for-medium { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-medium .top-bar-left, .top-bar.stacked-for-medium .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 64.06125em) { .top-bar.stacked-for-tablet { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-tablet .top-bar-left, .top-bar.stacked-for-tablet .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 74.99875em) { .top-bar.stacked-for-large { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-large .top-bar-left, .top-bar.stacked-for-large .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media print, screen and (max-width: 101.24875em) { .top-bar.stacked-for-xlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xlarge .top-bar-left, .top-bar.stacked-for-xlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } .top-bar.stacked-for-xxlarge { -ms-flex-wrap: wrap; flex-wrap: wrap; } .top-bar.stacked-for-xxlarge .top-bar-left, .top-bar.stacked-for-xxlarge .top-bar-right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .top-bar-title { -ms-flex: 0 0 auto; flex: 0 0 auto; margin: 0.5rem 1rem 0.5rem 0; } .top-bar-left, .top-bar-right { -ms-flex: 0 0 auto; flex: 0 0 auto; } .hide { display: none !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } @media print, screen and (max-width: 39.99875em) { .hide-for-small-only { display: none !important; } } @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { display: none !important; } } @media print, screen and (min-width: 40em) { .hide-for-medium { display: none !important; } } @media screen and (max-width: 39.99875em) { .show-for-medium { display: none !important; } } @media print, screen and (min-width: 40em) and (max-width: 48.06125em) { .hide-for-medium-only { display: none !important; } } @media screen and (max-width: 39.99875em), screen and (min-width: 48.0625em) { .show-for-medium-only { display: none !important; } } @media print, screen and (min-width: 48.0625em) { .hide-for-tablet { display: none !important; } } @media screen and (max-width: 48.06125em) { .show-for-tablet { display: none !important; } } @media print, screen and (min-width: 48.0625em) and (max-width: 64.06125em) { .hide-for-tablet-only { display: none !important; } } @media screen and (max-width: 48.06125em), screen and (min-width: 64.0625em) { .show-for-tablet-only { display: none !important; } } @media print, screen and (min-width: 64.0625em) { .hide-for-large { display: none !important; } } @media screen and (max-width: 64.06125em) { .show-for-large { display: none !important; } } @media print, screen and (min-width: 64.0625em) and (max-width: 74.99875em) { .hide-for-large-only { display: none !important; } } @media screen and (max-width: 64.06125em), screen and (min-width: 75em) { .show-for-large-only { display: none !important; } } @media screen and (min-width: 75em) { .hide-for-xlarge { display: none !important; } } @media screen and (max-width: 74.99875em) { .show-for-xlarge { display: none !important; } } @media screen and (min-width: 75em) and (max-width: 101.24875em) { .hide-for-xlarge-only { display: none !important; } } @media screen and (max-width: 74.99875em), screen and (min-width: 101.25em) { .show-for-xlarge-only { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge { display: none !important; } } @media screen and (min-width: 101.25em) { .hide-for-xxlarge-only { display: none !important; } } @media screen and (max-width: 101.24875em) { .show-for-xxlarge-only { display: none !important; } } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .show-on-focus:active, .show-on-focus:focus { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } .show-for-landscape, .hide-for-portrait { display: block !important; } @media screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: block !important; } } @media screen and (orientation: portrait) { .show-for-landscape, .hide-for-portrait { display: none !important; } } .hide-for-landscape, .show-for-portrait { display: none !important; } @media screen and (orientation: landscape) { .hide-for-landscape, .show-for-portrait { display: none !important; } } @media screen and (orientation: portrait) { .hide-for-landscape, .show-for-portrait { display: block !important; } } .show-for-dark-mode { display: none; } .hide-for-dark-mode { display: block; } @media screen and (prefers-color-scheme: dark) { .show-for-dark-mode { display: block !important; } .hide-for-dark-mode { display: none !important; } } .show-for-ie { display: none; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .show-for-ie { display: block !important; } .hide-for-ie { display: none !important; } } .show-for-sticky { display: none; } .is-stuck .show-for-sticky { display: block; } .is-stuck .hide-for-sticky { display: none; } .float-left { float: left !important; } .float-right { float: right !important; } .float-center { display: block; margin-right: auto; margin-left: auto; } .clearfix::before, .clearfix::after { display: table; content: ' '; -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-order: 1; order: 1; } .clearfix::after { clear: both; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties ------------------------------------------------------------- */ html.lb-disable-scrolling { overflow: hidden; /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */ position: fixed; height: 100vh; width: 100vw; } .lightboxOverlay { position: absolute; top: 0; left: 0; z-index: 9999; background-color: black; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: none; } .lightbox { position: fixed; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; font-weight: normal; top: 50% !important; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .lightbox .lb-image { display: block; height: auto; max-width: inherit; max-height: none; border-radius: 3px; /* Image border */ border: 4px solid white; } .lightbox a img { border: none; } .lb-outerContainer { position: relative; *zoom: 1; width: 250px; height: 250px; margin: 0 auto; border-radius: 4px; /* Background color behind image. This is visible during transitions. */ background-color: white; } .lb-outerContainer:after { content: ""; display: table; clear: both; } .lb-loader { position: absolute; top: 43%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0; } .lb-cancel { display: block; width: 32px; height: 32px; margin: 0 auto; } .lb-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } .lb-container > .nav { left: 0; } .lb-nav a { outline: none; background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); } .lb-prev, .lb-next { height: 100%; cursor: pointer; display: block; } .lb-nav a.lb-prev { width: 34%; left: 0; float: left; background: url(../img/slider/prev.png) left 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-prev:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-nav a.lb-next { width: 64%; right: 0; float: right; background: url(../img/slider/next.png) right 48% no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; transition: opacity 0.6s; } .lb-nav a.lb-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .lb-dataContainer { margin: 0 auto; padding-top: 5px; *zoom: 1; width: 100%; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; display: none !important; } .lb-dataContainer:after { content: ""; display: table; clear: both; } .lb-data { padding: 0 4px; color: #ccc; } .lb-data .lb-details { width: 85%; float: left; text-align: left; line-height: 1.1em; } .lb-data .lb-caption { font-size: 13px; font-weight: bold; line-height: 1em; } .lb-data .lb-caption a { color: #4ae; } .lb-data .lb-number { display: block; clear: left; padding-bottom: 1em; font-size: 12px; color: #999999; } .lb-data .lb-close { display: block; float: right; width: 30px; height: 30px; background: url(../img/slider/close.png) top right no-repeat; text-align: right; outline: none; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; transition: opacity 0.2s; } .lb-data .lb-close:hover { cursor: pointer; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } @font-face { font-family: "iconfont"; src: url("../iconfont/iconfont.eot"); src: url("../iconfont/iconfont.eot?#iefix") format("eot"), url("../iconfont/iconfont.woff2") format("woff2"), url("../iconfont/iconfont.woff") format("woff"), url("../iconfont/iconfont.ttf") format("truetype"), url("../iconfont/iconfont.svg#iconfont") format("svg"); } .icon-accept:before, .icon-account:before, .icon-arrow-bottom:before, .icon-arrow-left:before, .icon-arrow-right:before, .icon-arrow-top:before, .icon-doc:before, .icon-download:before, .icon-fb:before, .icon-file:before, .icon-jpg:before, .icon-pdf:before, .icon-pin:before, .icon-play-button:before, .icon-play:before, .icon-png:before, .icon-search:before, .icon-support:before, .icon-thin-down:before, .icon-thin-up:before, .icon-zip:before, .button--account:before, .button--arrow-right:after, .button--arrow-left:before, .button--download:before, .button--play-video:before, .button--search-left:before, .poster__zoom:before, .movie__zoom:before, .file__preview span:before, .blog-single__text-wysiwyg [mda-readmore]:after { font-family: "iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; text-transform: none; } .icon-accept:before { content: ""; } .icon-account:before { content: ""; } .icon-arrow-bottom:before { content: ""; } .icon-arrow-left:before { content: ""; } .icon-arrow-right:before { content: ""; } .icon-arrow-top:before { content: ""; } .icon-doc:before { content: ""; } .icon-download:before { content: ""; } .icon-fb:before { content: ""; } .icon-file:before { content: ""; } .icon-jpg:before { content: ""; } .icon-pdf:before { content: ""; } .icon-pin:before { content: ""; } .icon-play-button:before { content: ""; } .icon-play:before { content: ""; } .icon-png:before { content: ""; } .icon-search:before { content: ""; } .icon-support:before { content: ""; } .icon-thin-down:before { content: ""; } .icon-thin-up:before { content: ""; } .icon-zip:before { content: ""; } /** Colors */ /** Sizes */ /** Animations */ /** Paths */ html { font-size: 100%; scroll-behavior: smooth; } body { font-family: "aktiv-grotesk", sans-serif; font-size: 16px; font-style: normal; background: #003061; color: #FFFFFF; transition: opacity 0.15s ease-in; } body.home { background: #FFF; } strong, b { font-weight: 700; } a, p, span, div { font-weight: 400; } * { box-sizing: border-box; outline: none; } img { max-width: 100%; } .header-wrapper .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; } .page-wrapper, .header-wrapper { width: 1620px; margin: 0 auto; } @media print, screen and (max-width: 101.24875em) { .page-wrapper, .header-wrapper { width: 100%; padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .page-wrapper, .header-wrapper { padding: 0 15px; } } .row a, .column a, .columns a, .align-center a { margin: 2px 0px; } a { color: #FFFFFF; text-decoration: none; } a:hover, a:focus { color: #67AAD6; } .color-accent { color: #FFFFFF; } .color--error { color: #EF4836; } .color--success { color: #FFFFFF; } .js-loader { height: 120px; display: block; overflow: hidden; width: 100%; max-width: 100%; position: relative; } .js-loader:after, .js-loader:before { content: ''; position: absolute; width: 30px; height: 30px; top: 45px; z-index: 2; } .js-loader:after { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%); } .js-loader:before { left: 0; background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); } .js-loader div { width: 30px; height: 30px; position: absolute; top: 45px; left: -30px; z-index: 1; border-radius: 50%; } .js-loader div:nth-child(1) { background-color: #003061; animation: move 2s infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(2) { background-color: #0056ae; animation: move 2s 150ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(3) { background-color: #007cfa; animation: move 2s 300ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } .js-loader div:nth-child(4) { background-color: #48a2ff; animation: move 2s 450ms infinite cubic-bezier(0.2, 0.64, 0.81, 0.23); } @keyframes move { 0% { left: 0%; } 100% { left: 100%; } } .js-loader-container { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1061; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .button { color: #FFFFFF; text-decoration: none; font-size: 12px; font-weight: 600 !important; height: 60px; line-height: 60px; padding: 0 25px; margin: 0; white-space: nowrap; cursor: pointer; background: #0171BA; border-radius: 2px; transition: all 0.15s ease-in; } @media print, screen and (max-width: 74.99875em) { .button { height: 55px; line-height: 55px; } } @media print, screen and (max-width: 48.06125em) { .button { height: 50px; line-height: 50px; } } @media print, screen and (max-width: 39.99875em) { .button { height: 45px; line-height: 45px; } } .button:hover, .button:focus { color: #00182F; background: #CCE3F1; } .button--no-padding { padding: 0 !important; } .button--account { background: #0171BA; color: #FFF; height: auto; } .button--account:hover, .button--account:focus { background: #CCE3F1; } .button--account:before { content: ""; } .button--account:before { vertical-align: -3px; font-size: 15px; margin-right: 3px; } .button--blue { background: #CCE3F1; color: #003061; } .button--blue:hover, .button--blue:focus { color: #CCE3F1; background: #003061; } .button--virtual { margin: 0 !important; border: 1px solid transparent; } .button--virtual:hover, .button--virtual:focus { border: 1px solid #CCE3F1; } .button--green { background: #307772; color: #FFF; } .button--green:hover, .button--green:focus { color: #FFF !important; background: #21534f; } .button--arrow-right:after { content: ""; } .button--arrow-right:after { vertical-align: -2px; font-size: 14px; margin-left: 10px; } .button--border { border: 1px solid #d9d9d9; background: none; color: #FFFFFF; } .button--border:hover { color: #FFFFFF; border: 1px solid #FFFFFF; background: none; } .button--arrow-left:before { content: ""; } .button--arrow-left:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--download { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } .button--download:before { content: ""; } .button--download:before { vertical-align: -2px; font-size: 14px; margin-right: 10px; } .button--small { height: 30px; line-height: 30px; padding: 0 15px; } .button--darkblue { background: #FFFFFF; color: #FFF; } .button--darkblue:hover, .button--darkblue:focus { color: #FFF; background: #d9d9d9; } .button--white { background: #FFF; color: #003061; } .button--white:hover, .button--white:focus { color: #FFF; background: #d9d9d9; } .button--red { background: #fbd6d6 !important; color: #aa0f0f !important; } .button--red:hover, .button--red:focus { color: #aa0f0f !important; background: #f7a7a7 !important; } .button--margin-right { margin-right: 7px; } .button--play-video:before { content: ""; } .button--play-video:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .button--search-left:before { content: ""; } .button--search-left:before { vertical-align: -3px; font-size: 14px; margin-right: 10px; } .account-panel { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media print, screen and (max-width: 74.99875em) { .account-panel { position: absolute; top: 16px; right: 0; } } @media print, screen and (max-width: 64.06125em) { .account-panel { position: relative; width: 100%; top: auto; right: auto; } } .widget { margin-bottom: 30px; } .widget__content { background: #0171BA; padding: 24px; -ms-flex-pack: justify; justify-content: space-between; } .widget__content--info { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; } .widget__content::after { content: ''; display: table; clear: both; } @media print, screen and (max-width: 74.99875em) { .widget__content--with-photo { margin-top: 0; } } .widget__photo-box { width: 100%; } @media print, screen and (max-width: 74.99875em) { .widget__photo-box { margin-top: 0; } } @media print, screen and (max-width: 64.06125em) { .widget__photo-box { margin-right: 15px; margin-bottom: 0; } } @media print, screen and (max-width: 39.99875em) { .widget__photo-box { float: none; width: auto; margin-right: 0; margin-bottom: 27px; } } .widget__photo { display: block; max-width: 100%; position: relative; } .widget__text-wysiwyg h1, .widget__text-wysiwyg h2, .widget__text-wysiwyg h3, .widget__text-wysiwyg h4, .widget__text-wysiwyg h5, .widget__text-wysiwyg h6 { font-size: 24px; font-weight: 700; line-height: 1.6; color: #FFF; margin-bottom: 15px; text-transform: uppercase; } .widget__text-wysiwyg p { font-size: 14px; color: #D1D6DC; margin-bottom: 0; line-height: 19px; } .widget__text-wysiwyg p strong { font-weight: 900; } .widget__text-wysiwyg p:not(:last-child) { margin-bottom: 15px; } .widget__link { margin-top: 15px; } .widget--dark .button--blue { background-color: #003061; color: #CCE3F1; } .widget--dark .button--blue:hover { color: #003061; background-color: #CCE3F1; border: 1px solid #003061; } .widget--dark .widget__content { background: #CCE3F1; } .widget--dark .widget__text-wysiwyg h1, .widget--dark .widget__text-wysiwyg h2, .widget--dark .widget__text-wysiwyg h3, .widget--dark .widget__text-wysiwyg h4, .widget--dark .widget__text-wysiwyg h5, .widget--dark .widget__text-wysiwyg h6, .widget--dark .widget__text-wysiwyg p { color: #191919; } .form input:-ms-input-placeholder, .form textarea:-ms-input-placeholder { font-weight: 400; } .form input::placeholder, .form textarea::placeholder { font-weight: 400; } .form .form__info a, .form .block__alert a { color: #00182F; } .form .login { color: #00182F; } .form .login a { color: #00182F; font-weight: 700; } .form__info, .block__alert { font-weight: 700; font-size: 0.850em; margin-top: 8px; display: block; } .form__info--success { color: #26A65B; } .form__info--error, .block__alert { color: #EF4836; } .form__info--info { color: #F7CA18; } .form__info--grey { color: #929292; } .form__label { margin: 8px 0 !important; display: -ms-flexbox !important; display: flex !important; } .input-conditional-group { display: none; border: 1px dotted #D1D6DC; margin-top: 10px; padding: 9px 27px 15px; } .input-conditional-group.is-active { display: block; } .input-container { display: block; padding: 12px 0; color: #00182F; } .input-container__send { margin-top: 24px; } .input-container--error .input { border: 1px solid #EF4836; height: 48px; color: #878D94; } .input-container--error .input--radio + label:before, .input-container--error .input--checkbox + label:before { border: 1px solid #EF4836; } .input-container--error .select2-container--default .select2-selection--single { border: 1px solid #EF4836; } span.label-text span.required { float: left; margin-right: 5px; color: #FF0000; } .label-text { font-size: 12px; } .label-text a { color: #003061; } input, textarea { font-weight: 400; } .input { margin: 0; border: 1px solid #D1D6DC; background-color: #FFF; box-shadow: 0 0 0 #FFF; line-height: normal; font-size: 0.875em; padding: 12px 16px; } .input:focus { border: 1px solid #003061; background-color: #FFF; box-shadow: 0 0 5px #FFF; } .input__label { text-transform: uppercase; font-weight: 500 !important; font-size: 10px; color: #585F65; margin-bottom: 8px; } .input__error { font-weight: 700; font-size: 0.750em; color: #EF4836; margin-top: 8px; display: inline-block; } .input--textarea { height: 150px; } .input--file { padding: 0px; } .input--radio, .input--checkbox { position: absolute; opacity: 0; margin-left: 3px; } .input--radio + label, .input--checkbox + label { position: relative; display: block; padding-left: 28px; cursor: pointer; margin: 0; line-height: 18px; font-size: 0.75em; } .input--radio + label:before, .input--checkbox + label:before { position: absolute; top: 0; left: 0; display: inline-block; width: 18px; height: 18px; content: ''; border: 1px solid #D1D6DC; } .input--radio + label:after, .input--checkbox + label:after { position: absolute; display: none; width: 18px; height: 18px; top: 0; left: 0; color: #FFFFFF; text-align: center; line-height: 16px; font-size: 10px; border: 1px solid #0171BA; content: ''; background: #FFF; border: 5px solid #0171BA; } .input--radio + label:before { border-radius: 100%; } .input--radio + label:after { border-radius: 100%; } .input--radio:checked + label:after { display: block; } .input--file, .input-container > input { color: #878D94; font-family: 'aktiv-grotesk', sans-serif; font-weight: 400; height: 48px; line-height: 48px; padding: 0px 16px; position: relative; } .input--file::file-selector-button, .input-container > input::file-selector-button { font-family: 'aktiv-grotesk', sans-serif; position: absolute; right: 0; color: #585F65; text-decoration: none; font-size: 16px; font-weight: 400; height: 48px; line-height: 40px; padding: 0 25px; margin-right: 10px; margin: 0; white-space: nowrap; cursor: pointer; background: #ececec; border-color: transparent; transition: all 0.15s ease-in; } .input--file::file-selector-button:hover, .input-container > input::file-selector-button:hover { color: #7e7e7e; background: #dbdbdb; } .input--checkbox + label:before { border-radius: 3px; } .input--checkbox + label:after { border-radius: 3px; } .input--checkbox:checked + label:after { display: block; } .select2 { width: 100% !important; } .select2 *:focus { outline: none; } .select2-container--default .select2-selection--single { height: 39px; border: 1px solid #D1D6DC; border-radius: 0; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 39px; font-size: 0.875em; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single { border-color: #003061; } .select2-dropdown { background-color: #fff; border: 1px solid #003061; border-radius: 0; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results__option { font-size: 0.875em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #FFFFFF; } p.form-output { display: block; padding: 5px 10px; text-align: center; width: 100%; margin: 20px 0 0; font-size: 14px; font-weight: 500; border: 1px solid #ffb400; } p.form-output--errors { border: 1px solid #de1a1a; color: #de1a1a; } p.form-output--success { border: 1px solid #7fb800; color: #395200; } .input-container--error { border-color: #de1a1a; } .recaptcha-error > div { border: 1px solid #de1a1a; } p.input__error { margin-bottom: 0; } .form-loading { position: relative; pointer-events: none; } .form-loading:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: -20px; background: rgba(255, 255, 255, 0.75); } #team-input { width: 80px; text-align: center; -ms-flex: none; flex: none; } #team-input::-webkit-outer-spin-button, #team-input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } #team-input[type=number] { -moz-appearance: textfield; /* Firefox */ } .mda-search [type="submit"] { line-height: 1; font-size: 0.75em; font-weight: 700; } .mda-search .input-group-label { background: none; border: none; font-weight: 700; color: #fff; } .js-ajax-form-graphic input[type="file"] { display: none; } .project-state .input-container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; } #loginform .input--checkbox, #registerform .input--checkbox, .universal-form .input--checkbox, .block .input--checkbox { display: none; } #registerform ol, #registerform ul, #registerform li, #registerform p { color: #00182F; } .register--success { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .register .page-title { margin: 60px 0 60px 0; } .register .form__info, .register .block__alert { margin-bottom: 40px; font-size: 1em; } .display-font, .button, .form__info, .block__alert, .input__label, .input__error, .header-menu__item, .account-nav__logout, .section__title, .section__subtitle, .page-title, .page-subtitle, .block__title, .poster__zoom, .movie__zoom, .claim__text--number, .claim__text--header, .tabs__link, .tabs-content__text--number, .tabs-content__text--title, .tabs-content__label strong, .tl-point__date, .archive__label strong, .jury__title, .juror__title, .project__title, .history__title, .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6, .single-contest__title, .single-contest__back-link, .slide__label strong, .slide__title, .partners__title, .partner__label, .prize__text--amount, .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .file__title, .winners__card--content-title, .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { font-family: "aktiv-grotesk", sans-serif; font-weight: 400; } .box-shadow--big, .poster__img, .tabs-container, .map__info, .archive__image, .jury, .project, .single-contest__image > img, .history-banner__movie, .contact__form, .prizes, .universal-form, .block, .accordion, .file { box-shadow: 0px 30px 50px rgba(0, 0, 0, 0.15), 0 0 100px 0 rgba(25, 25, 25, 0.1); } .box-shadow--glow, .tl-point--current .tl-point__dot, .listing-topbar ul, .projects-container #paginator-fixed.is-fixed { box-shadow: 0px 0px 75px rgba(0, 0, 0, 0.15), 0 0 35px 0 rgba(25, 25, 25, 0.1); } #ajax-progress { text-align: center; color: #FFFFFF; font-weight: 700; font-size: 24px; pointer-events: none; line-height: 1.15; } .site-header { padding: 22px 0; background: #00182F; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 100; } .site-header a { margin: 0; } .site-header__logo { margin-top: 9px; vertical-align: middle; max-width: 156px; } .site-header__logo--nom { margin-bottom: 7px; } @media print, screen and (max-width: 64.06125em) { .site-header__logo--nom { display: none; } } @media print, screen and (max-width: 64.06125em) { .site-header__logo { -o-object-fit: contain; object-fit: contain; max-width: 156px; } } @media print, screen and (max-width: 39.99875em) { .site-header__logo { height: 35px; max-width: 90%; margin-top: 0px; } } .site-header__logo-divider { display: inline-block; width: 1px; height: 65px; background: #D1D6DC; vertical-align: middle; margin: 0 25px; } @media print, screen and (max-width: 39.99875em) { .site-header__logo-divider { margin: 0 15px; height: 45px; } } @media print, screen and (max-width: 74.99875em) { .site-header { padding: 30px 0; } } @media print, screen and (max-width: 64.06125em) { .site-header { padding: 20px 0; } } .header-menu { list-style: none; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; text-align: center; margin-bottom: 0; } .header-menu ul { margin-left: 0; } @media print, screen and (max-width: 64.06125em) { .header-menu { display: block; margin: 0 0 15px 0; } } @media print, screen and (max-width: 39.99875em) { .header-menu { margin: 20px 0 15px 0; } } .header-menu__item { display: inline-block; width: auto; max-width: none; font-size: 0.875em; } .header-menu__item strong { font-weight: 400; } .header-menu__item.current_page_item .header-menu__link, .header-menu__item.current-menu-item .header-menu__link { color: #67AAD6; } @media print, screen and (max-width: 101.24875em) { .header-menu__item { font-size: 0.813em; } } @media print, screen and (max-width: 64.06125em) { .header-menu__item { width: 100%; text-align: right; } } .header-menu__item.vote-badge { position: relative; } .header-menu__item.vote-badge:after { content: "trwa głosowanie Internautów"; position: absolute; bottom: -10px; left: 50%; width: 150%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); font-size: 13px; text-transform: none; text-align: center; color: #ff0000; animation: vote 1.5s ease infinite; } @media print, screen and (max-width: 64.06125em) { .header-menu__item.vote-badge { padding-bottom: 20px; } .header-menu__item.vote-badge:after { bottom: 10px; left: auto; right: 0; width: 100%; -ms-transform: translate(0, 0); transform: translate(0, 0); text-align: right; } } .header-menu__link { color: #FFFFFF; text-decoration: none; display: inline-block; padding: 7px 0; font-size: 16px; transition: color 0.15s ease-in; } @media print, screen and (max-width: 39.99875em) { .header-menu__link { padding: 9px 0; } } .header-menu__link:hover { color: #67AAD6; } @keyframes vote { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } } .account-nav { text-align: left; display: -ms-flexbox; display: flex; -ms-flex-direction: row-reverse; flex-direction: row-reverse; gap: 20px; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 64.06125em) { .account-nav--mobile { margin-bottom: 20px; } } @media print, screen and (max-width: 39.99875em) { .account-nav .button { margin-bottom: 0; } } .account-nav__logout { display: inline-block; font-size: 0.75em; padding: 2px 0 0 7px; vertical-align: middle; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .menu a { padding: .7rem .5rem; } } .menu-voting .site-header__logo--nom { height: 20px; } .menu .button--account { font-size: 13px; text-transform: none; } .menu-icon:focus { outline: none; } .menu-icon:active { background: transparent; } .burger-icon { width: 30px; height: 22px; position: relative; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; cursor: pointer; display: inline-block; vertical-align: middle; margin-bottom: 8px; } @media print, screen and (max-width: 39.99875em) { .burger-icon { margin-bottom: 2px; } } .burger-icon__bar { display: block; position: absolute; height: 3px; width: 100%; background: #FFFFFF; opacity: 1; left: 0; -khtml-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .15s ease-in-out; } .burger-icon__bar:nth-child(1) { top: 0; } .burger-icon__bar:nth-child(2), .burger-icon__bar:nth-child(3) { top: 9px; } .burger-icon__bar:nth-child(4) { top: 18px; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(1) { top: 7px; width: 0%; left: 50%; } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(2) { -khtml-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(3) { -khtml-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .burger-icon.burger-icon--open .burger-icon__bar:nth-child(4) { top: 7px; width: 0%; left: 50%; } .header-logos { text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .popup-video { position: fixed; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; z-index: 1001; background: rgba(10, 10, 10, 0.45); transition: all .6s; opacity: 0; visibility: hidden; padding: 26px; } .popup-video video { width: 100%; } .popup-video__container { position: relative; } .popup-video__container button { position: absolute; top: 16px; right: 16px; background-color: #FFF; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; width: 36px; height: 36px; z-index: 3; cursor: pointer; border-radius: 50%; transition: background .2s; } .popup-video__container button:hover { background-color: #D1D6DC; } .popup-video__container button span { width: 60%; height: 2px; position: absolute; background-color: #0171BA; } .popup-video__container button span:first-child { -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: -1px; } .popup-video__container button span:last-child { -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-video.-show { opacity: 1; visibility: visible; } .section { padding: 30px 0; background-color: #003061; } @media print, screen and (max-width: 64.06125em) { .section { padding: 30px 20px; } } .section--no-bottom-padding { padding-bottom: 0; } .section--white { background: #FFF; } .section__contest-info { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; margin-bottom: 82px; } .section__title-box { gap: 20px; text-align: center; margin: 50px 0 81px 0; } .section__title-box--title { font-size: 50px; padding-bottom: 40px; text-transform: uppercase; border-bottom: 1px solid #FFFFFF; } .section__title-box--title p { line-height: 56px; font-weight: 300; } .section__title-box--title strong { font-weight: 800; } @media print, screen and (max-width: 64.06125em) { .section__title-box--title { font-size: 36px; padding-bottom: 10px; } .section__title-box--title p { line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .section__title-box--title { font-size: 32px; padding-bottom: 0px; } .section__title-box--title p { line-height: 32px; } } .section__title-box--left { text-align: left; } @media print, screen and (max-width: 39.99875em) { .section__title-box { margin: 30px 0; } } .section__button-end { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 40px; } .section__title { text-transform: uppercase; font-weight: 700; font-size: 2.625em; margin: 0; } @media print, screen and (max-width: 64.06125em) { .section__title { font-size: 2.2em; } } @media print, screen and (max-width: 39.99875em) { .section__title { font-size: 2em; line-height: 1.3; } } .section__text { margin: 30px 0 56px 0; } @media print, screen and (max-width: 39.99875em) { .section__text { font-size: 0.875em; margin: 20px 0 25px 0; } } .section__subtitle { color: #D1D6DC; font-size: 1.375em; position: relative; width: auto; display: inline-block; margin: 8px 0 0 0; line-height: 24px; } @media print, screen and (max-width: 64.06125em) { .section__subtitle { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .section__subtitle { font-size: 1em; } } .section__subtitle .icon { position: relative; font-size: 24px; vertical-align: middle; margin: 0 10px 0 0; } @media print, screen and (max-width: 39.99875em) { .section__subtitle .icon { font-size: 18px; margin: 0 5px 0 0; } } .page-title { text-align: center; margin: 100px 0 80px 0; font-size: 1.875em; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-title { margin: 40px 0 30px 0; font-size: 1.5em; } } .page-title--small { font-size: 1.5em; margin: 60px 0 40px 0; } .single-page-title { text-align: left; font-weight: 300; font-size: 42px; margin: 72px 0 32px 0; } @media print, screen and (max-width: 64.06125em) { .single-page-title { font-size: 28px; } } .single-content { font-size: 20px; } .single-content a { color: #67AAD6; font-weight: 700; } .single-virtual-btn a { text-wrap: auto; display: -ms-flexbox; display: flex; font-size: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; height: auto; line-height: 2; padding: 16px 32px; } @media print, screen and (max-width: 48.06125em) { .single-virtual-btn a { padding: 16px; line-height: 1.3; } } .page-subtitle, .block__title { color: #585F65; text-align: center; margin: 0 0 20px 0; font-size: 1.375em; font-weight: 800; text-transform: uppercase; } @media print, screen and (max-width: 64.06125em) { .page-subtitle, .block__title { margin: 50px 0 40px 0; font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .page-subtitle, .block__title { margin: 40px 0 30px 0; font-size: 1.5em; } } body.hidden, header.hidden { background: none; } body.hidden .site-header, header.hidden .site-header { background: none; } .banner { background-position: center; background-size: cover; background-repeat: no-repeat; margin-top: 0; margin-bottom: 0; padding: 0; height: 670px; position: relative; } @media print, screen and (max-width: 48.06125em) { .banner { height: auto; } } .banner-hidden { background-size: 100%; background-position: top; height: 670px; background-color: transparent; } .banner-hidden .hidden-page { color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 28px; line-height: 36px; } @media (max-width: 991px) { .banner-hidden .hidden-page p, .banner-hidden .hidden-page h1, .banner-hidden .hidden-page h2, .banner-hidden .hidden-page h3, .banner-hidden .hidden-page h4 { font-size: 18px; line-height: 26px; } } .banner-hidden .hidden-page b, .banner-hidden .hidden-page strong { font-size: 130%; } @media print, screen and (max-width: 48.06125em) { .banner-hidden { background-size: 135%; background-position: top right; } .banner-hidden .hidden-page { -ms-flex-align: end; align-items: flex-end; text-align: center; -ms-flex-pack: center; justify-content: center; margin-bottom: -20px; } } @media print, screen and (max-width: 39.99875em) { .banner-hidden { background-size: 150%; } .banner-hidden .hidden-page { margin-bottom: 100px; } } .banner--movie { position: relative; } @media (min-width: 1920px) { .banner--movie { height: 80vh; } } @media print, screen and (max-width: 39.99875em) { .banner--movie { padding-top: 0px !important; margin-bottom: -1px !important; } } .banner--movie video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .banner__button-block { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 96px; } @media print, screen and (max-width: 64.06125em) { .banner__button-block { margin-top: 30px; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 0px; } } .banner__button { margin: 5px 0; min-width: 250px; max-width: 100%; height: 56px; line-height: 56px; font-size: 13px; text-transform: none; } @media print, screen and (max-width: 39.99875em) { .banner__button { width: 100%; } } .banner__gradient--full { background-color: #00306158; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner__gradient--top, .banner__gradient--bottom { background: linear-gradient(0deg, #00182F -39.79%, rgba(0, 24, 47, 0.48) 51.95%, rgba(0, 24, 47, 0) 100%); z-index: 0; width: 100%; height: 50%; position: absolute; left: 0; } .banner__gradient--top { top: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); } .banner__gradient--bottom { bottom: 0; } .banner__row { height: 100%; z-index: 2; position: relative; padding: 12px 0px; } .banner__row.row { max-width: 100rem; } @media print, screen and (max-width: 48.06125em) { .banner__box { padding: 20px; } } .banner__box-content { -ms-flex-pack: justify; justify-content: space-between; -ms-flex-direction: column; flex-direction: column; gap: 56px; } .banner__box-content.-right { -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: end; align-items: flex-end; text-align: right; } @media print, screen and (max-width: 74.99875em) { .banner__box-content { min-height: 40vh; -ms-flex-pack: end; justify-content: flex-end; } } @media print, screen and (max-width: 48.06125em) { .banner__box-content { gap: 0px; } .banner__box-content .column, .banner__box-content .columns { padding-left: 0px; padding-right: 0px; } } .banner__edition { margin-bottom: 26px; display: -ms-flexbox; display: flex; } .banner__title, .banner__text, .banner__edition { text-transform: uppercase; } .banner__title { font-size: 50px; font-weight: 300; line-height: 1.12; color: #FFFFFF; margin: 0; } @media print, screen and (max-width: 74.99875em) { .banner__title { font-size: 32px; } } .banner__text { font-size: 50px; font-weight: 800; margin: 0; line-height: 1.12; } @media print, screen and (max-width: 74.99875em) { .banner__text { font-size: 32px; } } @media print, screen and (max-width: 48.06125em) { .banner__title, .banner__text { font-size: 36px; line-height: 42px; } } .banner__terms { font-size: 18px; margin: 0; } .banner__photo-desc { height: 75px; font-size: 10px; color: #FFF; -ms-flex-align: center; align-items: center; display: -ms-flexbox; display: flex; } @media print, screen and (max-width: 48.06125em) { .banner__photo-desc { height: 30px; } } @media print, screen and (max-width: 39.99875em) { .banner { padding-top: 10px; margin-bottom: 0; } } .banner__term-info { position: absolute; bottom: -45px; } @media print, screen and (max-width: 64.06125em) { .banner__term-info { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .banner__term-info { margin-left: 20px; } } @media print, screen and (max-width: 39.99875em) { .banner__term-info { margin-left: 0; position: relative; bottom: auto; } } .banner__term-info strong { font-weight: 800; } .reveal { width: calc(100% - 40px); left: 20px; right: 20px; top: 40px; height: auto; min-height: auto; } .reveal h3 { font-size: 26px !important; } .reveal li a { color: #00182F; } @media print, screen and (min-width: 40em) { .reveal { right: auto; left: auto; } } .reveal { overflow: hidden; } .reveal .button { max-width: 200px; width: 100%; } .reveal__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .43; z-index: -1; } .reveal-dark { border: none; background-color: #003061; } .reveal-dark .text, .reveal-dark .close-button { color: #FFF; } .reveal div { color: #585F65; } .reveal-no-bg { padding: 0; border: 0; background-color: transparent; outline: none; } @media print, screen and (max-width: 39.99875em) { .reveal-no-bg { width: 90%; margin: 0 5%; top: 20px; height: auto; min-height: 1px; } } .poster { margin-top: -50px; margin-bottom: -100px; text-align: right; } @media print, screen and (max-width: 48.06125em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 90%; margin-left: 10%; } } @media print, screen and (max-width: 64.06125em) { .poster { margin-top: -30px; } } @media print, screen and (max-width: 39.99875em) { .poster { margin-top: 20px; margin-bottom: 20px; width: 100%; margin-left: 0; } } .poster__img:hover { cursor: pointer; } .poster__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .poster__zoom:before { content: ""; } .poster__zoom:focus, .poster__zoom:active { outline: none; } .poster__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; } .movie { width: 800px; border: 5px solid #FFF; } .movie .video-wrapper { padding-bottom: 52.55%; } @media print, screen and (max-width: 48.06125em) { .movie { width: 96%; margin: 0 2%; } } .movie iframe { width: 100%; height: 120%; } .movie__zoom { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-top: 15px; display: inline-block; text-decoration: none; cursor: pointer; } .movie__zoom:before { content: ""; } .movie__zoom:focus, .movie__zoom:active { outline: none; } .movie__zoom:before { vertical-align: -2px; font-size: 14px; margin-right: 8px; margin-left: 20px; } .claim { font-size: 24px; } @media print, screen and (max-width: 64.06125em) { .claim { font-size: 19px; } } @media print, screen and (max-width: 39.99875em) { .claim { font-size: 16px; } } .claim__text { display: block; line-height: 1.6; width: 80%; } @media print, screen and (max-width: 64.06125em) { .claim__text { margin-left: 40px; } } @media print, screen and (max-width: 48.06125em) { .claim__text { margin-left: 20px; width: 100%; } } @media print, screen and (max-width: 39.99875em) { .claim__text { margin-left: 0; } } .claim__text--number { font-size: 5em; line-height: 1; font-weight: 800; width: 100%; } .claim__text--header { font-size: 1.458em; line-height: 1.25; text-transform: uppercase; margin-bottom: 40px; width: 100%; } .claim__text--header strong { display: block; font-weight: 800; font-size: 1.1em; } @media print, screen and (max-width: 39.99875em) { .claim__text--header { margin-bottom: 20px; } } .claim__text--award { font-size: 0.833em; margin-top: 40px; margin-bottom: 20px; } @media print, screen and (max-width: 39.99875em) { .claim__text--award { font-size: 1em; margin-top: 20px; } } .claim__text--award strong { color: #FFFFFF; font-weight: 900; } .tabs-container { font-size: 1em; border-radius: 5px; } .tabs-container a { margin: 0; height: 100%; } @media print, screen and (max-width: 64.06125em) { .tabs-container a { margin-top: 0; } } .tabs { padding: 0; margin: 0; border: 0; } @media print, screen and (max-width: 48.06125em) { .tabs { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } } @media print, screen and (max-width: 39.99875em) { .tabs-container .tabs-content .button { width: 100%; } } .tabs.row { margin-left: 0; margin-right: 0; } .tabs__item { text-align: center; text-transform: uppercase; background: transparent; } .tabs__item:focus { outline: none; } .tabs__link { text-decoration: none; font-size: 1em !important; background: #f0f0f0; border-top: 3px solid #FFF; padding: 55px 0 !important; color: #585F65 !important; transition: all 0.15s ease-in; } @media print, screen and (max-width: 64.06125em) { .tabs__link { font-size: 0.875em !important; padding: 40px 0 !important; } } @media print, screen and (max-width: 48.06125em) { .tabs__link { border-top: 1px solid #f0f0f0; background-color: #fff; } } @media print, screen and (max-width: 39.99875em) { .tabs__link { font-size: 0px !important; color: #FFF; display: -ms-flexbox !important; display: flex !important; gap: 5px; -ms-flex-pack: center; justify-content: center; } } @media print, screen and (max-width: 64.06125em) { .tabs__link { padding: 56px 0 !important; } } .tabs__link span { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .tabs__link span { display: block; font-size: 16px; } } .tabs__link:focus { outline: none; background: #f0f0f0 !important; border-top: 2px solid #FFF; } .tabs__link[aria-selected=true] { color: #00182F !important; } .tabs__link[aria-selected=true] span { font-weight: 700; color: #00182F; } .tabs__link[aria-selected=true] .tabs__link--number { font-weight: 700; color: #0171BA; } .tabs__link[aria-selected=true], .tabs__link:hover { outline: none; background: #FFF !important; border-top: 3px solid #0171BA; box-shadow: 0px 4px 42px rgba(0, 0, 0, 0.08); } .tabs-content { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; font-size: 18px; position: relative; z-index: 99; } @media print, screen and (max-width: 48.06125em) { .tabs-content--desktop { display: none; } } @media print, screen and (min-width: 48.0625em) { .tabs-content ul .tabs-panel { display: none; } } .tabs-content__panel { height: 500px; background-repeat: no-repeat; background-size: cover; background-position: right center; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; padding: 25px 50px; position: relative; } @media print, screen and (max-width: 64.06125em) { .tabs-content__panel { padding: 25px 50px; height: 600px; border-radius: 0px; } } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel { background-size: none; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__panel { padding: 30px; background-position: bottom right 15%; height: 550px; } .tabs-content__panel .align-self-middle { -ms-flex-item-align: normal; -ms-grid-row-align: normal; align-self: normal; } } .tabs-content__panel-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-image: linear-gradient(90deg, #FFFFFF 45%, rgba(255, 255, 255, 0) 75%); } @media print, screen and (max-width: 48.06125em) { .tabs-content__panel-background { background: linear-gradient(90deg, #FFFFFF 0.51%, rgba(255, 255, 255, 0.87) 63.73%, rgba(255, 255, 255, 0.52) 100%); } } .tabs-content__row { height: 100%; position: relative; z-index: 2; } .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { display: block; line-height: 24px; padding: 0 6px; margin-bottom: 40px; color: #585F65; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text, .tabs-content__text--number, .tabs-content__text--title { margin-bottom: 20px; font-size: 0.875em; } } .tabs-content__text--number { font-size: 8.333em; color: #00182F; line-height: 1; padding-left: 0; margin-bottom: 5px; font-weight: 250; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--number { font-size: 7em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--number { font-size: 4.500em; } } .tabs-content__text--title { line-height: 1; font-weight: 800; text-transform: uppercase; color: #00182F; display: inline-block; font-size: 42px; margin-bottom: 28px; } @media print, screen and (max-width: 64.06125em) { .tabs-content__text--title { font-size: 1.25em; } } @media print, screen and (max-width: 39.99875em) { .tabs-content__text--title { font-size: 1.25em; } } .tabs-content__label { color: #FFF; position: absolute; bottom: 0; right: 0; padding: 15px 30px; font-size: 0.722em; text-align: right; line-height: 1.6; background: #FFFFFF; background: rgba(255, 255, 255, 0.75); -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 0; } @media print, screen and (max-width: 39.99875em) { .tabs-content__label { font-size: 0.625em; padding: 10px 20px; } } .tabs-content__label strong { text-transform: uppercase; display: block; font-size: 1.231em; } .map { min-height: 631px; background: #f0f0f0; position: relative; margin-bottom: 200px; } @media print, screen and (max-width: 74.99875em) { .map { margin-bottom: 40px; } } @media print, screen and (max-width: 39.99875em) { .map { background: #FFF; min-height: 400px; } .map.map__container { height: auto; } } .map__button { position: absolute; z-index: 9; top: 40px; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 39.99875em) { .map__button { position: relative; } } .map__container { position: relative; } .map__container__extra { margin-top: 20rem; } .map__container__extra iframe { height: auto; aspect-ratio: 6/3; } @media print, screen and (max-width: 74.99875em) { .map__container__extra { margin-top: 10rem; padding: 1.5rem; } } @media print, screen and (max-width: 48.06125em) { .map__container__extra { margin-top: 3rem; padding: unset; } } .map__info { position: absolute; bottom: -40px; left: 50%; background: #FFF; padding: 15px 0; width: 996px; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 5px; } @media print, screen and (max-width: 64.06125em) { .map__info { width: 100%; margin-right: 0 !important; margin-left: 0 !important; top: 20px; border-radius: 0px; position: relative; bottom: auto; left: auto; -khtml-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } } @media print, screen and (max-width: 39.99875em) { .map__info { width: 100%; } } .map__info-box { display: block; float: left; padding: 15px 30px !important; font-size: 0.813em; line-height: 1.7; border-left: 1px solid #D1D6DC; } .map__info-box .row { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } .map__info-box .row .shrink { margin-bottom: 20px; } .map__info-box .row .column, .map__info-box .row .columns { color: #585F65; font-size: 12px; } @media print, screen and (max-width: 64.06125em) { .map__info-box { font-size: 0.75em; border-left: 0; border-top: 1px solid #D1D6DC; } } .map__info-box:first-of-type { border-left: 0; } @media print, screen and (max-width: 39.99875em) { .map__info-box:first-of-type { border-left: 0; border-top: 0; } } .map__info-box img { margin-top: 3px; vertical-align: middle; } @media print, screen and (max-width: 39.99875em) { .map__info-box img { margin-bottom: 15px; } } .timeline .section__title-box { margin: 56px 0 81px 0; } .tl-point { text-align: center; } @media print, screen and (max-width: 39.99875em) { .tl-point { text-align: left; position: relative; padding: 10px 0 30px 0; } } .tl-point__date { font-weight: 700; font-size: 2.625em; position: relative; display: inline-block; } .tl-point__date--green { color: #FFFFFF; } @media print, screen and (max-width: 64.06125em) { .tl-point__date { font-size: 1.25em; } } @media print, screen and (max-width: 48.06125em) { .tl-point__date { font-size: 1.25em; vertical-align: bottom; height: 3em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__date { padding-left: 80px; font-size: 1.563em; height: auto; } } .tl-point__date--prefix { font-size: 0.560em; position: absolute; bottom: 4px; right: 100%; text-transform: uppercase; padding-right: 5px; font-weight: 300; } @media print, screen and (max-width: 48.06125em) { .tl-point__date--prefix { position: relative; right: auto; bottom: auto; padding-right: 0; } } .tl-point__dot { width: 44px; height: 44px; margin: 60px auto; border-radius: 100%; box-sizing: content-box; position: relative; z-index: 2; background: #67AAD6; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot { margin: 16px auto; } } .tl-point__dot--background { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 16px; height: 16px; background: #0171BA; border-radius: 100%; border: 5px solid #FFF; box-sizing: content-box; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot--background { width: 16px; height: 16px; } } .tl-point__dot--background:before { position: absolute; top: 0; left: 0; background: #67AAD6; content: ''; } .tl-point__dot-container { position: relative; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container { position: absolute; top: 0; height: 100%; } } .tl-point__dot-container:before { left: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:before { left: 29px; height: 23px; width: 0px; width: 0px !important; } } .tl-point__dot-container:after { right: 0; z-index: 1; } @media print, screen and (max-width: 39.99875em) { .tl-point__dot-container:after { top: 22px !important; left: 22px; } } .tl-point:first-of-type .tl-point__dot-container:before { display: none; } .tl-point:last-of-type .tl-point__dot-container:after { display: none; } .tl-point--current .tl-point__dot { border: 20px solid #FFF; margin: 39px auto; width: 17px; height: 17px; } @media print, screen and (max-width: 39.99875em) { .tl-point--current .tl-point__dot { margin: 0 0; } } .tl-point--current .tl-point__dot-container:before { background: #FFFFFF; } .tl-point--current .tl-point__text .button { display: inline-block; } .tl-point--past .tl-point__dot-container:before, .tl-point--past .tl-point__dot-container:after { background: #FFFFFF; } .tl-point__text { padding: 0 15px; } .tl-point__text .button { display: none; } @media print, screen and (max-width: 64.06125em) { .tl-point__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .tl-point__text { padding-left: 80px; font-size: 0.875em; } } .tl-point__text a:not(.button) { color: #FFFFFF; } .archive__photo { background-image: url(../img/home/archive-background.png); background-position: center; background-repeat: no-repeat; background-size: contain; height: 600px; position: relative; } @media print, screen and (max-width: 64.06125em) { .archive__photo { height: 400px; } } @media print, screen and (max-width: 39.99875em) { .archive__photo { display: none; } } .archive__image { position: absolute; top: 50%; left: 50%; width: 65%; border: 10px solid #FFF; -khtml-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .archive__image > img { width: 100%; height: auto; } .archive__label { position: absolute; font-size: 0.722em; line-height: 0.75; text-align: right; top: -9px; right: -9px; background: #FFF; color: #D1D6DC; padding: 20px; } .archive__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 1.231em; } @media print, screen and (max-width: 64.06125em) { .archive__label { display: none; } } .timeline h3, .realizations h3 { line-height: 48px; font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .timeline h3, .realizations h3 { line-height: 40px; } } .timeline h3 strong, .realizations h3 strong { font-weight: 700; } .juror-list { gap: 24px; overflow: hidden; } .jury { background: #FFFFFF; height: 100%; min-height: 292px; } .jury .row { height: 100%; } .jury-info { -ms-flex: 0 0 587px; flex: 0 0 587px; } @media print, screen and (max-width: 74.99875em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 64.06125em) { .jury-info { -ms-flex: 0 0 calc(50% - 24px); flex: 0 0 calc(50% - 24px); } } @media print, screen and (max-width: 39.99875em) { .jury-info { -ms-flex: 0 0 100%; flex: 0 0 100%; } } @media print, screen and (max-width: 48.06125em) { .jury { text-align: center; } } .jury__image { height: 100%; position: relative; overflow: hidden; } @media print, screen and (max-width: 48.06125em) { .jury__image { max-height: 292px; height: 100%; } } .jury__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -o-object-fit: cover; object-fit: cover; width: 100%; filter: grayscale(1); -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .jury__image > img { width: 100%; height: auto; } } @media print, screen and (max-width: 48.06125em) { .jury__image > img { position: relative; left: auto; height: 100%; -ms-transform: none; transform: none; max-width: auto; } } .jury__title { font-size: 1em; color: #00182F; margin: 40px 0 8px 0; font-weight: 700; } .jury__title small { font-size: 9px; color: #00182F; font-weight: 400; } @media print, screen and (max-width: 39.99875em) { .jury__title { margin: 30px 0 8px 0; } } .jury__text { font-size: 12px; line-height: 19px; overflow: hidden; color: #003061; } @media print, screen and (max-width: 64.06125em) { .jury__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .jury__text { height: auto; max-height: 9em; } } .jury .button { margin: 40px 0 20px 0; height: 48px; line-height: 46px; font-size: 13px; line-height: 13px; padding: 16px 24px; background-color: #CCE3F1; color: #003061; text-transform: none; } .jury .button:hover { background-color: #003061; color: #CCE3F1; } @media print, screen and (max-width: 39.99875em) { .jury .button { margin: 20px auto; } } .jury__movie { position: absolute; z-index: 3; color: #00182F; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .juror { margin-bottom: 140px; margin-top: 72px; padding: 56px 102px 56px 175px; background: #fff; -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 48.06125em) { .juror { margin-bottom: 60px; padding: 28px 45px; } } @media print, screen and (max-width: 39.99875em) { .juror { padding: 12px 28px; } } .juror__top { display: -ms-flexbox; display: flex; gap: 25px; position: relative; left: -73px; margin-bottom: 43px; } @media print, screen and (max-width: 48.06125em) { .juror__top { left: 0px; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .juror__top--title { color: #00182F; font-size: 42px; line-height: 48px; font-weight: 700; font-family: 'aktiv-grotesk', sans-serif; } @media print, screen and (max-width: 64.06125em) { .juror__top--title { font-size: 36px; line-height: 42px; } } @media print, screen and (max-width: 39.99875em) { .juror__top--title { font-size: 28px; line-height: 34px; } } .juror__top--link { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; border-radius: 50%; width: 48px; height: 48px; background-color: #CCE3F1; color: #0171BA; transition: all .5s; box-shadow: 3.2px 3.2px 4.8px rgba(0, 0, 0, 0.06); } .juror__top--link:hover { background-color: #003061; color: #CCE3F1; } .juror__image { position: relative; z-index: 1; } .juror__image > img { width: 100%; filter: grayscale(1); } .juror__description { padding: 0px 24px !important; } @media print, screen and (max-width: 48.06125em) { .juror__description { -ms-flex-order: 1; order: 1; padding: 0px 0px !important; } } .juror__text { color: #585F65; position: relative; z-index: 0; font-size: 1em; line-height: 1.5em; } .juror__text p { line-height: 1.5em; } @media print, screen and (max-width: 48.06125em) { .juror__text { padding: 18px 0px; } } @media print, screen and (max-width: 39.99875em) { .juror__text { font-size: 0.875em; } } .juror__text .video-wrapper { margin-top: 50px; } @media print, screen and (max-width: 39.99875em) { .juror__text .video-wrapper { margin-top: 30px; margin-bottom: 20px; } } .juror__title { font-size: 1.875em; color: #00182F; margin: 0 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 48.06125em) { .juror__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .juror__title { margin: 0 0 20px 0; } } .juror__back-link { font-size: 0.75em; text-transform: uppercase; font-weight: 600; } .juror__back-link .icon { color: #0171BA; padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .juror__back-link { position: relative; } } .project { background: #FFF; padding: 15px; margin-bottom: 30px; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .project { text-align: center; } } .project__image { height: 350px; background: #000; position: relative; overflow: hidden; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 5px; } .project__image > img { position: absolute; width: auto; height: 100%; max-width: none; left: 50%; -khtml-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } @media print, screen and (max-width: 48.06125em) { .project__image > img { width: 100%; height: auto; } } .project__title { font-size: 1.250em; color: #00182F; margin: 20px 0 20px 0; font-weight: 900; } @media print, screen and (max-width: 64.06125em) { .project__title { font-size: 1em; } } @media print, screen and (max-width: 39.99875em) { .project__title { margin: 30px 0 10px 0; } } .project__text { font-size: 0.938em; line-height: 1.8em; overflow: hidden; } .project__text p { color: #0171BA; margin: 0; padding: 0; } .project__text br { display: none; } @media print, screen and (max-width: 64.06125em) { .project__text { font-size: 0.875em; } } @media print, screen and (max-width: 39.99875em) { .project__text { height: auto; max-height: 9em; } } .project .button { margin: 30px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .project .button { margin: 20px auto; } } .project__movie { position: absolute; z-index: 3; color: #FFFFFF; font-size: 40px; bottom: 22px; right: 10px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); } .history { background: #FFF; margin-bottom: 30px; display: block; } .history .row { height: 100%; } @media print, screen and (max-width: 48.06125em) { .history { text-align: center; } } .history:hover .history__image { opacity: 0.75; } .history__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; transition: all 0.25s ease-in; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .history__image > img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; min-height: 100%; max-width: 100%; } .history__title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .history__title { padding: 8px 20px; } } .history .button { margin: 10px 0 20px 0; } @media print, screen and (max-width: 39.99875em) { .history .button { margin: 20px auto; } } .history__subtitle { font-size: 1em; color: #00182F; margin: 0 0 10px 0; } @media print, screen and (max-width: 48.06125em) { .history__subtitle { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .history__subtitle { margin: 0 0 20px 0; } } .single-contest { margin-bottom: 140px; } @media print, screen and (max-width: 48.06125em) { .single-contest { margin-bottom: 60px; } } .single-contest__image { position: relative; z-index: 1; } @media print, screen and (max-width: 48.06125em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -90px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image { -ms-flex-order: 2; order: 2; margin-top: -30px; } } .single-contest__image > img { border-radius: 5px; border: 10px solid #FFF; width: 100%; } @media print, screen and (max-width: 48.06125em) { .single-contest__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .single-contest__image > img { width: 90%; margin: 0 0 0 5%; } } @media print, screen and (max-width: 48.06125em) { .single-contest__description { -ms-flex-order: 1; order: 1; } } .single-contest__text { background: #0171BA; position: relative; z-index: 0; padding: 85px; font-size: 0.938em; line-height: 1.8em; } @media print, screen and (max-width: 48.06125em) { .single-contest__text { padding: 50px; } } @media print, screen and (max-width: 39.99875em) { .single-contest__text { padding: 40px 30px; font-size: 0.875em; } } .single-contest__text h1, .single-contest__text h2, .single-contest__text h3, .single-contest__text h4, .single-contest__text h5, .single-contest__text h6 { font-size: 1.25em; font-weight: 700; margin: 10px 0 25px 0; padding: 0; } .single-contest__title { font-size: 1.875em; color: #FFFFFF; margin: 0 0 40px 0; font-weight: 900; } @media print, screen and (max-width: 48.06125em) { .single-contest__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .single-contest__title { margin: 0 0 20px 0; } } .single-contest__back-link { display: block; margin: 30px 0 0 0; padding: 0; font-size: 0.750em; text-transform: uppercase; font-weight: 600; } .single-contest__back-link .icon { padding-right: 7px; } @media print, screen and (max-width: 48.06125em) { .single-contest__back-link { position: relative; } } .winner__header span { display: block; } .winner__text { padding: 0 0 15px 0; } .winner__gallery { margin: 0 0 30px 0; } .winner__gallery-item { margin-bottom: 50px; } .winner__gallery-item img { transition: all 0.25s ease-in; box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 20px 0 rgba(25, 25, 25, 0.1); } .winner__gallery-item:hover img { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25), 0 0 25px 0 rgba(25, 25, 25, 0.2); } .history-banner { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media print, screen and (max-width: 64.06125em) { .history-banner__text { font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .history-banner__text { margin-left: 0; font-size: 0.875em; } } @media print, screen and (max-width: 64.06125em) { .history-banner__movie { margin-right: 0; } } @media print, screen and (max-width: 39.99875em) { .history-banner__movie { margin-left: 0; } } .history-video { margin-top: 48px; margin-bottom: -60px; padding-bottom: 60px; overflow: hidden; background-color: #00182F; } .history-video .section__title-box { margin: 48px 0 36px 0; text-align: left; } .history-video .history-card a { display: -ms-flexbox; display: flex; height: 100%; } .custom-video .video-wrapper { padding-top: 0px; overflow: hidden; } .custom-video .video-wrapper video { max-width: 100%; } .history-list { -ms-flex-pack: center; justify-content: center; row-gap: 24px; } .history-list .column, .history-list .columns { min-height: 100%; } .history-archive { height: 100%; } .history-archive .info { background-color: #fff; height: 100%; } .history-archive__image { position: relative; overflow: hidden; opacity: 1; border-radius: 0px !important; min-height: 329px; height: 100%; } .history-archive__image > img { width: 100%; } @media print, screen and (max-width: 48.06125em) { .history-archive__image > img { width: 50%; margin: 0 0 0 46%; } } @media print, screen and (max-width: 39.99875em) { .history-archive__image > img { width: 90%; margin: 0 0 0 5%; } } .history-archive__title { font-size: 1.8rem; font-weight: 500; } .history-archive__title, .history-archive__subtitle { color: #00182F; } .history-archive__data { padding: 10px 0px; } .winners-section { margin-top: 0px; background: none; } .video-wrapper { position: relative; padding-bottom: 51.75%; /* 16:9 */ padding-top: 25px; height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .realizations { padding-top: 10px; } .realizations .section__title { font-size: 42px; } .realizations .section__title-box { margin: 50px 0 32px 0; } @media print, screen and (max-width: 39.99875em) { .realizations { margin-bottom: 20px; } .realizations .page-wrapper { padding: 0; } .realizations .section__title { font-size: 32px; } .realizations .section__title-box { margin: 50px 0 24px 0; } } .slide { position: relative; padding: 10px 0 70px 0; } @media print, screen and (max-width: 39.99875em) { .slide { padding: 10px 0 30px 0; } } .slide__image { box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.15), 0 0 30px 0 rgba(25, 25, 25, 0.1); } @media print, screen and (max-width: 64.06125em) { .slide__image { border: 10px solid #FFF; } } .slide__arrow { position: absolute; top: 42%; left: 40px; font-size: 20px; line-height: 40px; color: #FFFFFF; cursor: pointer; display: block; width: 40px; height: 40px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.16); text-align: center; z-index: 2; border-radius: 100%; -khtml-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.15), 0 0 10px 0 rgba(25, 25, 25, 0.1); } .slide__arrow--next { left: auto; right: 40px; } @media print, screen and (max-width: 101.24875em) { .slide__arrow { left: 20px; line-height: 35px; width: 35px; height: 35px; font-size: 18px; } .slide__arrow--next { left: auto; right: 20px; } } @media print, screen and (max-width: 39.99875em) { .slide__arrow { top: 30%; line-height: 50px; width: 50px; font-size: 21px; height: 50px; left: 0px; } .slide__arrow--next { right: 0px; left: auto; } } .slide__label { font-size: 12px; color: #D1D6DC; margin-top: 20px; line-height: 1.4; } .slide__label .color-accent { color: #0171BA; } .slide__label strong { color: #FFFFFF; text-transform: uppercase; display: block; font-size: 24px; margin-bottom: 6px; } @media print, screen and (max-width: 39.99875em) { .slide__label { position: absolute; top: 10px; } } .slide p { font-weight: 300; } .slide__title { font-size: 32px; line-height: 36px; text-transform: uppercase; width: 80%; } .slide__title p { font-size: 32px; line-height: 36px; } @media print, screen and (max-width: 74.99875em) { .slide__title { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__title { margin-top: 20px; text-align: center; font-size: 1.15em; } } .slide__subtitle { font-size: 1.125em; width: 70%; } @media print, screen and (max-width: 74.99875em) { .slide__subtitle { width: 100%; } } @media print, screen and (max-width: 39.99875em) { .slide__subtitle { text-align: center; font-size: 0.875em; } } .slide .align-middle { background: #00182F; padding: 24px; } @media print, screen and (max-width: 39.99875em) { .slide .align-middle { padding-top: 96px; } } @media print, screen and (max-width: 39.99875em) { .slide .button { width: 100%; } } .partners { background-color: #fff; padding-top: 96px; } .partners__title { color: #00182F; text-transform: uppercase; font-size: 42px; margin: 0; font-weight: 300; } .partners__title p { font-weight: 300; } @media print, screen and (max-width: 64.06125em) { .partners__title { font-size: 1.5em; } } @media print, screen and (max-width: 39.99875em) { .partners__title { font-size: 1.25em; line-height: 1.3; } } .partners__info { color: #585F65; } .partners__divider { width: 100%; margin: 40px 0; border-bottom: 1px solid #D1D6DC; } .partner { text-align: center; padding: 0 60px; } @media print, screen and (max-width: 39.99875em) { .partner { padding: 0 40px; } } .partner img { max-width: 100%; max-height: 85px; max-width: 177px; } .partner--divider { padding: 0 60px 30px; } .partner--divider .partner__label { margin: 0; } .partner__label { display: block; font-size: 1em; color: #585F65; text-transform: uppercase; font-weight: 700; margin: 32px 0; } .patrons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } .patron { display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 11.1%; flex-basis: 11.1%; padding-right: 30px; -ms-flex-pack: center; justify-content: center; } .patron:nth-child(9n + 1) { -ms-flex-pack: start; justify-content: flex-start; } .patron:nth-child(9n) { padding-right: 0; -ms-flex-pack: end; justify-content: flex-end; } @media print, screen and (max-width: 64.06125em) { .patron { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .patron:nth-child(n) { padding: 0 15px 15px; } } @media print, screen and (max-width: 39.99875em) { .patron { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .patron:nth-child(n) { padding: 0 15px 15px; } } .contact { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-title { margin: 72px 0px 40px 0px; } .contact__form { padding: 45px; margin-bottom: 60px; background: #FFF; } @media print, screen and (max-width: 74.99875em) { .contact__form { padding: 30px; } } @media print, screen and (max-width: 48.06125em) { .contact__form { padding: 15px; } } @media print, screen and (max-width: 39.99875em) { .contact__form { padding: 10px; } } .contact__form h1, .contact__form h2, .contact__form h3, .contact__form h4, .contact__form h5, .contact__form h6 { color: #00182F; } .contact__form p, .contact__form a, .contact__form span { color: #585F65; } .contact-form { text-align: left; } .contact-form br { display: none; } @media print, screen and (max-width: 39.99875em) { .contact-form { padding: 25px 25px 35px 25px; } } @media print, screen and (max-width: 64.06125em) { .contact-form__text { margin: -20px 0 30px 0; } } @media print, screen and (max-width: 39.99875em) { .contact-form__text { margin: 0 0 20px 0; } } .location-form__title, .location-form h2, .contact__form__title, .contact__form h2 { font-size: 1.5em; line-height: 1.875em; font-weight: 700; margin-bottom: 18px; text-transform: uppercase; color: #00182F; } .contest { padding-top: 60px; margin-top: -1px; scroll-margin-top: 180px; } .contest-stages { padding-top: 120px; } .contest .section__title-box { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .contest .section__subtitle { margin: 40px 0 0 0; } .location { background-color: #00182F; margin-top: -102px; padding-top: 120px; padding-bottom: 100px; position: relative; } .location .section__title-box { margin: 56px 0 12px 0; } .location .section__title-box--virtual { margin: 56px 0 0 0; } .location .section__button--locations { margin: 35px 0; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 15px; } .location .section__button-end { margin-bottom: 75px; } .location .section__subtitle { font-size: 1em; } .location .map { max-width: 75rem; margin-right: auto; margin-left: auto; } @media print, screen and (max-width: 64.06125em) { .location .section__button-end { -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .location .map .button { width: 75%; } } @media print, screen and (max-width: 39.99875em) { .location .button { width: 100%; } .location .map .button { width: 100%; top: 0; } } .prizes { background: #FFF; max-width: 1620px; z-index: 99; position: relative; } .prizes-info { padding: 0; } @media print, screen and (max-width: 64.06125em) { .prizes-info { padding-top: 0; } } .prizes-info .section__title { font-size: 42px; } @media print, screen and (max-width: 64.06125em) { .prizes-info .section__title { font-size: 32px; } } .prizes-info .section__title-box { margin: 62px 0 32px 0; } .prize { text-align: center; padding: 75px 40px; font-size: 1.125em; border-top: 1px solid #D1D6DC; border-right: 1px solid #D1D6DC; } .prize .space-between { -ms-flex-pack: justify; justify-content: space-between; } @media print, screen and (max-width: 39.99875em) { .prize .space-between { display: inline; } } .prize.-large { padding: 64px 210px; } .prize.-large .prize__text--photo { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; } .prize.-large .prize__text--photo video { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .prize.-large .prize__text--amount { margin-bottom: 1rem; } @media print, screen and (max-width: 74.99875em) { .prize.-large { padding: 48px 120px; } } @media print, screen and (max-width: 48.06125em) { .prize.-large { padding: 24px; } } @media print, screen and (max-width: 64.06125em) { .prize { padding: 40px 30px; font-size: 0.913em; } } @media print, screen and (max-width: 39.99875em) { .prize { padding: 30px 30px; font-size: 0.875em; border-right: 0; } } .prize:first-of-type { border-top: 0; } .prize__text-photo strong { font-weight: 500; color: #585F65; } .prize__text-photo p { color: #878D94; } .prize__text { display: block; margin: 10px 0 0 0; color: #585F65; } .prize__text strong { text-transform: uppercase; } .prize__text--amount { color: #0171BA; font-weight: 700; font-size: 2.778em; position: relative; line-height: 1; display: inline-block; margin: 0; } .prize__text > span { font-size: 0.260em; position: absolute; bottom: 7px; padding-left: 7px; left: 100%; } .prize--full { font-size: 1.375em; } @media print, screen and (max-width: 64.06125em) { .prize--full { font-size: 1.13em; } } @media print, screen and (max-width: 39.99875em) { .prize--full { font-size: 1.15em; padding: 50px 30px; } } .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { content: ''; display: block; width: 50%; height: 1px; position: absolute; background: #D1D6DC; top: 50%; } @media print, screen and (max-width: 39.99875em) { .line-styles, .tl-point__dot-container:before, .tl-point__dot-container:after { top: 0; width: 1px; height: 100%; background-color: #fff; } } table tbody { color: #585F65; } table tbody a { color: #585F65; } .table-ranking table { display: block; overflow: scroll; } .table-ranking .expand { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .universal-form, .block { background: #FFF; padding: 25px; } .universal-form__row { border-top: 1px solid #003061; margin-top: 28px; padding-top: 22px; } .text { font-size: 1em; line-height: 1.5; } @media print, screen and (max-width: 64.06125em) { .text { font-size: 0.938em; } } @media print, screen and (max-width: 39.99875em) { .text { font-size: 0.875em; } } .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 { font-size: 1.25em; font-weight: 700; margin: 15px 0; } .text p, .text ul, .text ol { margin-top: 15px; margin-bottom: 15px; } .text ul li, .text ol li { margin-top: 15px; margin-bottom: 15px; } .text ul li:last-of-type, .text ol li:last-of-type { margin-bottom: 0; } .color-accent { color: #FFFFFF; } .color-grey { color: #003061; } .accordion { width: 100%; font-size: 1em; background: transparent; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; gap: 24px; } @media print, screen and (max-width: 39.99875em) { .accordion { font-size: 0.875em; } } .accordion-item { font-size: 1em; background-color: #fff; } .accordion-item.is-active .accordion-title { color: #0171BA; } .accordion-item.is-active .accordion-title:before { content: ""; } .accordion .text p { margin-top: 0; color: #003061; } .accordion-title { font-size: 1em; line-height: 1.45; font-weight: 700; color: #00182F; padding: 26px 57px 26px 47px; border: 0px; display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .accordion-title { padding: 20px 25px; font-size: 1em; } } .accordion-title:before { top: 20px; right: 42px; font-size: 24px; margin-top: 0; font-weight: 900; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-title:before { top: 19px; right: 15px; } } .accordion-title:focus, .accordion-title:hover { background-color: #fff; color: #0171BA; } .accordion-question p { font-weight: 700; margin-bottom: 0; padding: 0; color: #003061; } @media print, screen and (max-width: 39.99875em) { .accordion-question p { padding-right: 10px; } } .accordion-counter { min-width: 24px; margin-top: 2px; width: 24px; height: 24px; color: #585F65; border-radius: 50%; border: 1px solid #0171BA; text-align: center; font-size: 16px; line-height: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } .accordion-counter span { font-weight: 700; color: #00182F; } @media print, screen and (max-width: 39.99875em) { .accordion-counter { min-width: 20px; width: 20px; height: 20px; font-size: 13px; line-height: 16px; } } .accordion-content { padding: 0 47px 20px 40px; border-top: 0; margin-left: 47px; border: none; } @media print, screen and (max-width: 39.99875em) { .accordion-content { font-size: 1em; padding: 4px 26px 0px 8px; } } .files, .for-media { gap: 24px; min-height: auto; } @media print, screen and (max-width: 74.99875em) { .files, .for-media { -ms-flex-pack: center; justify-content: center; } } .files .section__title, .files .section__subtitle, .for-media .section__title, .for-media .section__subtitle { text-align: left; width: 100%; } .files .section__title, .for-media .section__title { font-weight: 300; font-size: 2em; } .files .section__subtitle, .for-media .section__subtitle { font-size: 16px; margin-top: 40px; } .files .section__title-box, .for-media .section__title-box { margin: 40px 0px 40px 0px; } .main-file .section__title { font-size: 2.625em; } .files { margin-top: 24px; } .file { background: #FFF; padding: 15px; margin: 15px 0; display: block; } .file--card { -ms-flex: 0 0 384px; flex: 0 0 384px; max-width: 23.5%; min-height: auto; padding: 0 !important; transition: all .5s; } @media print, screen and (max-width: 74.99875em) { .file--card { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } } @media print, screen and (max-width: 39.99875em) { .file--card { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } } .file--card a { margin: 0 !important; padding: 24px; } @media print, screen and (max-width: 48.06125em) { .file--card a { padding: 20px; } } .file__icon { font-size: 57px; display: block; color: #67AAD6; height: 76px; } @media print, screen and (max-width: 39.99875em) { .file__icon { font-size: 50px; margin: 2px 15px 0 10px; } } .file__title { font-size: 1.2rem; line-height: 1.4rem; color: #00182F; margin: 10px 0 40px 0; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .file__title { font-size: 1rem; line-height: 1.5rem; } } @media print, screen and (max-width: 39.99875em) { .file__title { margin: 10px 0; } } .file__preview { transform-style: preserve-3d; transition: 0.3s ease; position: relative; max-height: 419px; min-height: 419px; } .file__preview img { cursor: pointer; max-width: 100%; width: 100%; } .file__preview:hover { opacity: 0.75; } .file__preview span { position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -45px; } .file__preview span:before { content: ""; } .file__preview span:before { font-size: 60px; } .file .button--small { margin: 0 0 20px 0; color: #00182F; font-size: 13px; background-color: #CCE3F1; font-weight: 600; padding: 16px 40px 16px 24px !important; position: relative; } @media print, screen and (max-width: 39.99875em) { .file .button--small { margin: 10px auto 0 auto; } } .file .button--small .button--arrow-right { position: absolute; -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 6px; } .winners { background: none; } .winners__card { margin-bottom: 30px; display: block; } .winners__card .info { background-color: #FFF; height: 100%; } .winners__card--content-img { max-height: 356px; min-height: 356px; overflow: hidden; display: -ms-flexbox; display: flex; } .winners__card--content-img a { margin: 0; } .winners__card--content-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .winners__card--content-title { margin-bottom: 0px; height: 100%; padding: 20px 32px; font-size: 1em; line-height: 1em; color: #00182F; font-weight: 700; text-transform: uppercase; } .winners .history__image { min-height: 356px; max-height: 356px; } .block { position: relative; color: #585F65; } .block__title { margin-bottom: 0; } .block__title + .button { margin-top: 20px; } .block__alert { font-size: 0.55em; text-transform: uppercase; } .block h1, .block h2, .block h3, .block h4, .block h5, .block h6 { margin-bottom: 20px; } .block p { margin: 0; } .block .graphic { border: 1px solid #D1D6DC; } .block .graphic:hover { border: 1px solid #003061; } .block .graphic--placeholder { border: 1px solid #D1D6DC; margin: 0; } .block .graphic--placeholder:hover { border: 1px solid #003061; } .block .graphic--edit { border: 1px solid #D1D6DC; } .block .graphic--edit:hover { border: 1px solid #003061; } .project-state { padding: 40px 0; border-bottom: 1px solid #D1D6DC; } .project-state--bottom { border-bottom: 0; } .project-state--divider { padding-top: 18px; } .image-placeholder--edit .graphic--placeholder { margin: 0; } .button-user-submit { margin-top: 12px; } .annotation-text { padding: 20px 10px 0 40px; font-size: 12px; color: #00182F; } .checkbox-container a { padding: 25px 15px; } .checkbox-container__hidden .small-4 { text-align: center; } .checkbox-container__hidden .small-8 { margin-bottom: 20px; } .listing-topbar__label { color: #929292; margin-right: 8px; } .listing-topbar__filters { padding-top: 15px; padding-bottom: 15px; } @media print, screen and (max-width: 39.99875em) { .listing-topbar__filters { padding-top: 15px; padding-bottom: 0; } } .listing-topbar ul { list-style: none; margin: 0; padding: 15px 15px; background: #FFF; border-radius: 5px; } @media print, screen and (max-width: 48.06125em) { .listing-topbar ul { text-align: center; } } .listing-topbar ul:after { display: table; content: ''; clear: both; } .listing-topbar ul li { display: block; float: left; widtH: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #F0F0F0; border-radius: 5px; } .listing-topbar ul li:not(:first-child) { margin-left: 5px; } .listing-topbar ul li.is-borderless { border: none; } .listing-topbar ul li a { color: #FFFFFF; transition: .3s ease; } .listing-topbar ul li a:hover { color: #FFFFFF; } .listing-topbar ul li.is-active { border-color: #FFFFFF; } .listing-topbar ul li.is-active a { color: #FFFFFF; } .projects-container { position: relative; padding-top: 15px; } .projects-container .listing-topbar ul li.is-active a { color: #00182F; } .projects-container .listing-topbar ul li a { color: #585F65; } .projects-container #paginator-fixed.is-fixed { width: 100%; left: 0; right: 0; top: 0; top: 20px; position: fixed; background: red; border-bottom: blue; border-radius: 5px; background: #FFF; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul { background: transparent; box-shadow: none; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li.is-active a { color: #00182F; } .projects-container #paginator-fixed.is-fixed .listing-topbar ul li a { color: #585F65; } @media print, screen and (max-width: 39.99875em) { .projects-container #paginator-fixed.is-fixed .listing-topbar__filters { display: none; } } .counter { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; } .counter__single-item { margin: 0 15px; float: left; } .counter__circular-chart { display: block; height: 100px; width: 100px; } @media print, screen and (max-width: 48.06125em) { .counter__circular-chart { height: 50px; width: auto; } } .counter__circle-bottom { fill: none; stroke: #ffffff52; stroke-width: 1.5; } .counter__circle-top { fill: none; stroke-width: 1.8; stroke-linecap: square; stroke: #FFF; transition: all 0.5s ease-in-out; } .counter__time { fill: #FFF; font-size: 0.7em; font-weight: 700; text-anchor: middle; } .counter__text { margin-top: 10px; font-family: 'Muli', sans-serif; text-align: center; color: #FFF; } .merlini { background-color: #003061; padding-top: 40px; } .merlini__title { font-size: 42px; font-weight: 700; } @media print, screen and (max-width: 64.06125em) { .merlini__title { font-size: 32px; } } @media print, screen and (max-width: 39.99875em) { .merlini__title { word-wrap: break-word; } } .merlini__title--accent { color: #FFFFFF; display: block; font-weight: 300; } .merlini .align-middle { -ms-flex-pack: justify; justify-content: space-between; } .merlini__photo-desc { font-size: 10px; opacity: .75; } @media print, screen and (max-width: 64.06125em) { .merlini__photo-desc { padding: 0 30px; } } @media print, screen and (max-width: 39.99875em) { .merlini__photo-desc { padding: 0 15px; } } @media print, screen and (max-width: 39.99875em) { .merlini { padding-top: 20px; } .merlini .button { width: 100%; } } @media print, screen and (max-width: 64.06125em) { .merlini .align-middle .column, .merlini .align-middle .columns { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .merlini .section__title-box { margin-top: 0px; } } .blog__list { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .blog__list--item { -ms-flex: 0 0 24%; flex: 0 0 24%; margin-bottom: 20px; height: auto !important; } @media print, screen and (max-width: 74.99875em) { .blog__list--item { -ms-flex: 0 0 30%; flex: 0 0 30%; } } @media print, screen and (max-width: 64.06125em) { .blog__list--item { -ms-flex: 0 0 32%; flex: 0 0 32%; } } @media print, screen and (max-width: 48.06125em) { .blog__list--item { -ms-flex: 0 0 45%; flex: 0 0 45%; } } @media print, screen and (max-width: 39.99875em) { .blog__list--item { -ms-flex: 0 0 100%; flex: 0 0 100%; } } .blog__list--item__content { background: #FFF; box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.1); height: 100%; } .blog__list--item__wrap { padding: 18px 26px; } .blog__list--item__photo-box { max-height: 286px; min-height: 286px; height: 100%; overflow: hidden; } .blog__list--item__photo-box img { max-height: 384px; min-height: 384px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog__list--item__date { font-size: 12px; line-height: 1.87; color: #585F65; margin: 0; } .blog__list--item__title { font-size: 16px; line-height: 1.2; margin: 15px 0; } .blog__list--item__title > a, .blog__list--item__title > h2 { font-weight: 700; } .blog__list--item__title { color: #585F65; } .blog__list--item__title a { color: #585F65; } .blog__list--item__excerpt { font-size: 14px; line-height: 1.6; color: #585F65; margin: 0; } .blog__list--item__readmore { margin-top: 15px; } .blog__list--item__readmore a { color: #00182F; font-size: 13px; font-weight: 600; } .blog__list--item a, .blog__list--item p, .blog__list--item h1, .blog__list--item h2, .blog__list--item h3, .blog__list--item h4, .blog__list--item h5, .blog__list--item h6, .blog__list--item span { color: #00182F; } .blog__list--item time { color: #003061; font-size: 12px; } .blog-single { background: #FFF; margin-top: 56px; -ms-flex-pack: center; justify-content: center; } @media print, screen and (max-width: 39.99875em) { .blog-single { max-width: 95%; margin: 2.5% auto; } } @media print, screen and (max-width: 74.99875em) { .blog-single { max-width: 90%; margin: 5% auto; } } .blog-single__top { position: relative; } .blog-single__top--link { position: absolute; color: #003061; top: 3px; left: -64px; margin: 0; display: -ms-flexbox; display: flex; border-radius: 50%; width: 40px; height: 40px; border: 2px solid #003061; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; transition: all .5s; } .blog-single__top--link:before { font-size: 16px; font-weight: 700; margin-right: 0; } .blog-single__top--link:hover { cursor: pointer; color: #CCE3F1; background-color: #003061; } .blog-single__top--title { color: #00182F; text-align: left; text-transform: none; font-weight: 700; font-size: 42px; line-height: 48px; margin: 52px 0px 24px 0px; } @media print, screen and (max-width: 64.06125em) { .blog-single__top--title { font-size: 36px; line-height: 40px; } } @media print, screen and (max-width: 48.06125em) { .blog-single__top--title { font-size: 28px; line-height: 32px; } } .blog-single__top--date time { color: #585F65; font-size: 20px; } .blog-single__content { margin: 24px 0px 40px 0px; } .blog-single__bottom--back { position: relative; left: -70px; } @media print, screen and (max-width: 39.99875em) { .blog-single__bottom--back { left: 0; } } .blog-single__bottom--back button { margin-bottom: 56px; border: 1px solid #003061; color: #003061; border-radius: 2px; padding: 16px 14px; font-size: 13px; font-weight: 600; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; text-transform: none; height: 48px; } .blog-single__bottom--back button:hover { background-color: #CCE3F1; border: 1px solid #CCE3F1; color: #003061; } .blog-single__date { font-size: 22px; line-height: 1.09; color: #585F65; text-transform: uppercase; } .blog-single__photo-box { margin-bottom: 15px; } .blog-single__text-wysiwyg h2, .blog-single__text-wysiwyg h3, .blog-single__text-wysiwyg h4 { line-height: 1.6; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg h2 { font-size: 22px; } .blog-single__text-wysiwyg h3 { font-size: 16px; } .blog-single__text-wysiwyg p { line-height: 1.5; color: #585F65; margin-bottom: 15px; } .blog-single__text-wysiwyg strong { font-weight: 700; color: #00182F; } .blog-single__text-wysiwyg figure { display: block; margin: 0; } .blog-single__text-wysiwyg figure.wp-block-image { margin-top: 35px; margin-bottom: 50px; text-align: center; } .blog-single__text-wysiwyg figure.wp-block-image:last-child { margin-top: 35px; margin-bottom: 0; } .blog-single__text-wysiwyg figure.wp-block-image:first-child { margin: 0; } .blog-single__text-wysiwyg figcaption { font-size: 12px; margin-top: 10px; margin-bottom: 0; } .blog-single__text-wysiwyg .blue figcaption { color: #00AEEF; } .blog-single__text-wysiwyg .wp-block-columns { margin-top: 0; margin-bottom: 50px; } .blog-single__text-wysiwyg .wp-block-columns--low-margin { margin-bottom: 15px; } .blog-single__text-wysiwyg .wp-block-columns.wp-block-image:last-child { margin-top: 0; margin-bottom: 0; } .blog-single__text-wysiwyg .wp-block-embed-youtube { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .blog-single__text-wysiwyg iframe { max-width: 100%; } .blog-single__text-wysiwyg .wp-block-embed-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-single__text-wysiwyg [mda-readmore] { display: block; color: #FFFFFF; cursor: pointer; transition: all 0.15s ease-in; } .blog-single__text-wysiwyg [mda-readmore]:hover { color: #003061; } .blog-single__text-wysiwyg [mda-readmore]:after { content: ""; } .blog-single__text-wysiwyg [mda-readmore]:after { vertical-align: -1px; font-size: 12px; margin-left: 10px; } .blog-single__text-wysiwyg [mda-readmore-id] { display: none; } .blog-single__text-wysiwyg .free-space { height: 30px; width: 100%; display: block; } .site-footer { color: #FFFFFF; margin-top: 60px; font-size: 0.813em; font-size: 13px; background-color: #00182F; width: 100%; } .site-footer .row { padding: 25px 0px; max-width: 1620px !important; } .site-footer__line::after { content: ''; width: 100%; displaY: block; border-bottom: 1px solid #D1D6DC; } @media print, screen and (max-width: 39.99875em) { .site-footer__line { margin-bottom: 20px; } } @media print, screen and (max-width: 64.06125em) { .site-footer { padding: 0 0 40px; } } @media print, screen and (max-width: 39.99875em) { .site-footer { padding: 0; } } @media print, screen and (max-width: 39.99875em) { .site-footer { text-align: center; } } .site-footer--right { text-align: right; } @media print, screen and (max-width: 39.99875em) { .site-footer--right { text-align: center; margin-top: 24px; } } .site-footer--left { display: -ms-flexbox; display: flex; gap: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--left { -ms-flex-direction: column; flex-direction: column; } } .site-footer--bottom img { vertical-align: -2px; height: 16px; } @media print, screen and (max-width: 39.99875em) { .site-footer--bottom img { -o-object-fit: contain; object-fit: contain; } } .site-footer__logo { height: 68px; } @media print, screen and (max-width: 39.99875em) { .site-footer__logo { margin-bottom: 30px; } } .site-footer__social-media { text-transform: uppercase; } @media print, screen and (max-width: 39.99875em) { .site-footer__social-media { display: inline-block; } .site-footer__social-media:last-of-type { margin-bottom: 30px; } } .site-footer__social-media .icon { font-size: 36px; vertical-align: middle; margin-left: 10px; } .site-footer__social-media a { color: #FFF; } /*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=bundle-ce82bfa852.css.map */