\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/// Sizes of headings at various screen sizes. Each key is a breakpoint, and each value is a map of heading sizes.\n/// @type Map\n$header-sizes: (\n small: (\n 'h1': 24,\n 'h2': 20,\n 'h3': 19,\n 'h4': 18,\n 'h5': 17,\n 'h6': 16,\n ),\n medium: (\n 'h1': 48,\n 'h2': 40,\n 'h3': 31,\n 'h4': 25,\n 'h5': 20,\n 'h6': 16,\n ),\n) !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/// 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/// Text color of code samples.\n/// @type Color\n$code-color: $black !default;\n\n/// Font family of code samples.\n/// @type String | List\n$code-font-family: $font-family-monospace !default;\n\n/// Font weight of text in code samples.\n/// @type String\n$code-font-weight: $global-weight-normal !default;\n\n/// Background color of code samples.\n/// @type Color\n$code-background: $light-gray !default;\n\n/// Border around code samples.\n/// @type List\n$code-border: 1px solid $medium-gray !default;\n\n/// Padding around text of code samples.\n/// @type Number | List\n$code-padding: rem-calc(2 5 1) !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 deocration 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/// Font size for `` elements.\n/// @type Number\n$cite-font-size: rem-calc(13) !default;\n\n/// Text color for `` elements.\n/// @type Color\n$cite-color: $dark-gray !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 font-size: inherit;\n line-height: $paragraph-lineheight;\n margin-bottom: $paragraph-margin-bottom;\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,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-family: $header-font-family;\n font-weight: $header-font-weight;\n font-style: $header-font-style;\n color: $header-color;\n text-rendering: $header-text-rendering;\n margin-top: 0;\n margin-bottom: $header-margin-bottom;\n line-height: $header-lineheight;\n\n small {\n color: $header-small-font-color;\n line-height: 0;\n }\n }\n\n // Heading sizes\n @each $size, $headers in $header-sizes {\n @include breakpoint($size) {\n @each $header, $font-size in $headers {\n #{$header} {\n font-size: rem-calc($font-size);\n }\n }\n }\n }\n\n // Links\n a {\n color: $anchor-color;\n text-decoration: $anchor-text-decoration;\n line-height: inherit;\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 max-width: $hr-width;\n height: 0;\n border-right: 0;\n border-top: 0;\n border-bottom: $hr-border;\n border-left: 0;\n margin: $hr-margin;\n clear: both;\n }\n\n // Lists\n ul,\n ol,\n dl {\n line-height: $list-lineheight;\n margin-bottom: $list-margin-bottom;\n list-style-position: $list-style-position;\n }\n\n // List items\n li {\n font-size: inherit;\n }\n\n // Unordered lists\n ul {\n list-style-type: $list-style-type;\n margin-#{$global-left}: $list-side-margin;\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 // Citations\n cite {\n display: block;\n font-size: $cite-font-size;\n color: $cite-color;\n\n &:before {\n content: '\\2014 \\0020';\n }\n }\n\n // Abbreviations\n abbr {\n color: $body-font-color;\n cursor: help;\n border-bottom: $abbr-underline;\n }\n\n // Code\n code {\n font-family: $code-font-family;\n font-weight: $code-font-weight;\n color: $code-color;\n background-color: $code-background;\n border: $code-border;\n padding: $code-padding;\n }\n\n // Keystrokes\n kbd {\n padding: $keystroke-padding;\n margin: 0;\n background-color: $keystroke-background;\n color: $keystroke-color;\n font-family: $keystroke-font;\n\n @if has-value($keystroke-radius) {\n border-radius: $keystroke-radius;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 subhheaders.\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@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 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 // Use to remove the bullets from an unordered list\n .no-bullet {\n margin-#{$global-left}: 0;\n list-style: none;\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 by ZURB\n// foundation.zurb.com\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// scss-lint:disable all\n\n@mixin foundation-print-styles {\n .show-for-print { display: none !important; }\n\n @media print {\n * {\n @if $print-transparent-backgrounds {\n background: transparent !important;\n }\n\n color: black !important; // Black prints faster: h5bp.com/s\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 a[href]:after { content: ' (' attr(href) ')'; }\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}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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/// 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/// 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 buttons, defaulted to global-radius.\n/// @type Number\n$button-radius: $global-radius !default;\n\n@mixin form-element {\n $height: ($input-font-size + ($form-spacing * 1.5) - rem-calc(1));\n\n display: block;\n box-sizing: border-box;\n width: 100%;\n height: $height;\n padding: $form-spacing / 2;\n border: $input-border;\n margin: 0 0 $form-spacing;\n\n font-family: $input-font-family;\n font-size: $input-font-size;\n color: $input-color;\n background-color: $input-background;\n box-shadow: $input-shadow;\n border-radius: $input-radius;\n\n @if has-value($input-transition) {\n transition: $input-transition;\n }\n\n // Focus state\n &:focus {\n border: $input-border-focus;\n background-color: $input-background-focus;\n outline: none;\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 -webkit-appearance: none;\n -moz-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 // Placeholder text\n &::placeholder {\n color: $input-placeholder-color;\n }\n\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 border-radius: $button-radius;\n -webkit-appearance: none;\n -moz-appearance: none;\n }\n\n // Reset Normalize setting content-box to search elements\n // scss-lint:disable QualifyingElement\n input[type='search'] {\n box-sizing: border-box;\n }\n\n // Number input styles\n [type='number'] {\n @if not $input-number-spinners {\n -moz-appearance: textfield;\n\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 margin-#{$global-left}: $form-spacing * 0.5;\n margin-#{$global-right}: $form-spacing;\n margin-bottom: 0;\n vertical-align: baseline;\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 by ZURB\n// foundation.zurb.com\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 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 margin: 0 0 $form-spacing;\n padding: ($form-spacing / 2 + 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 by ZURB\n// foundation.zurb.com\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 by ZURB\n// foundation.zurb.com\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 + $form-spacing * 1.5);\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 border-radius: if($global-text-direction == rtl, 0 $global-radius $global-radius 0, $global-radius 0 0 $global-radius);\n }\n\n > :last-child {\n > * {\n border-radius: if($global-text-direction == rtl, $global-radius 0 0 $global-radius, 0 $global-radius $global-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 text-align: center;\n padding: 0 $input-prefix-padding;\n background: $input-prefix-background;\n color: $input-prefix-color;\n border: $input-prefix-border;\n white-space: nowrap;\n\n @if $global-flexbox {\n flex: 0 0 auto;\n display: flex;\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 // scss-lint:disable ZeroUnit\n @if $global-flexbox {\n flex: 1 1 0px;\n height: auto;\n }\n @else {\n height: $height;\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 flex: 0 0 auto;\n }\n @else {\n height: 100%;\n width: 1%;\n }\n\n a,\n input,\n button {\n margin: 0;\n }\n }\n\n // Specificity bump needed to prevent override by buttons\n // scss-lint:disable QualifyingSelector\n @if not $global-flexbox {\n .input-group .input-group-button {\n display: table-cell;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 border: $fieldset-border;\n padding: $fieldset-padding;\n margin: $fieldset-margin;\n\n legend {\n // Covers up the fieldset's border to create artificial padding\n background: $body-background;\n padding: $legend-padding;\n margin: 0;\n margin-#{$global-left}: rem-calc(-3);\n }\n}\n\n@mixin foundation-form-fieldset {\n fieldset {\n border: 0;\n padding: 0;\n margin: 0;\n }\n\n legend {\n margin-bottom: $form-spacing * 0.5;\n max-width: 100%;\n }\n\n .fieldset {\n @include fieldset;\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 + ($form-spacing * 1.5) - rem-calc(1));\n\n height: $height;\n padding: ($form-spacing / 2);\n border: $input-border;\n margin: 0 0 $form-spacing;\n font-size: $input-font-size;\n font-family: $input-font-family;\n line-height: normal;\n color: $input-color;\n background-color: $select-background;\n border-radius: $select-radius;\n -webkit-appearance: none;\n -moz-appearance: none;\n\n @if $select-triangle-color != transparent {\n @include background-triangle($select-triangle-color);\n background-size: 9px 6px;\n background-position: $global-right (-$form-spacing) center;\n background-origin: content-box;\n background-repeat: no-repeat;\n padding-#{$global-right}: ($form-spacing * 1.5);\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}\n\n@mixin foundation-form-select {\n select {\n @include form-select;\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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: map-get($foundation-palette, alert) !default;\n\n/// Color to use for labels of invalid inputs.\n/// @type Color\n$form-label-color-invalid: map-get($foundation-palette, alert) !default;\n\n/// Default font color for form error text.\n/// @type Color\n$input-error-color: map-get($foundation-palette, 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-alpha [0.1] - Transparency level of the background color.\n@mixin form-input-error(\n $background: $input-background-invalid,\n $background-alpha: 0.1\n) {\n &:not(:focus) {\n background-color: rgba($background, $background-alpha);\n border-color: $background;\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 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 by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n////\n/// @group button\n////\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/// Font color for buttons, if the background is light.\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/// 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/// 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// TODO: Document button-base() mixin\n@mixin button-base {\n @include disable-mouse-outline;\n display: inline-block;\n text-align: center;\n line-height: 1;\n cursor: pointer;\n -webkit-appearance: none;\n transition: background-color 0.25s ease-out, color 0.25s ease-out;\n vertical-align: middle;\n border: 1px solid transparent;\n border-radius: $button-radius;\n padding: $button-padding;\n margin: $button-margin;\n font-size: map-get($button-sizes, default);\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-left: 0;\n margin-right: 0;\n }\n @else {\n display: inline-block;\n width: auto;\n margin: $button-margin;\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: foreground($background, $button-color-alt, $button-color);\n }\n\n @if $background-hover == auto {\n $background-hover: scale-color($background, $lightness: $background-hover-lightness);\n }\n\n background-color: $background;\n color: $color;\n\n &:hover, &:focus {\n background-color: $background-hover;\n color: $color;\n }\n}\n\n/// Removes background fill on hover and focus for hollow buttons.\n@mixin button-hollow {\n &,\n &:hover, &:focus {\n background-color: transparent;\n }\n}\n\n@mixin button-hollow-style(\n $color: $primary-color,\n $hover-lightness: $button-hollow-hover-lightness\n) {\n $color-hover: scale-color($color, $lightness: $hover-lightness);\n\n border: 1px solid $color;\n color: $color;\n\n &:hover, &:focus {\n border-color: $color-hover;\n color: $color-hover;\n }\n}\n\n/// Adds disabled styles to a button by fading the element, reseting the cursor, and disabling pointer events.\n@mixin button-disabled($color: $primary-color) {\n opacity: $button-opacity-disabled;\n cursor: not-allowed;\n\n &:hover, &:focus {\n background-color: $color;\n color: $button-color;\n }\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 float: #{$global-right};\n margin-#{$global-left}: get-side($button-padding, right);\n display: inline-block;\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\n @if $style == solid {\n @include button-style($background, $background-hover, $color);\n }\n @else if $style == hollow {\n @include button-hollow;\n @include button-hollow-style($background);\n }\n\n @if $expand {\n @include button-expand;\n }\n}\n\n@mixin foundation-button {\n .button {\n @include button;\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 // Colors\n @each $name, $color in $foundation-palette {\n @if $button-fill != hollow {\n &.#{$name} {\n @include button-style($color, auto, auto);\n }\n }\n @else {\n &.#{$name} {\n @include button-hollow-style($color);\n }\n\n &.#{$name}.dropdown::after {\n border-top-color: $color;\n }\n }\n }\n\n // Hollow style\n @if $button-fill != hollow {\n &.hollow {\n @include button-hollow;\n @include button-hollow-style;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include button-hollow-style($color);\n }\n }\n }\n }\n\n // Disabled style\n &.disabled,\n &[disabled] {\n @include button-disabled;\n\n @each $name, $color in $foundation-palette {\n &.#{$name} {\n @include button-disabled($color);\n }\n }\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\n // Button with dropdown arrow only\n &.arrow-only::after {\n margin-#{$global-left}: 0;\n float: none;\n top: -0.1em;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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/// Default text color for items in a Menu.\n/// @type Color\n$accordion-item-color: foreground($accordion-background, $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: foreground($accordion-content-background, $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 list-style-type: none;\n background: $accordion-background;\n margin-#{$global-left}: 0;\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 display: block;\n padding: $accordion-item-padding;\n line-height: 1;\n font-size: rem-calc(12);\n color: $accordion-item-color;\n position: relative;\n border: $accordion-content-border;\n border-bottom: 0;\n\n :last-child:not(.is-active) > & {\n border-radius: 0 0 $global-radius $global-radius;\n border-bottom: $accordion-content-border;\n }\n\n &:hover,\n &:focus {\n background-color: $accordion-item-background-hover;\n }\n\n @if $accordion-plusminus {\n &::before {\n content: '+';\n position: absolute;\n #{$global-right}: 1rem;\n top: 50%;\n margin-top: -0.5rem;\n }\n\n .is-active > &::before {\n 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 display: none;\n border: $accordion-content-border;\n border-bottom: 0;\n background-color: $accordion-content-background;\n color: $accordion-content-color;\n\n :last-child > &:last-child {\n border-bottom: $accordion-content-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 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@mixin foundation-accordion-menu {\n @if $accordionmenu-arrows {\n .is-accordion-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle(6px, $accordionmenu-arrow-color, down);\n position: absolute;\n top: 50%;\n margin-top: -4px;\n right: 1rem;\n }\n }\n\n .is-accordion-submenu-parent[aria-expanded='true'] > a::after {\n transform-origin: 50% 50%;\n transform: scaleY(-1);\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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: foreground($badge-background) !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 padding: $badge-padding;\n min-width: $badge-minwidth;\n font-size: $badge-font-size;\n text-align: center;\n border-radius: 50%;\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 $foundation-palette {\n @if $name != primary {\n &.#{$name} {\n background: $color;\n color: foreground($color);\n }\n }\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 slash between breadcrumb links.\n/// @type Boolean\n$breadcrumbs-item-slash: true !default;\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 list-style: none;\n margin: $breadcrumbs-margin;\n\n // Item wrapper\n li {\n float: #{$global-left};\n color: $breadcrumbs-item-color-current;\n font-size: $breadcrumbs-item-font-size;\n cursor: default;\n\n @if $breadcrumbs-item-uppercase {\n text-transform: uppercase;\n }\n\n @if $breadcrumbs-item-slash {\n // Need to escape the backslash\n $slash: if($global-text-direction == 'ltr', '/', '\\\\');\n\n &:not(:last-child)::after {\n color: $medium-gray;\n content: $slash;\n margin: 0 $breadcrumbs-item-margin;\n position: relative;\n top: 1px;\n opacity: 1;\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 by ZURB\n// foundation.zurb.com\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 Border\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.\n/// @type Number\n$buttongroup-expand-max: 6 !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@mixin button-group(\n $child-selector: $buttongroup-child-selector\n) {\n @include clearfix;\n margin-bottom: $buttongroup-margin;\n\n @if $global-flexbox {\n display: flex;\n flex-wrap: nowrap;\n align-items: stretch;\n }\n @else {\n font-size: 0;\n }\n\n #{$child-selector} {\n margin: 0;\n margin-#{$global-right}: $buttongroup-spacing;\n margin-bottom: $buttongroup-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}\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@mixin button-group-expand(\n $selector: $buttongroup-child-selector,\n $count: null\n) {\n @if not $global-flexbox {\n margin-#{$global-right}: -$buttongroup-spacing;\n\n &::before,\n &::after {\n display: none;\n }\n }\n\n // scss-lint:disable ZeroUnit\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px;\n }\n @else {\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(1 / $i)} - #{$buttongroup-spacing});\n margin-#{$global-right}: $buttongroup-spacing;\n\n &:last-child {\n margin-#{$global-right}: $buttongroup-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}\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 // scss-lint:disable ZeroUnit\n #{$selector} {\n @if $global-flexbox {\n flex: 1 1 0px;\n }\n @else {\n width: auto;\n }\n margin-bottom: 0;\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 { @include button-group-expand; }\n\n // Colors\n @each $name, $color in $foundation-palette {\n @if $button-fill != hollow {\n &.#{$name} #{$buttongroup-child-selector} {\n @include button-style($color, auto, auto);\n }\n }\n @else {\n &.#{$name} #{$buttongroup-child-selector} {\n @include button-hollow;\n @include button-hollow-style($color);\n }\n }\n }\n\n &.stacked,\n &.stacked-for-small,\n &.stacked-for-medium {\n @include button-group-stack;\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 // scss-lint:disable MergeableSelector\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}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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/// Default inner padding for callouts.\n/// @type Number\n$callout-padding: 1rem !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 margin: $callout-margin;\n padding: $callout-padding;\n border: $callout-border;\n border-radius: $callout-radius;\n position: relative;\n color: $callout-font-color;\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}\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 &.small {\n @include callout-size(0.5rem);\n }\n\n &.large {\n @include callout-size(3rem);\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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/// Right (or left) offset for a close button.\n/// @type Number\n$closebutton-offset-horizontal: 1rem !default;\n\n/// Top (or bottom) offset for a close button.\n/// @type Number\n$closebutton-offset-vertical: 0.5rem !default;\n\n/// Default font size of the close button.\n/// @type Number\n$closebutton-size: 2em !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/// 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 color: $closebutton-color;\n #{$x}: $closebutton-offset-horizontal;\n #{$y}: $closebutton-offset-vertical;\n font-size: $closebutton-size;\n line-height: $closebutton-lineheight;\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 @include close-button;\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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-margin-nested: 1rem !default;\n\n/// Padding for items in a menu.\n/// @type Number\n$menu-item-padding: 0.7rem 1rem !default;\n\n/// Text color of an active menu item.\n/// @type Color\n$menu-item-color-active: $white !default;\n\n/// Background color of an active menu item.\n/// @type Color\n$menu-item-background-active: map-get($foundation-palette, 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/// Creates the base styles for a Menu.\n@mixin menu-base {\n margin: $menu-margin;\n list-style-type: none;\n\n @if $global-flexbox {\n width: 100%;\n display: flex;\n flex-wrap: nowrap;\n align-items: center;\n }\n\n // List items are table cell to allow for vertical alignment\n > li {\n @include disable-mouse-outline;\n\n @if $global-flexbox {\n flex: 0 0 auto;\n }\n @else {\n display: table-cell;\n vertical-align: middle;\n }\n }\n\n // Reset line height to make the height of the overall item easier to calculate\n > li > a {\n display: block;\n padding: $menu-item-padding;\n line-height: 1;\n }\n\n // Reset styles of inner elements\n input,\n a,\n button {\n margin-bottom: 0;\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 // scss-lint:disable ZeroUnit\n > li {\n flex: 1 1 0px;\n }\n }\n @else {\n width: 100%;\n display: table;\n table-layout: fixed;\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: nowrap;\n\n > li {\n flex: 0 0 auto;\n }\n }\n @else {\n > li {\n display: table-cell;\n }\n }\n }\n @else if $dir == vertical {\n @if $global-flexbox {\n flex-wrap: wrap;\n\n > li {\n flex: 0 0 100%;\n max-width: 100%;\n }\n\n > li > a {\n align-items: flex-start;\n justify-content: flex-start;\n }\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@mixin menu-simple {\n li {\n line-height: 1;\n display: inline-block;\n margin-#{$global-right}: get-side($menu-item-padding, $global-right);\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} $padding [auto] - Length of the margin.\n@mixin menu-nested($margin: $menu-margin-nested) {\n margin-#{$global-left}: $margin;\n}\n\n/// Adds support for icons to Menu items.\n/// @param {Keyword} $position [side] - Positioning for icons. Can be `side` (left, or right on RTL) or `top`.\n/// @param {Boolean} $base [true] - Set to `false` to prevent the shared CSS between side- and top-aligned icons from being printed. Set this to `false` if you're calling the mixin multiple times on the same element.\n@mixin menu-icons($position: side, $base: true) {\n @if $base {\n @if $global-flexbox {\n > li > a {\n display: flex;\n }\n }\n @else {\n > li > a {\n img,\n i,\n svg {\n vertical-align: middle;\n\n + span {\n vertical-align: middle;\n }\n }\n }\n }\n }\n\n @if $position == side {\n > li > a {\n @if $global-flexbox {\n flex-flow: row nowrap;\n }\n\n img,\n i,\n svg {\n margin-#{$global-right}: $menu-icon-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 $menu-icon-spacing;\n }\n @else {\n align-self: stretch;\n text-align: center;\n margin-bottom: $menu-icon-spacing;\n }\n }\n }\n }\n}\n\n@mixin menu-text {\n font-weight: bold;\n color: inherit;\n line-height: 1;\n padding-top: 0;\n padding-bottom: 0;\n padding: $menu-item-padding;\n}\n\n@mixin foundation-menu {\n .menu {\n @include menu-base;\n @include menu-icons;\n\n // Orientation\n @include menu-direction(horizontal);\n\n &.vertical {\n @include 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 menu-direction(horizontal);\n }\n\n &.#{$size}-vertical {\n @include menu-direction(vertical);\n }\n }\n }\n }\n\n // Simple\n &.simple {\n @include menu-simple;\n }\n\n // Align right\n &.align-#{$global-right} {\n @if $global-flexbox {\n justify-content: flex-end;\n }\n @else {\n @include clearfix;\n\n > li {\n float: $global-right;\n }\n }\n }\n\n // Even-width\n &.expanded {\n @include menu-expand;\n\n > li:first-child:last-child {\n width: 100%;\n }\n }\n\n // Vertical icons\n &.icon-top {\n @include menu-icons(top, $base: false);\n }\n\n // Nesting\n &.nested {\n @include menu-nested;\n }\n\n // Active state\n .active > a {\n color: $menu-item-color-active;\n background: $menu-item-background-active;\n }\n }\n\n .menu-text {\n @include menu-text;\n }\n\n // Align center\n .menu-centered {\n text-align: center;\n\n > .menu {\n display: inline-block;\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","@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 by ZURB\n// foundation.zurb.com\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 arrow color if arrow is used.\n/// @type Color\n$drilldown-arrow-color: $primary-color !default;\n\n/// Background color for drilldown submenus.\n/// @type Color\n$drilldown-background: $white !default;\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 !important;\n }\n }\n\n // Applied to nested
s\n .is-drilldown-submenu {\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n z-index: -1;\n // height: 100%;\n width: 100%;\n background: $drilldown-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\n @if $drilldown-arrows {\n .is-drilldown-submenu-parent > a {\n position: relative;\n\n &::after {\n @include css-triangle(6px, $drilldown-arrow-color, $global-right);\n position: absolute;\n top: 50%;\n margin-top: -6px;\n #{$global-right}: 1rem;\n }\n }\n\n .js-drilldown-back > a::before {\n @include css-triangle(6px, $drilldown-arrow-color, $global-left);\n border-#{$global-left}-width: 0;\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","// Foundation for Sites by ZURB\n// foundation.zurb.com\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/// 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 background-color: $body-background;\n border: $dropdown-border;\n border-radius: $dropdown-radius;\n display: block;\n font-size: $dropdown-font-size;\n padding: $dropdown-padding;\n position: absolute;\n visibility: hidden;\n width: $dropdown-width;\n z-index: 10;\n\n &.is-open {\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.#{$name} {\n width: $size;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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/// Minimum width of dropdown sub-menus.\n/// @type Length\n$dropdownmenu-min-width: 200px !default;\n\n/// Background color for dropdowns.\n/// @type Color\n$dropdownmenu-background: $white !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@mixin left-right-arrows {\n > a::after {\n #{$global-right}: 14px;\n margin-top: -3px;\n }\n\n &.opens-left > a::after {\n @include css-triangle(5px, $dropdownmenu-arrow-color, left);\n }\n\n &.opens-right > a::after {\n @include css-triangle(5px, $dropdownmenu-arrow-color, right);\n }\n}\n\n@mixin dropdown-menu-direction($dir: horizontal) {\n @if $dir == horizontal {\n > li.opens-left {\n > .is-dropdown-submenu {\n left: auto;\n right: 0;\n top: 100%;\n }\n }\n\n > li.opens-right {\n > .is-dropdown-submenu {\n right: auto;\n left: 0;\n top: 100%;\n }\n }\n\n @if $dropdownmenu-arrows {\n > li.is-dropdown-submenu-parent > a {\n padding-#{$global-right}: 1.5rem;\n position: relative;\n }\n\n > li.is-dropdown-submenu-parent > a::after {\n @include css-triangle(5px, $dropdownmenu-arrow-color, down);\n #{$global-right}: 5px;\n margin-top: -2px;\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 left: auto;\n right: 100%;\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 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 .no-js & ul {\n display: none;\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 left: auto;\n right: 0;\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 margin-top: -2px;\n }\n\n &.opens-inner > .is-dropdown-submenu {\n\n top: 100%;\n @if $global-text-direction == 'rtl' {\n right: auto;\n } @else {\n left: auto;\n }\n }\n\n &.opens-left > .is-dropdown-submenu {\n left: auto;\n right: 100%;\n }\n\n &.opens-right > .is-dropdown-submenu {\n right: auto;\n left: 100%;\n }\n }\n\n .is-dropdown-submenu {\n display: none;\n position: absolute;\n top: 0;\n #{$global-left}: 100%;\n min-width: $dropdownmenu-min-width;\n z-index: 1;\n background: $dropdownmenu-background;\n border: $dropdownmenu-border;\n\n .is-dropdown-submenu-parent {\n @if $dropdownmenu-arrows {\n @include 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 // scss-lint:disable SelectorDepth\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 by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n////\n/// @group flex-video\n////\n\n/// Margin below a flex video container.\n/// @type Number\n$flexvideo-margin-bottom: rem-calc(16) !default;\n\n/// Padding used to create a 4:3 aspect ratio.\n/// @type Number\n$flexvideo-ratio: 4 by 3 !default;\n\n/// Padding used to create a 16:9 aspect ratio.\n/// @type Number\n$flexvideo-ratio-widescreen: 16 by 9 !default;\n\n/// Creates a percentage height that can be used as padding in a flex video container.\n/// @param {List} $ratio - Ratio to use to calculate the height, formatted as `x by y`.\n/// @return {Number} A percentage value that can be used as the `padding-bottom` parameter of a flex video container.\n@function flex-video($ratio) {\n $w: nth($ratio, 1);\n $h: nth($ratio, 3);\n @return $h / $w * 100%;\n}\n\n/// Creates a flex video container.\n/// @param {List} $ratio [$flexvideo-ratio] - Ratio to use for the container, formatted as `x by y`.\n@mixin flex-video($ratio: $flexvideo-ratio) {\n position: relative;\n height: 0;\n padding-bottom: flex-video($ratio);\n margin-bottom: $flexvideo-margin-bottom;\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-flex-video {\n .flex-video {\n @include flex-video;\n\n &.widescreen {\n padding-bottom: flex-video($flexvideo-ratio-widescreen);\n }\n\n &.vimeo {\n padding-top: 0;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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: foreground($label-background) !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 font-size: $label-font-size;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n border-radius: $label-radius;\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 $foundation-palette {\n @if $name != primary {\n &.#{$name} {\n background: $color;\n color: foreground($color);\n }\n }\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 margin-bottom: $mediaobject-margin-bottom;\n display: if($global-flexbox, flex, block);\n\n @if $global-flexbox {\n flex-wrap: nowrap;\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\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 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 &.stack-for-#{$-zf-zero-breakpoint} .media-object-section {\n @include breakpoint($-zf-zero-breakpoint only) {\n @include media-object-stack;\n }\n }\n }\n\n .media-object-section {\n @include media-object-section;\n\n @if $global-flexbox {\n // scss-lint:disable ZeroUnit\n &.main-section {\n flex: 1 1 0px;\n }\n }\n @else {\n &.middle {\n vertical-align: middle;\n }\n\n &.bottom {\n vertical-align: bottom;\n }\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n////\n/// @group off-canvas\n////\n\n/// Width of an off-canvas menu.\n/// @type Number\n$offcanvas-size: 250px !default;\n\n/// Background color of an off-canvas menu.\n/// @type Color\n$offcanvas-background: $light-gray !default;\n\n/// Z-index of an off-canvas menu.\n/// @type Number\n$offcanvas-zindex: -1 !default;\n\n/// Length of the animation on an off-canvas menu.\n/// @type Number\n$offcanvas-transition-length: 0.5s !default;\n\n/// Timing function of the animation on an off-canvas menu.\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$offcanvas-fixed-reveal: true !default;\n\n/// Background color for the overlay that appears when an off-canvas menu 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 body.\n$maincontent-class: 'off-canvas-content' !default;\n\n/// Box shadow to place under the main content area. This shadow overlaps the off-canvas menus.\n/// @type Shadow\n$maincontent-shadow: 0 0 10px rgba($black, 0.5) !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 // Extra properties needed on and to make off-canvas work\n html,\n body {\n height: 100%;\n }\n\n .off-canvas-wrapper {\n width: 100%;\n overflow-x: hidden;\n position: relative;\n backface-visibility: hidden;\n -webkit-overflow-scrolling: auto;\n }\n\n .off-canvas-wrapper-inner {\n @include clearfix;\n position: relative;\n width: 100%;\n min-height: 100%; \n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n }\n\n // Container for page content\n .off-canvas-content,\n .#{$maincontent-class} {\n min-height: 100%;\n background: $body-background;\n transition: transform $offcanvas-transition-length $offcanvas-transition-timing;\n backface-visibility: hidden;\n z-index: 1;\n padding-bottom: 0.1px; // Prevents margin collapsing, which would reveal the box shadow of the wrapper\n\n @if has-value($maincontent-shadow) {\n box-shadow: $maincontent-shadow;\n }\n }\n\n // Click-to-exit overlay (generated by JavaScript)\n .js-off-canvas-exit {\n display: none;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: $offcanvas-exit-background;\n cursor: pointer;\n transition: background $offcanvas-transition-length $offcanvas-transition-timing;\n }\n}\n\n/// Adds basic styles for an off-canvas menu.\n@mixin off-canvas-base {\n @include disable-mouse-outline;\n position: absolute;\n background: $offcanvas-background;\n z-index: $offcanvas-zindex;\n max-height: 100%;\n overflow-y: auto;\n transform: translateX(0);\n}\n\n@mixin off-canvas-position(\n $position: left,\n $size: $offcanvas-size,\n $fixed: false\n) {\n @if $position == left {\n left: -$size;\n top: 0;\n width: $size;\n }\n @else if $position == right {\n right: -$size;\n top: 0;\n width: $size;\n }\n\n // Generates an open state class that matches the width of the menu\n @at-root {\n .is-open-#{$position} {\n @if $position == left {\n transform: translateX($size);\n }\n @else if $position == right {\n transform: translateX(-$size);\n }\n }\n }\n}\n\n/// Adds styles that reveal an off-canvas menu.\n/// @param {Keyword} $position [left] - Position of the off-canvas menu being revealed.\n@mixin off-canvas-reveal(\n $position: left\n) {\n #{$position}: 0;\n z-index: auto;\n\n @if $offcanvas-fixed-reveal {\n position: fixed;\n }\n\n & ~ .#{$maincontent-class} {\n margin-#{$position}: $offcanvas-size;\n }\n}\n\n@mixin foundation-off-canvas {\n @include off-canvas-basics;\n\n // Off-canvas container\n .off-canvas {\n @include off-canvas-base;\n\n &.position-left { @include off-canvas-position(left); }\n &.position-right { @include off-canvas-position(right); }\n }\n\n // Reveal off-canvas menu 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);\n }\n\n .position-right.reveal-for-#{$name} {\n @include off-canvas-reveal(right);\n }\n }\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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 margin: 0;\n overflow: hidden;\n list-style: none;\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 max-height: 100%;\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 margin: 0;\n width: 100%;\n max-width: 100%;\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 padding: $orbit-caption-padding;\n margin-bottom: 0;\n color: foreground($orbit-caption-background);\n background-color: $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 background-color: $orbit-bullet-background;\n border-radius: 50%;\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 by ZURB\n// foundation.zurb.com\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: foreground($pagination-item-background-current) !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 `false`, don't display current page number on mobile.\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/// Adds styles for a pagination container. Apply this to a ``.\n@mixin pagination-container {\n @include clearfix;\n margin-#{$global-left}: 0;\n margin-bottom: $pagination-margin-bottom;\n\n // List item\n li {\n font-size: $pagination-font-size;\n margin-#{$global-right}: $pagination-item-spacing;\n border-radius: $pagination-radius;\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 color: $pagination-item-color;\n display: block;\n padding: $pagination-item-padding;\n border-radius: $global-radius;\n\n &:hover {\n background: $pagination-item-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: $pagination-item-background-current;\n color: $pagination-item-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 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 content: '\\2026';\n padding: $pagination-item-padding;\n color: $pagination-ellipsis-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 content: '\\00ab';\n display: inline-block;\n margin-#{$global-right}: 0.5rem;\n }\n\n .pagination-next a::after,\n .pagination-next.disabled::after {\n content: '\\00bb';\n display: inline-block;\n margin-#{$global-left}: 0.5rem;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n/// Adds styles for a progress bar container.\n@mixin progress-container {\n background-color: $progress-background;\n height: $progress-height;\n margin-bottom: $progress-margin-bottom;\n border-radius: $progress-radius;\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 position: absolute;\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 by ZURB\n// foundation.zurb.com\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 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 display: inline-block;\n max-width: 100%;\n height: $slider-height;\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 position: absolute;\n left: 0;\n z-index: 1;\n display: inline-block;\n width: $slider-handle-width;\n height: $slider-handle-height;\n background-color: $slider-handle-background;\n transition: $slider-transition;\n touch-action: manipulation;\n border-radius: $slider-radius;\n\n &:hover {\n background-color: scale-color($slider-handle-background, $lightness: -15%);\n }\n\n &.is-dragging {\n transition: all 0s linear;\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 by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n@mixin foundation-sticky {\n .sticky-container {\n position: relative;\n }\n\n .sticky {\n position: absolute;\n z-index: 0;\n transform: translate3d(0, 0, 0);\n }\n\n .sticky.is-stuck {\n position: fixed;\n z-index: 5;\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: absolute;\n left: auto;\n right: auto;\n\n &.is-at-bottom {\n bottom: 0;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n////\n/// @group reveal\n////\n\n/// Default background color of a modal.\n/// @type Color\n$reveal-background: $white !default;\n\n/// Default width of a modal, with no class applied.\n/// @type Number\n$reveal-width: 600px !default;\n\n/// Default maximum width of a modal.\n/// @type Number\n$reveal-max-width: $global-width !default;\n\n/// Default padding inside a modal.\n/// @type Number\n$reveal-padding: $global-padding !default;\n\n/// Default border around a modal.\n/// @type Number\n$reveal-border: 1px solid $medium-gray !default;\n\n/// Default radius for modal.\n/// @type Number\n$reveal-radius: $global-radius !default;\n\n/// z-index for modals. The overlay uses this value, while the modal itself uses this value plus one.\n/// @type Number\n$reveal-zindex: 1005 !default;\n\n/// Background color of modal overlays.\n/// @type Color\n$reveal-overlay-background: rgba($black, 0.45) !default;\n\n/// Adds styles for a modal overlay.\n/// @param {Color} $background [$reveal-overlay-background] - Background color of the overlay.\n@mixin reveal-overlay($background: $reveal-overlay-background) {\n display: none;\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: $reveal-zindex;\n background-color: $background;\n overflow-y: scroll;\n}\n\n/// Adds base styles for a modal.\n@mixin reveal-modal-base {\n @include disable-mouse-outline;\n display: none;\n z-index: $reveal-zindex + 1;\n padding: $reveal-padding;\n border: $reveal-border;\n background-color: $reveal-background;\n border-radius: $reveal-radius;\n\n @include breakpoint(medium) {\n min-height: 0;\n }\n\n // Make sure rows don't have a min-width on them\n .column,\n .columns {\n min-width: 0;\n }\n\n // Strip margins from the last item in the modal\n > :last-child {\n margin-bottom: 0;\n }\n}\n\n/// Adjusts the width of a modal.\n/// @param {Number} $width - Width of the modal. Generally a percentage.\n/// @param {Number} $max-width [$reveal-max-width] - Maximum width of the modal.\n@mixin reveal-modal-width(\n $width: $reveal-width,\n $max-width: $reveal-max-width\n) {\n @include breakpoint(medium) {\n @extend %reveal-centered;\n width: $width;\n max-width: $reveal-max-width;\n }\n}\n\n/// Creates a full-screen modal, which stretches the full width and height of the window.\n@mixin reveal-modal-fullscreen {\n // scss-lint:disable DuplicateProperty\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n height: 100vh;\n min-height: 100vh;\n max-width: none;\n margin-left: 0;\n border: 0;\n border-radius: 0;\n}\n\n@mixin foundation-reveal {\n // [TODO] Is this necessary?\n // scss-lint:disable QualifyingElement\n body.is-reveal-open {\n overflow: hidden;\n }\n // html gets this class only in iOS\n html.is-reveal-open,\n html.is-reveal-open body {\n min-height: 100%;\n overflow: hidden;\n user-select: none;\n }\n\n // Overlay\n .reveal-overlay {\n @include reveal-overlay;\n }\n\n // Modal container\n .reveal {\n @include reveal-modal-base;\n @include reveal-modal-width($reveal-width);\n position: relative;\n top: 100px;\n margin-left: auto;\n margin-right: auto;\n overflow-y: auto;\n\n // Placeholder selector for medium-and-up modals\n // Prevents duplicate CSS when defining multiple Reveal sizes\n @include breakpoint(medium) {\n %reveal-centered {\n left: auto;\n right: auto;\n margin: 0 auto;\n }\n }\n\n // Remove padding\n &.collapse {\n padding: 0;\n }\n\n // Sizing classes\n &.tiny { @include reveal-modal-width(30%); }\n &.small { @include reveal-modal-width(50%); }\n &.large { @include reveal-modal-width(90%); }\n\n // Full-screen mode\n &.full {\n @include reveal-modal-fullscreen;\n }\n\n @include breakpoint($-zf-zero-breakpoint only) {\n @include reveal-modal-fullscreen;\n }\n\n &.without-overlay {\n position: fixed;\n }\n }\n}\n","// Foundation for Sites by ZURB\n// foundation.zurb.com\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// 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 margin-bottom: $switch-margin;\n outline: 0;\n position: relative;\n user-select: none;\n\n // These properties cascade down to the switch text\n color: $white;\n font-weight: bold;\n font-size: rem-calc(14);\n}\n\n/// Adds styles for a switch input. Apply this to an `` within a switch.\n@mixin switch-input {\n opacity: 0;\n position: absolute;\n margin-bottom: 0;\n}\n\n/// Adds styles for the background and paddle of a switch. Apply this to a `