{
	"version": 3,
	"file": "atom.css",
	"sources": [
		"atom.scss",
		"_sass/_functions.scss",
		"_sass/_01_settings_colors.scss",
		"_sass/_02_settings_typography.scss",
		"_sass/_03_settings_mixins_media_queries.scss",
		"_sass/_04_settings_global.scss"
	],
	"sourcesContent": [
		"@charset \"utf-8\";\n\n@import \"functions.scss\";\n\n$include-html-classes: false;\n@import \"01_settings_colors.scss\";\n@import \"02_settings_typography.scss\";\n@import \"03_settings_mixins_media_queries.scss\";\n@import \"04_settings_global.scss\";\n\n* {\n\tdisplay: block;\n}\n\n:root {\n\tmargin: 3em;\n\tbackground: $body-bg;\n\tcolor: $body-font-color;\n\tfont-family: $body-font-family;\n}\n\nfeed {\n\t> title {\n\t\ttext-align: center;\n\t\tcolor: lighten($primary-color, 25%);\n\t\tfont-family: $header-font-family;\n\t\tfont-size: $font-size-h1 * 1.5;\n\t\tfont-weight: bolder;\n\t\t&::before {\n\t\t\tcontent: 'Atom Feed for ';\n\t\t\tfont-weight: initial;\n\t\t}\n\t\t&::after {\n\t\t\tcontent: \"This Atom feed is meant to be used by RSS reader applications and websites.\";\n\t\t\tdisplay: block;\n\t\t\tpadding: 1em;\n\t\t\tbackground-color: $alert-color;\n\t\t\tcolor: #fff;\n\t\t\tfont-family: initial;\n\t\t\tfont-size: initial;\n\t\t\tletter-spacing: initial;\n\t\t}\n\t}\n\t\n\t> id,\n\t> updated,\n\t> subtitle,\n\t> author,\n\t> link,\n\t> generator {\n\t\tdisplay: none;\n\t}\n}\n\nentry {\n\tpadding: 1em 0;\n\tborder-bottom: 1px solid invert($body-bg);\n\t&:last-child {\n\t\tborder-bottom: none;\n\t}\n\n\t> title {\n\t\tcolor: $secondary-color;\n\t\tfont-family: $header-font-family;\n\t\tfont-size: $font-size-h1;\n\t\tmargin-bottom: 0.5em;\n\t}\n\n\t> link::after {\n\t\tcontent: attr(href);\n\t\tcolor: $primary-color;\n\t}\n\n\t> updated {\n\t\tcolor: $grey-5;\n\t\tfont-size: small;\n\t}\n\n\t> summary {\n\t\tmargin-top: 1em;\n\t}\n\n\t> id,\n\t> author,\n\t> category,\n\t> published,\n\t> content {\n\t\tdisplay: none;\n\t}\n}\n",
		"// Foundation by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n// This is the default html and body font-size for the base rem value.\n$rem-base: 16px !default;\n\n// IMPORT ONCE\n// We use this to prevent styles from being loaded multiple times for compenents that rely on other components.\n$modules: () !default;\n@mixin exports($name) {\n  // Import from global scope\n  $modules: $modules !global;\n  // Check if a module is already on the list\n  $module_index: index($modules, $name);\n  @if (($module_index == null) or ($module_index == false)) {\n    $modules: append($modules, $name) !global;\n    @content;\n  }\n}\n\n//\n// @functions\n//\n\n\n// RANGES\n// We use these functions to define ranges for various things, like media queries.\n@function lower-bound($range){\n  @if length($range) <= 0 {\n    @return 0;\n  }\n  @return nth($range,1);\n}\n\n@function upper-bound($range) {\n  @if length($range) < 2 {\n    @return 999999999999;\n  }\n  @return nth($range, 2);\n}\n\n// STRIP UNIT\n// It strips the unit of measure and returns it\n@function strip-unit($num) {\n  @return $num / ($num * 0 + 1);\n}\n\n// TEXT INPUT TYPES\n\n@function text-inputs( $types: all, $selector: input ) {\n\n    $return: ();\n\n    $all-text-input-types:\n      text\n      password\n      date\n      datetime\n      datetime-local\n      month\n      week\n      email\n      number\n      search\n      tel\n      time\n      url\n      color\n      textarea;\n\n    @if $types == all { $types: $all-text-input-types; }\n\n    @each $type in $types {\n        @if $type == textarea {\n            @if $selector == input {\n              $return: append($return, unquote('#{$type}'), comma)\n            } @else {\n              $return: append($return, unquote('#{$type}#{$selector}'), comma)\n            }\n        } @else {\n            $return: append($return, unquote('#{$selector}[type=\"#{$type}\"]'), comma)\n        }\n    }\n\n    @return $return;\n\n}\n\n// CONVERT TO REM\n@function convert-to-rem($value, $base-value: $rem-base)  {\n  $value: strip-unit($value) / strip-unit($base-value) * 1rem;\n  @if ($value == 0rem) { $value: 0; } // Turn 0rem into 0\n  @return $value;\n}\n\n@function data($attr) {\n  @if $namespace {\n    @return '[data-' + $namespace + '-' + $attr + ']';\n  }\n\n  @return '[data-' + $attr + ']';\n}\n\n// REM CALC\n\n// New Syntax, allows to optionally calculate on a different base value to counter compounding effect of rem's.\n// Call with 1, 2, 3 or 4 parameters, 'px' is not required but supported:\n//\n//   rem-calc(10 20 30px 40);\n//\n// Space delimited, if you want to delimit using comma's, wrap it in another pair of brackets\n//\n//   rem-calc((10, 20, 30, 40px));\n//\n// Optionally call with a different base (eg: 8px) to calculate rem.\n//\n//   rem-calc(16px 32px 48px, 8px);\n//\n// If you require to comma separate your list\n//\n//   rem-calc((16px, 32px, 48), 8px);\n\n@function rem-calc($values, $base-value: $rem-base) {\n  $max: length($values);\n\n  @if $max == 1 { @return convert-to-rem(nth($values, 1), $base-value); }\n\n  $remValues: ();\n  @for $i from 1 through $max {\n    $remValues: append($remValues, convert-to-rem(nth($values, $i), $base-value));\n  }\n  @return $remValues;\n}\n\n// OLD EM CALC\n// Deprecated: We'll drop support for this in 5.1.0, use rem-calc()\n@function emCalc($values){\n  @return rem-calc($values);\n}\n\n// OLD EM CALC\n// Deprecated: We'll drop support for this in 5.1.0, use rem-calc()\n@function em-calc($values){\n  @return rem-calc($values);\n}\n",
		"/* TOC - Color Variables\n\n- Basics\n- Corporate Identity Colorpalette\n- Foundation Color Variables\n- Grey Scale\n- Topbar-Navigation\n- Footer\n- Code\n\n*/\n\n\n\n/* Basics\n------------------------------------------------------------------- */\n\n$text-color:       \t#3b3b3b;\n$body-font-color:   $text-color;\n$body-bg:           #fbfbfb;\n\n\n\n/* Corporate Identity Colorpalette\n------------------------------------------------------------------- */\n\n// base\n$col:  hsl(180, 60%, 40%);\n\n// light/dark version\n$colll: lighten($col, 20%);\n$coll:  lighten($col, 10%);\n$cold:   darken($col, 10%);\n$coldd:  darken($col, 20%);\n\n$cpm:  complement($col);            // complement\n\n$cpmll: lighten($cpm, 16%);\n$cpml:  lighten($cpm, 8% );\n$cpmd:   darken($cpm, 8% );\n$cpmdd:  darken($cpm, 16%);\n\n/* Misc\n------------------------------------------------------------------- */\n\n$link-color: $cold;\n$frontpage-topic-color: $cold;\n$header-font-color: $text-color;\n$subheader-font-color: $text-color;\n$slider-overlay-color: rgba($body-bg, 0.9);\n\n\n/* Foundation Color Variables\n------------------------------------------------------------------- */\n\n$primary-color: $cold;\n$secondary-color: $cold;\n$alert-color: $cpmll;\n$success-color: $coll;\n$warning-color: $col;\n$info-color: $cold;\n\n\n\n/* Grey Scale\n------------------------------------------------------------------- */\n\n$grey-1: #E4E4E4;\n$grey-2: #D7D7D7;\n$grey-3: #CBCBCB;\n$grey-4: #BEBEBE;\n$grey-5: #A4A4A4;\n$grey-6: #979797;\n$grey-7: #8B8B8B;\n$grey-8: #7E7E7E;\n$grey-9: #646464;\n$grey-10: #575757;\n$grey-11: #4B4B4B;\n$grey-12: #3E3E3E;\n$grey-13: #313131;\n$grey-14: #242424;\n$grey-15: #171717;\n$grey-16: #0B0B0B;\n\n\n/* Topbar-Navigation\n------------------------------------------------------------------- */\n\n$topbar-bg-color: $body-bg;\n\n$topbar-dropdown-toggle-color: $grey-16;\n\n$topbar-link-color: $text-color;\n$topbar-link-color-hover: $text-color;\n$topbar-link-color-active: $body-bg;\n$topbar-link-color-active-hover: $text-color;\n\n$topbar-dropdown-label-color: $coll;\n$topbar-dropdown-link-bg-hover: $grey-5;\n\n$topbar-link-bg-active: $cold; // Active Navigation Link\n$topbar-link-bg-hover: $grey-2;\n$topbar-link-bg-active-hover: $grey-2;\n\n\n$topbar-dropdown-bg: $grey-2; // Background Mobile Navigation\n$topbar-dropdown-link-color: $text-color;\n$topbar-dropdown-link-bg: $grey-1;\n\n$topbar-menu-link-color-toggled: $coll;\n$topbar-menu-icon-color-toggled: $coll;\n$topbar-menu-link-color: $text-color;\n$topbar-menu-icon-color: $text-color;\n$topbar-menu-link-color-toggled: $grey-2;\n$topbar-menu-icon-color-toggled: $grey-2;\n\n\n\n/* Footer\n------------------------------------------------------------------- */\n\n$footer-bg: $cold;\n$footer-color: $body-bg;\n$footer-link-color: $body-bg;\n\n\n$subfooter-bg: $grey-13;\n$subfooter-color: $grey-5;\n$subfooter-link-color: $grey-5;\n\n\n\n/* Code\n------------------------------------------------------------------- */\n\n$code-background-color: scale-color($grey-4, $lightness: 70%);\n\n$highlight-background: #ffffff;\n$highlight-comment: #999988;\n$highlight-error: #a61717;\n$highlight-comment-special: #999999;\n$highlight-deleted: #000000;\n$highlight-error-2: #aa0000;\n$highlight-literal-string: #d14;\n$highlight-literal-number: #009999;\n$highlight-name-attribut: #008080;\n$highlight-error-background: #e3d2d2;\n$highlight-generic-deleted: #ffdddd;\n$highlight-generic-deleted-specific: #ffaaaa;\n$highlight-generic-inserted: #ddffdd;\n$highlight-generic-inserted-specific: #aaffaa;\n$highlight-generic-output: #888888;\n$highlight-generic-prompt: #555555;\n$highlight-subheading: #aaaaaa;\n$highlight-keyword-type: #445588;\n$highlight-name-builtin: #0086B3;\n$highlight-name-class: #445588;\n$highlight-name-entity: #800080;\n$highlight-name-exception: #990000;\n$highlight-name-function: #990000;\n$highlight-name-namespace: #555555;\n$highlight-name-tag: #000080;\n$highlight-text-whitespace: #bbbbbb;\n$highlight-literal-string-regex: #009926;\n$highlight-literal-string-symbol: #990073;\n",
		"/* TOC – Typography variables\n\nModular Scale › http://modularscale.com/scale/?px1=16&px2=36&ra1=1.25&ra2=0\n\n- Fonts\n- Font Weight\n- Font Size Variables\n\n*/\n\n@import \"functions\"; // Allows the use of rem-calc() or lower-bound() in your settings\n\n\n\n/* Fonts\n------------------------------------------------------------------- */\n\n$base-font-size: 16px;\n$rem-base: $base-font-size;\n// $base-line-height is 24px while $base-font-size is 16px\n$base-line-height: 1.5 !default;\n\n\n$font-family-sans-serif: \"Lato\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n$font-family-serif: \"Noto Serif\", Georgia, Times, serif;\n$font-family-monospace: \"Lucida Console\", Monaco, monospace;\n\n$body-font-family: $font-family-sans-serif;\n$body-font-weight: normal;\n$body-font-style: normal;\n\n$header-font-family: $font-family-sans-serif;\n\n\n\n/* Font Weight\n------------------------------------------------------------------- */\n\n$font-weight-normal: normal;\n$font-weight-bold: bold;\n\n\n\n/* Font Size Variables\n------------------------------------------------------------------- */\n\n$font-size-p:    \t$base-font-size;\n$font-size-h1:      2.441em;\n$font-size-h2:      1.953em;\n$font-size-h3:      1.563em;\n$font-size-h4:      1.25em;\n$font-size-h5:      1.152em;\n$font-size-small:   0.8em;\n\n.font-size-h1   { font-size: $font-size-h1; }\n.font-size-h2   { font-size: $font-size-h2; }\n.font-size-h3   { font-size: $font-size-h3; }\n.font-size-h4   { font-size: $font-size-h4; }\n.font-size-h5   { font-size: $font-size-h5; }\n",
		"// Foundation by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n//\n// Foundation Variables\n//\n\n// Data attribute namespace\n// styles get applied to [data-mysite-plugin], etc\n$namespace: false !default;\n\n// The default font-size is set to 100% of the browser style sheet (usually 16px)\n// for compatibility with browser-based text zoom or user-set defaults.\n\n// Since the typical default browser font-size is 16px, that makes the calculation for grid size.\n// If you want your base font-size to be different and not have it affect the grid breakpoints,\n// set $rem-base to $base-font-size and make sure $base-font-size is a px value.\n$base-font-size: 100% !default;\n\n\n\n//\n// Global Foundation Mixins\n//\n\n// @mixins\n//\n// We use this to control border radius.\n// $radius - Default: $global-radius || 4px\n@mixin radius($radius:$global-radius) {\n  @if $radius {\n    border-radius: $radius;\n  }\n}\n\n// @mixins\n//\n// We use this to create equal side border radius on elements.\n// $side - Options: left, right, top, bottom\n@mixin side-radius($side, $radius:$global-radius) {\n  @if ($side == left or $side == right) {\n    -webkit-border-bottom-#{$side}-radius: $radius;\n    -webkit-border-top-#{$side}-radius: $radius;\n    border-bottom-#{$side}-radius: $radius;\n    border-top-#{$side}-radius: $radius;\n  } @else {\n    -webkit-#{$side}-left-radius: $radius;\n    -webkit-#{$side}-right-radius: $radius;\n    border-#{$side}-left-radius: $radius;\n    border-#{$side}-right-radius: $radius;\n  }\n}\n\n// @mixins\n//\n// We can control whether or not we have inset shadows edges.\n// $active - Default: true, Options: false\n@mixin inset-shadow($active:true) {\n  box-shadow: $shiny-edge-size $shiny-edge-color inset;\n\n  @if $active { &:active {\n    box-shadow: $shiny-edge-size $shiny-edge-active-color inset; } }\n}\n\n// @mixins\n//\n// We use this to add transitions to elements\n// $property - Default: all, Options: http://www.w3.org/TR/css3-transitions/#animatable-properties\n// $speed - Default: 300ms\n// $ease - Default:ease-out, Options: http://css-tricks.com/almanac/properties/t/transition-timing-function/\n@mixin single-transition($property:all, $speed:300ms, $ease:ease-out) {\n  transition: $property $speed $ease;\n}\n\n// @mixins\n//\n// We use this to add box-sizing across browser prefixes\n@mixin box-sizing($type:border-box) {\n  -webkit-box-sizing: $type; // Android < 2.3, iOS < 4\n     -moz-box-sizing: $type; // Firefox < 29\n          box-sizing: $type; // Chrome, IE 8+, Opera, Safari 5.1\n}\n\n// @mixins\n//\n// We use this to create isosceles triangles\n// $triangle-size - Used to set border-size. No default, set a px or em size.\n// $triangle-color - Used to set border-color which makes up triangle. No default\n// $triangle-direction - Used to determine which direction triangle points. Options: top, bottom, left, right\n@mixin css-triangle($triangle-size, $triangle-color, $triangle-direction) {\n  content: \"\";\n  display: block;\n  width: 0;\n  height: 0;\n  border: inset $triangle-size;\n  @if ($triangle-direction == top) {\n    border-color: $triangle-color transparent transparent transparent;\n    border-top-style: solid;\n  }\n  @if ($triangle-direction == bottom) {\n    border-color: transparent transparent $triangle-color transparent;\n    border-bottom-style: solid;\n  }\n  @if ($triangle-direction == left) {\n    border-color: transparent transparent transparent $triangle-color;\n    border-left-style: solid;\n  }\n  @if ($triangle-direction == right) {\n    border-color: transparent $triangle-color transparent transparent;\n    border-right-style: solid;\n  }\n}\n\n// @mixins\n//\n// We use this to create the icon with three lines aka the hamburger icon, the menu-icon or the navicon\n// $width - Width of hamburger icon in rem\n// $left - If false, icon will be centered horizontally || explicitly set value in rem\n// $top - If false, icon will be centered vertically || explicitly set value in rem\n// $thickness - thickness of lines in hamburger icon, set value in px\n// $gap - spacing between the lines in hamburger icon, set value in px\n// $color - icon color\n// $hover-color - icon color during hover\n// $offcanvas - Set to true of @include in offcanvas\n@mixin hamburger($width, $left, $top, $thickness, $gap, $color, $hover-color, $offcanvas) {\n  span::after {\n    content: \"\";\n    position: absolute;\n    display: block;\n    height: 0;\n\n    @if $offcanvas {\n      @if $top {\n        top: $top;\n      }\n      @else {\n        top: 50%;\n        margin-top: (-$width/2);\n      }\n      @if $left {\n        left: $left;\n      }\n      @else {\n        left: ($tabbar-menu-icon-width - $width)/2;\n      }\n    }\n    @else {\n      top: 50%;\n      margin-top: -($width/2);\n      #{$opposite-direction}: $topbar-link-padding;\n    }\n\n    box-shadow:\n      0 0 0 $thickness $color,\n      0 $gap + $thickness 0 $thickness $color,\n      0 (2 * $gap + 2*$thickness) 0 $thickness $color;\n    width: $width;\n  }\n  span:hover:after {\n    box-shadow:\n      0 0 0 $thickness $hover-color,\n      0 $gap + $thickness 0 $thickness $hover-color,\n      0 (2 * $gap + 2*$thickness) 0 $thickness $hover-color;\n  }\n}\n\n// We use this to do clear floats\n@mixin clearfix {\n  &:before, &:after { content: \" \"; display: table; }\n  &:after { clear: both; }\n}\n\n// @mixins\n//\n// We use this to add a glowing effect to block elements\n// $selector - Used for selector state. Default: focus, Options: hover, active, visited\n// $fade-time - Default: 300ms\n// $glowing-effect-color - Default: fade-out($primary-color, .25)\n@mixin block-glowing-effect($selector:focus, $fade-time:300ms, $glowing-effect-color:fade-out($primary-color, .25)) {\n  transition: box-shadow $fade-time, border-color $fade-time ease-in-out;\n\n  &:#{$selector} {\n    box-shadow: 0 0 5px $glowing-effect-color;\n    border-color: $glowing-effect-color;\n  }\n}\n\n// @mixins\n//\n// We use this to translate elements in 2D\n// $horizontal: Default: 0\n// $vertical: Default: 0\n@mixin translate2d($horizontal:0, $vertical:0) {\n  transform: translate($horizontal,$vertical)\n}\n\n// @mixins\n//\n// Makes an element visually hidden, but accessible.\n// @see http://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n@mixin element-invisible {\n  position: absolute !important;\n  height: 1px;\n  width: 1px;\n  overflow: hidden;\n  clip: rect(1px, 1px, 1px, 1px);\n}\n\n// @mixins\n//\n// Turns off the element-invisible effect.\n@mixin element-invisible-off {\n  position: static !important;\n  height: auto;\n  width: auto;\n  overflow: visible;\n  clip: auto;\n}\n\n\n// We use these to control text direction settings\n$text-direction: ltr !default;\n$default-float: left !default;\n$opposite-direction: right !default;\n@if $text-direction == ltr {\n  $default-float: left;\n  $opposite-direction: right;\n} @else {\n  $default-float: right;\n  $opposite-direction: left;\n}\n\n// We use these to control inset shadow shiny edges and depressions.\n$shiny-edge-size: 0 1px 0 !default;\n$shiny-edge-color: rgba(#fff, .5) !default;\n$shiny-edge-active-color: rgba(#000, .2) !default;\n\n// We use this to control whether or not CSS classes come through in the gem files.\n$include-html-classes: true !default;\n$include-print-styles: true !default;\n$include-html-global-classes: $include-html-classes !default;\n\n$column-gutter: rem-calc(30) !default;\n\n\n\n\n// d. Media Query Ranges\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n$small-range: (0em, 40em);\n$medium-range: (40.063em, 64em);\n$large-range: (64.063em, 90em);\n$xlarge-range: (90.063em, 120em);\n$xxlarge-range: (120.063em, 99999999em);\n\n\n$screen: \"only screen\" !default;\n\n$landscape: \"#{$screen} and (orientation: landscape)\" !default;\n$portrait: \"#{$screen} and (orientation: portrait)\" !default;\n\n$small-up: $screen !default;\n$small-only: \"#{$screen} and (max-width: #{upper-bound($small-range)})\";\n\n$medium-up: \"#{$screen} and (min-width:#{lower-bound($medium-range)})\" !default;\n$medium-only: \"#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})\" !default;\n\n$large-up: \"#{$screen} and (min-width:#{lower-bound($large-range)})\" !default;\n$large-only: \"#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})\" !default;\n\n$xlarge-up: \"#{$screen} and (min-width:#{lower-bound($xlarge-range)})\" !default;\n$xlarge-only: \"#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})\" !default;\n\n$xxlarge-up: \"#{$screen} and (min-width:#{lower-bound($xxlarge-range)})\" !default;\n$xxlarge-only: \"#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})\" !default;\n\n// Legacy\n$small: $medium-up;\n$medium: $medium-up;\n$large: $large-up;\n\n//We use this as cursors values for enabling the option of having custom cursors in the whole site's stylesheet\n$cursor-auto-value: auto !default;\n$cursor-crosshair-value: crosshair !default;\n$cursor-default-value: default !default;\n$cursor-pointer-value: pointer !default;\n$cursor-help-value: help !default;\n$cursor-text-value: text !default;\n\n\n@include exports(\"global\") {\n\n  // Meta styles are included in all builds, as they are a dependancy of the Javascript.\n  // Used to provide media query values for javascript components.\n  // Forward slash placed around everything to convince PhantomJS to read the value.\n\n  meta.foundation-version {\n    font-family: \"/5.5.0/\";\n  }\n\n  meta.foundation-mq-small {\n    font-family: \"/\" + unquote($small-up) + \"/\";\n    width: lower-bound($small-range);\n  }\n\n  meta.foundation-mq-small-only {\n    font-family: \"/\" + unquote($small-only) + \"/\";\n    width: lower-bound($small-range);\n  }\n\n  meta.foundation-mq-medium {\n    font-family: \"/\" + unquote($medium-up) + \"/\";\n    width: lower-bound($medium-range);\n  }\n\n  meta.foundation-mq-medium-only {\n    font-family: \"/\" + unquote($medium-only) + \"/\";\n    width: lower-bound($medium-range);\n  }\n\n  meta.foundation-mq-large {\n    font-family: \"/\" + unquote($large-up) + \"/\";\n    width: lower-bound($large-range);\n  }\n\n  meta.foundation-mq-large-only {\n    font-family: \"/\" + unquote($large-only) + \"/\";\n    width: lower-bound($large-range);\n  }\n\n  meta.foundation-mq-xlarge {\n    font-family: \"/\" + unquote($xlarge-up) + \"/\";\n    width: lower-bound($xlarge-range);\n  }\n\n  meta.foundation-mq-xlarge-only {\n    font-family: \"/\" + unquote($xlarge-only) + \"/\";\n    width: lower-bound($xlarge-range);\n  }\n\n  meta.foundation-mq-xxlarge {\n    font-family: \"/\" + unquote($xxlarge-up) + \"/\";\n    width: lower-bound($xxlarge-range);\n  }\n\n  meta.foundation-data-attribute-namespace {\n    font-family: #{$namespace};\n  }\n\n  @if $include-html-global-classes {\n\n    // Must be 100% for off canvas to work\n    html, body { height: 100%; }\n\n    // Set box-sizing globally to handle padding and border widths\n    *,\n    *:before,\n    *:after {\n      @include box-sizing(border-box);\n    }\n\n    html,\n    body { font-size: $base-font-size; }\n\n    // Default body styles\n    body {\n      background: $body-bg;\n      color: $body-font-color;\n      padding: 0;\n      margin: 0;\n      font-family: $body-font-family;\n      font-weight: $body-font-weight;\n      font-style: $body-font-style;\n      line-height: $base-line-height; // Set to $base-line-height to take on browser default of 150%\n      position: relative;\n      cursor: $cursor-auto-value;\n    }\n\n  a:hover { cursor: $cursor-pointer-value; }\n\n    // Grid Defaults to get images and embeds to work properly\n    img { max-width: 100%; height: auto; }\n\n    img { -ms-interpolation-mode: bicubic; }\n\n    #map_canvas,\n    .map_canvas {\n      img,\n      embed,\n      object { max-width: none !important;\n      }\n    }\n\n    // Miscellaneous useful HTML classes\n    .left { float: left !important; }\n    .right { float: right !important; }\n    .clearfix { @include clearfix; }\n\n    // Hide visually and from screen readers\n    .hide {\n      display: none !important;\n      visibility: hidden;\n    }\n\n    // Hide visually and from screen readers, but maintain layout\n    .invisible { visibility: hidden; }\n\n    // Font smoothing\n    // Antialiased font smoothing works best for light text on a dark background.\n    // Apply to single elements instead of globally to body.\n    // Note this only applies to webkit-based desktop browsers and Firefox 25 (and later) on the Mac.\n    .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }\n\n    // Get rid of gap under images by making them display: inline-block; by default\n    img {\n      display: inline-block;\n      vertical-align: middle;\n    }\n\n    //\n    // Global resets for forms\n    //\n\n    // Make sure textarea takes on height automatically\n    textarea { height: auto; min-height: 50px; }\n\n    // Make select elements 100% width by default\n    select { width: 100%; }\n  }\n}\n",
		"$spacing-unit: 30px;\n\n\n// Foundation by ZURB\n// foundation.zurb.com\n// Licensed under MIT Open Source\n\n//\n\n// Table of Contents\n// Foundation Settings\n//\n// a. Base\n// b. Grid\n// c. Global\n// d. Media Query Ranges\n// e. Typography\n// 01. Accordion\n// 02. Alert Boxes\n// 03. Block Grid\n// 04. Breadcrumbs\n// 05. Buttons\n// 06. Button Groups\n// 07. Clearing\n// 08. Dropdown\n// 09. Dropdown Buttons\n// 10. Flex Video\n// 11. Forms\n// 12. Icon Bar\n// 13. Inline Lists\n// 14. Joyride\n// 15. Keystrokes\n// 16. Labels\n// 17. Magellan\n// 18. Off-canvas\n// 19. Orbit\n// 20. Pagination\n// 21. Panels\n// 22. Pricing Tables\n// 23. Progress Bar\n// 24. Range Slider\n// 25. Reveal\n// 26. Side Nav\n// 27. Split Buttons\n// 28. Sub Nav\n// 29. Switch\n// 30. Tables\n// 31. Tabs\n// 32. Thumbnails\n// 33. Tooltips\n// 34. Top Bar\n// 36. Visibility Classes\n\n// a. Base\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// This is the default html and body font-size for the base rem value.\n// $rem-base: 16px;\n\n// Allows the use of rem-calc() or lower-bound() in your settings\n@import \"functions\";\n\n// The default font-size is set to 100% of the browser style sheet (usually 16px)\n// for compatibility with browser-based text zoom or user-set defaults.\n\n// Since the typical default browser font-size is 16px, that makes the calculation for grid size.\n// If you want your base font-size to be different and not have it affect the grid breakpoints,\n// set $rem-base to $base-font-size and make sure $base-font-size is a px value.\n// $base-font-size: 100%;\n\n$base-font-size: 16px;\n$rem-base: $base-font-size;\n\n\n// The $base-font-size is 100% while $base-line-height is 150%\n// $base-line-height: 150%;\n\n// We use this to control whether or not CSS classes come through in the gem files.\n$include-html-classes: true;\n// $include-print-styles: true;\n$include-html-global-classes: $include-html-classes;\n\n// b. Grid\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-grid-classes: $include-html-classes;\n// $include-xl-html-grid-classes: false;\n\n// $row-width: rem-calc(1000);\n// $total-columns: 12;\n// $column-gutter: rem-calc(30);\n\n// c. Global\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// We use these to define default font stacks\n// $font-family-sans-serif: \"Lato\", \"Helvetica Neue\", \"Helvetica\", Helvetica, Arial, sans-serif;\n// $font-family-serif: \"Volkhov\", Georgia, Times, serif;\n// $font-family-monospace: \"Lucida Console\", Monaco, monospace;\n\n// We use these to define default font weights\n// $font-weight-normal: normal !default;\n// $font-weight-bold: bold !default;\n\n// $white       : #FFFFFF;\n// $ghost       : #FAFAFA;\n// $snow        : #F9F9F9;\n// $vapor       : #F6F6F6;\n// $white-smoke : #F5F5F5;\n// $silver      : #EFEFEF;\n// $smoke       : #EEEEEE;\n// $gainsboro   : #DDDDDD;\n// $iron        : #CCCCCC;\n// $base        : #AAAAAA;\n// $aluminum    : #999999;\n// $jumbo       : #888888;\n// $monsoon     : #777777;\n// $steel       : #666666;\n// $charcoal    : #555555;\n// $tuatara     : #444444;\n// $oil         : #333333;\n// $jet         : #222222;\n// $black       : #000000;\n\n// We use these as default colors throughout\n// $primary-color: #008CBA;\n// $secondary-color: #e7e7e7;\n// $alert-color: #f04124;\n// $success-color: #43AC6A;\n// $warning-color: #f08a24;\n// $info-color: #a0d3e8;\n\n// We use these to control various global styles\n// $body-bg: $white;\n// $body-font-color: $jet;\n// $body-font-family: $font-family-sans-serif;\n// $body-font-weight: $font-weight-normal;\n// $body-font-style: normal;\n\n// We use this to control font-smoothing\n// $font-smoothing: antialiased;\n\n// We use these to control text direction settings\n// $text-direction: ltr;\n// $opposite-direction: right;\n// $default-float: left;\n// $last-child-float: $opposite-direction;\n\n// We use these to make sure border radius matches unless we want it different.\n$global-radius: 3px;\n// $global-rounded: 1000px;\n\n// We use these to control inset shadow shiny edges and depressions.\n// $shiny-edge-size: 0 1px 0;\n// $shiny-edge-color: rgba($white, .5);\n// $shiny-edge-active-color: rgba($black, .2);\n\n// // d. Media Query Ranges\n// // - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $small-range: (0em, 40em);\n// $medium-range: (40.063em, 64em);\n// $large-range: (64.063em, 90em);\n// $xlarge-range: (90.063em, 120em);\n// $xxlarge-range: (120.063em, 99999999em);\n\n// $screen: \"only screen\";\n\n// // $landscape: \"#{$screen} and (orientation: landscape)\";\n// // $portrait: \"#{$screen} and (orientation: portrait)\";\n\n// $small-up: $screen;\n// $small-only: \"#{$screen} and (max-width: #{upper-bound($small-range)})\";\n\n// $medium-up: \"#{$screen} and (min-width:#{lower-bound($medium-range)})\";\n// $medium-only: \"#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})\";\n\n// $large-up: \"#{$screen} and (min-width:#{lower-bound($large-range)})\";\n// $large-only: \"#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})\";\n\n// $xlarge-up: \"#{$screen} and (min-width:#{lower-bound($xlarge-range)})\";\n// $xlarge-only: \"#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})\";\n\n// $xxlarge-up: \"#{$screen} and (min-width:#{lower-bound($xxlarge-range)})\";\n// $xxlarge-only: \"#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})\";\n\n// Legacy\n// $small: $medium-up;\n// $medium: $medium-up;\n// $large: $large-up;\n\n// We use this as cursors values for enabling the option of having custom cursors in the whole site's stylesheet\n// $cursor-crosshair-value: crosshair;\n// $cursor-default-value: default;\n// $cursor-pointer-value: pointer;\n// $cursor-help-value: help;\n// $cursor-text-value: text;\n\n// e. Typography\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-type-classes: $include-html-classes;\n\n// We use these to control header font styles\n// $header-font-family: $font-family-serif;\n// $header-font-weight: $font-weight-normal;\n// $header-font-style: normal;\n// $header-font-color: $jet;\n// $header-line-height: 1.4;\n// $header-top-margin: .2rem;\n// $header-bottom-margin: .5rem;\n// $header-text-rendering: optimizeLegibility;\n\n// We use these to control header font sizes\n// $h1-font-size: rem-calc(54);\n// $h2-font-size: rem-calc(36);\n// $h3-font-size: rem-calc(29);\n// $h4-font-size: rem-calc(24);\n// $h5-font-size: rem-calc(19);\n// $h6-font-size: 1rem;\n\n// We use these to control header size reduction on small screens\n// $h1-font-reduction: rem-calc(10) !default;\n// $h2-font-reduction: rem-calc(10) !default;\n// $h3-font-reduction: rem-calc(5) !default;\n// $h4-font-reduction: rem-calc(5) !default;\n// $h5-font-reduction: 0 !default;\n// $h6-font-reduction: 0 !default;\n\n// These control how subheaders are styled.\n// $subheader-line-height: 1.4;\n// $subheader-font-color: scale-color($header-font-color, $lightness: 35%);\n// $subheader-font-weight: $font-weight-normal;\n// $subheader-top-margin: .2rem;\n// $subheader-bottom-margin: .5rem;\n\n// A general <small> styling\n// $small-font-size: 60%;\n// $small-font-color: scale-color($header-font-color, $lightness: 35%);\n\n// We use these to style paragraphs\n// $paragraph-font-family: inherit;\n// $paragraph-font-weight: $font-weight-normal;\n// $paragraph-font-size: 1rem;\n// $paragraph-line-height: 1.6;\n// $paragraph-margin-bottom: rem-calc(20);\n// $paragraph-aside-font-size: rem-calc(14);\n// $paragraph-aside-line-height: 1.35;\n// $paragraph-aside-font-style: italic;\n// $paragraph-text-rendering: optimizeLegibility;\n\n// We use these to style <code> tags\n// $code-color: $oil;\n// $code-font-family: $font-family-monospace;\n// $code-font-weight: $font-weight-normal;\n// $code-background-color: scale-color($secondary-color, $lightness: 70%);\n// $code-border-size: 1px;\n// $code-border-style: solid;\n// $code-border-color: scale-color($code-background-color, $lightness: -10%);\n// $code-padding: rem-calc(2) rem-calc(5) rem-calc(1);\n\n// We use these to style anchors\n// $anchor-text-decoration: none;\n// $anchor-text-decoration-hover: none;\n// $anchor-font-color: $primary-color;\n// $anchor-font-color-hover: scale-color($primary-color, $lightness: -14%);\n\n// We use these to style the <hr> element\n// $hr-border-width: 1px;\n// $hr-border-style: solid;\n$hr-border-color: $grey-3;\n// $hr-margin: rem-calc(20);\n\n// We use these to style lists\n// $list-font-family: $paragraph-font-family;\n// $list-font-size: $paragraph-font-size;\n// $list-line-height: $paragraph-line-height;\n// $list-margin-bottom: $paragraph-margin-bottom;\n// $list-style-position: outside;\n$list-side-margin: 1.3rem;\n// $list-ordered-side-margin: 1.4rem;\n// $list-side-margin-no-bullet: 0;\n// $list-nested-margin: rem-calc(20);\n// $definition-list-header-weight: $font-weight-bold;\n// $definition-list-header-margin-bottom: .3rem;\n// $definition-list-margin-bottom: rem-calc(12);\n\n// We use these to style blockquotes\n// $blockquote-font-color: scale-color($header-font-color, $lightness: 35%);\n// $blockquote-padding: rem-calc(9 20 0 19);\n// $blockquote-border: 1px solid $gainsboro;\n// $blockquote-cite-font-size: rem-calc(13);\n// $blockquote-cite-font-color: scale-color($header-font-color, $lightness: 23%);\n// $blockquote-cite-link-color: $blockquote-cite-font-color;\n\n// Acronym styles\n// $acronym-underline: 1px dotted $gainsboro;\n\n// We use these to control padding and margin\n// $microformat-padding: rem-calc(10 12);\n// $microformat-margin: rem-calc(0 0 20 0);\n\n// We use these to control the border styles\n// $microformat-border-width: 1px;\n// $microformat-border-style: solid;\n// $microformat-border-color: $gainsboro;\n\n// We use these to control full name font styles\n// $microformat-fullname-font-weight: $font-weight-bold;\n// $microformat-fullname-font-size: rem-calc(15);\n\n// We use this to control the summary font styles\n// $microformat-summary-font-weight: $font-weight-bold;\n\n// We use this to control abbr padding\n// $microformat-abbr-padding: rem-calc(0 1);\n\n// We use this to control abbr font styles\n// $microformat-abbr-font-weight: $font-weight-bold;\n// $microformat-abbr-font-decoration: none;\n\n// 01. Accordion\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-accordion-classes: $include-html-classes;\n\n$accordion-navigation-padding: rem-calc(12);\n// $accordion-navigation-bg-color: #ffffff;\n// $accordion-navigation-hover-bg-color: $grey-1;\n// $accordion-navigation-active-bg-color: $grey-1;\n// $accordion-navigation-font-color: $jet;\n// $accordion-navigation-font-size: rem-calc(16);\n// $accordion-navigation-font-family: $body-font-family;\n\n// $accordion-content-padding: $column-gutter/2;\n$accordion-content-active-bg-color: $body-bg;\n\n// 02. Alert Boxes\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-alert-classes: $include-html-classes;\n\n// We use this to control alert padding.\n// $alert-padding-top: rem-calc(14);\n// $alert-padding-default-float: $alert-padding-top;\n// $alert-padding-opposite-direction: $alert-padding-top + rem-calc(10);\n// $alert-padding-bottom: $alert-padding-top;\n\n// We use these to control text style.\n// $alert-font-weight: $font-weight-normal;\n$alert-font-size: rem-calc(15);\n// $alert-font-color: $white;\n// $alert-font-color-alt: scale-color($secondary-color, $lightness: -66%);\n\n// We use this for close hover effect.\n// $alert-function-factor: -14%;\n\n// We use these to control border styles.\n// $alert-border-style: solid;\n// $alert-border-width: 1px;\n// $alert-border-color: scale-color($primary-color, $lightness: $alert-function-factor);\n// $alert-bottom-margin: rem-calc(20);\n\n// We use these to style the close buttons\n// $alert-close-color: $oil;\n// $alert-close-top: 50%;\n// $alert-close-position: rem-calc(4);\n// $alert-close-font-size: rem-calc(22);\n// $alert-close-opacity: 0.3;\n// $alert-close-opacity-hover: 0.5;\n// $alert-close-padding: 9px 6px 4px;\n\n// We use this to control border radius\n// $alert-radius: $global-radius;\n\n// We use this to control transition effects\n// $alert-transition-speed: 300ms;\n// $alert-transition-ease: ease-out;\n\n// 03. Block Grid\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-block-grid-classes: $include-html-classes;\n// $include-xl-html-block-grid-classes: false;\n\n// We use this to control the maximum number of block grid elements per row\n// $block-grid-elements: 12;\n// $block-grid-default-spacing: rem-calc(20);\n// $align-block-grid-to-grid: false;\n\n// Enables media queries for block-grid classes. Set to false if writing semantic HTML.\n// $block-grid-media-queries: true;\n\n// 04. Breadcrumbs\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-nav-classes: $include-html-classes;\n\n// We use this to set the background color for the breadcrumb container.\n$crumb-bg: $grey-1;\n\n// We use these to set the padding around the breadcrumbs.\n// $crumb-padding: rem-calc(9 9 14 0);\n// $crumb-side-padding: rem-calc(12);\n\n// We use these to control border styles.\n// $crumb-function-factor: -10%;\n$crumb-border-size: 0;\n// $crumb-border-style: solid;\n$crumb-border-color: $grey-1;\n$crumb-radius: 0;\n\n// We use these to set various text styles for breadcrumbs.\n// $crumb-font-size: rem-calc(11);\n// $crumb-font-color: $primary-color;\n// $crumb-font-color-current: $oil;\n// $crumb-font-color-unavailable: $aluminum;\n// $crumb-font-transform: uppercase;\n// $crumb-link-decor: underline;\n\n// We use these to control the slash between breadcrumbs\n// $crumb-slash-color: $base;\n$crumb-slash: \"/\";\n\n// 05. Buttons\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-button-classes: $include-html-classes;\n\n// We use these to build padding for buttons.\n// $button-tny: rem-calc(10);\n// $button-sml: rem-calc(14);\n// $button-med: rem-calc(16);\n// $button-lrg: rem-calc(18);\n\n// We use this to control the display property.\n// $button-display: inline-block;\n// $button-margin-bottom: rem-calc(20);\n\n// We use these to control button text styles.\n// $button-font-family: $body-font-family;\n// $button-font-color: $white;\n// $button-font-color-alt: $oil;\n// $button-font-tny: rem-calc(11);\n// $button-font-sml: rem-calc(13);\n// $button-font-med: rem-calc(16);\n// $button-font-lrg: rem-calc(20);\n// $button-font-weight: $font-weight-normal;\n// $button-font-align: center;\n\n// We use these to control various hover effects.\n// $button-function-factor: -20%;\n\n// We use these to control button border and hover styles.\n// $button-border-width: 0px;\n// $button-border-style: solid;\n// $button-bg-color: $primary-color;\n// $button-bg-hover: scale-color($button-bg-color, $lightness: $button-function-factor);\n// $button-border-color: $button-bg-hover;\n// $secondary-button-bg-hover: scale-color($secondary-color, $lightness: $button-function-factor);\n// $secondary-button-border-color: $secondary-button-bg-hover;\n// $success-button-bg-hover: scale-color($success-color, $lightness: $button-function-factor);\n// $success-button-border-color: $success-button-bg-hover;\n// $alert-button-bg-hover: scale-color($alert-color, $lightness: $button-function-factor);\n// $alert-button-border-color: $alert-button-bg-hover;\n\n// We use this to set the default radius used throughout the core.\n// $button-radius: $global-radius;\n// $button-round: $global-rounded;\n\n// We use this to set default opacity and cursor for disabled buttons.\n// $button-disabled-opacity: 0.7;\n// $button-disabled-cursor: $cursor-default-value;\n\n// 06. Button Groups\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-button-classes: $include-html-classes;\n\n// Sets the margin for the right side by default, and the left margin if right-to-left direction is used\n// $button-bar-margin-opposite: rem-calc(10);\n// $button-group-border-width: 1px;\n\n// 07. Clearing\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-clearing-classes: $include-html-classes;\n\n// We use these to set the background colors for parts of Clearing.\n// $clearing-bg: $oil;\n// $clearing-caption-bg: $clearing-bg;\n// $clearing-carousel-bg: rgba(51,51,51,0.8);\n// $clearing-img-bg: $clearing-bg;\n\n// We use these to style the close button\n// $clearing-close-color: $iron;\n// $clearing-close-size: 30px;\n\n// We use these to style the arrows\n// $clearing-arrow-size: 12px;\n// $clearing-arrow-color: $clearing-close-color;\n\n// We use these to style captions\n// $clearing-caption-font-color: $iron;\n// $clearing-caption-font-size: 0.875em;\n// $clearing-caption-padding: 10px 30px 20px;\n\n// We use these to make the image and carousel height and style\n// $clearing-active-img-height: 85%;\n// $clearing-carousel-height: 120px;\n// $clearing-carousel-thumb-width: 120px;\n// $clearing-carousel-thumb-active-border: 1px solid rgb(255,255,255);\n\n// 08. Dropdown\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-dropdown-classes: $include-html-classes;\n\n// We use these to controls height and width styles.\n// $f-dropdown-max-width: 200px;\n// $f-dropdown-height: auto;\n// $f-dropdown-max-height: none;\n\n// Used for bottom position\n// $f-dropdown-margin-top: 2px;\n\n// Used for right position\n// $f-dropdown-margin-left: $f-dropdown-margin-top;\n\n// Used for left position\n// $f-dropdown-margin-right: $f-dropdown-margin-top;\n\n// Used for top position\n// $f-dropdown-margin-bottom: $f-dropdown-margin-top;\n\n// We use this to control the background color\n// $f-dropdown-bg: $white;\n\n// We use this to set the border styles for dropdowns.\n// $f-dropdown-border-style: solid;\n// $f-dropdown-border-width: 1px;\n// $f-dropdown-border-color: scale-color($white, $lightness: -20%);\n\n// We use these to style the triangle pip.\n// $f-dropdown-triangle-size: 6px;\n// $f-dropdown-triangle-color: $white;\n// $f-dropdown-triangle-side-offset: 10px;\n\n// We use these to control styles for the list elements.\n// $f-dropdown-list-style: none;\n// $f-dropdown-font-color: $charcoal;\n// $f-dropdown-font-size: rem-calc(14);\n// $f-dropdown-list-padding: rem-calc(5, 10);\n// $f-dropdown-line-height: rem-calc(18);\n// $f-dropdown-list-hover-bg: $smoke  ;\n// $dropdown-mobile-default-float: 0;\n\n// We use this to control the styles for when the dropdown has custom content.\n// $f-dropdown-content-padding: rem-calc(20);\n\n// Default radius for dropdown.\n// $f-dropdown-radius: $global-radius;\n\n\n// 09. Dropdown Buttons\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-button-classes: $include-html-classes;\n\n// We use these to set the color of the pip in dropdown buttons\n// $dropdown-button-pip-color: $white;\n// $dropdown-button-pip-color-alt: $oil;\n\n// $button-pip-tny: rem-calc(6);\n// $button-pip-sml: rem-calc(7);\n// $button-pip-med: rem-calc(9);\n// $button-pip-lrg: rem-calc(11);\n\n// We use these to style tiny dropdown buttons\n// $dropdown-button-padding-tny: $button-pip-tny * 7;\n// $dropdown-button-pip-size-tny: $button-pip-tny;\n// $dropdown-button-pip-opposite-tny: $button-pip-tny * 3;\n// $dropdown-button-pip-top-tny: -$button-pip-tny / 2 + rem-calc(1);\n\n// We use these to style small dropdown buttons\n// $dropdown-button-padding-sml: $button-pip-sml * 7;\n// $dropdown-button-pip-size-sml: $button-pip-sml;\n// $dropdown-button-pip-opposite-sml: $button-pip-sml * 3;\n// $dropdown-button-pip-top-sml: -$button-pip-sml / 2 + rem-calc(1);\n\n// We use these to style medium dropdown buttons\n// $dropdown-button-padding-med: $button-pip-med * 6 + rem-calc(3);\n// $dropdown-button-pip-size-med: $button-pip-med - rem-calc(3);\n// $dropdown-button-pip-opposite-med: $button-pip-med * 2.5;\n// $dropdown-button-pip-top-med: -$button-pip-med / 2 + rem-calc(2);\n\n// We use these to style large dropdown buttons\n// $dropdown-button-padding-lrg: $button-pip-lrg * 5 + rem-calc(3);\n// $dropdown-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);\n// $dropdown-button-pip-opposite-lrg: $button-pip-lrg * 2.5;\n// $dropdown-button-pip-top-lrg: -$button-pip-lrg / 2 + rem-calc(3);\n\n// 10. Flex Video\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-media-classes: $include-html-classes;\n\n// We use these to control video container padding and margins\n// $flex-video-padding-top: rem-calc(25);\n// $flex-video-padding-bottom: 67.5%;\n// $flex-video-margin-bottom: rem-calc(16);\n\n// We use this to control widescreen bottom padding\n// $flex-video-widescreen-padding-bottom: 56.34%;\n\n// 11. Forms\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-form-classes: $include-html-classes;\n\n// We use this to set the base for lots of form spacing and positioning styles\n// $form-spacing: rem-calc(16);\n\n// We use these to style the labels in different ways\n// $form-label-pointer: pointer;\n// $form-label-font-size: rem-calc(14);\n// $form-label-font-weight: $font-weight-normal;\n// $form-label-line-height: 1.5;\n// $form-label-font-color: scale-color($black, $lightness: 30%);\n// $form-label-small-transform: capitalize;\n// $form-label-bottom-margin: 0;\n// $input-font-family: inherit;\n// $input-font-color: rgba(0,0,0,0.75);\n// $input-font-size: rem-calc(14);\n// $input-bg-color: $white;\n// $input-focus-bg-color: scale-color($white, $lightness: -2%);\n// $input-border-color: scale-color($white, $lightness: -20%);\n// $input-focus-border-color: scale-color($white, $lightness: -40%);\n// $input-border-style: solid;\n// $input-border-width: 1px;\n// $input-border-radius: $global-radius;\n// $input-disabled-bg: $gainsboro;\n// $input-disabled-cursor: $cursor-default-value;\n// $input-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);\n\n// We use these to style the fieldset border and spacing.\n// $fieldset-border-style: solid;\n// $fieldset-border-width: 1px;\n// $fieldset-border-color: $gainsboro;\n// $fieldset-padding: rem-calc(20);\n// $fieldset-margin: rem-calc(18 0);\n\n// We use these to style the legends when you use them\n// $legend-bg: $white;\n// $legend-font-weight: $font-weight-bold;\n// $legend-padding: rem-calc(0 3);\n\n// We use these to style the prefix and postfix input elements\n// $input-prefix-bg: scale-color($white, $lightness: -5%);\n// $input-prefix-border-color: scale-color($white, $lightness: -20%);\n// $input-prefix-border-size: 1px;\n// $input-prefix-border-type: solid;\n// $input-prefix-overflow: hidden;\n// $input-prefix-font-color: $oil;\n// $input-prefix-font-color-alt: $white;\n\n// We use this setting to turn on/off HTML5 number spinners (the up/down arrows)\n// $input-number-spinners: true;\n\n// We use these to style the error states for inputs and labels\n// $input-error-message-padding: rem-calc(6 9 9);\n// $input-error-message-top: -1px;\n// $input-error-message-font-size: rem-calc(12);\n// $input-error-message-font-weight: $font-weight-normal;\n// $input-error-message-font-style: italic;\n// $input-error-message-font-color: $white;\n// $input-error-message-font-color-alt: $oil;\n\n// We use this to style the glowing effect of inputs when focused\n// $input-include-glowing-effect: true;\n// $glowing-effect-fade-time: 0.45s;\n// $glowing-effect-color: $input-focus-border-color;\n\n// Select variables\n// $select-bg-color: $ghost;\n// $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%);\n\n// 12. Icon Bar\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// We use these to style the icon-bar and items\n// $include-html-icon-bar-classes: $include-html-classes;\n// $icon-bar-bg: $oil;\n// $icon-bar-font-color: $white;\n// $icon-bar-font-size: 1rem;\n// $icon-bar-hover-color: $primary-color;\n// $icon-bar-icon-color: $white;\n// $icon-bar-icon-size: 1.875rem;\n// $icon-bar-image-width: 1.875rem;\n// $icon-bar-image-height: 1.875rem;\n// $icon-bar-active-color: $primary-color;\n// $icon-bar-item-padding: 1.25rem;\n\n// 13. Inline Lists\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-inline-list-classes: $include-html-classes;\n\n// We use this to control the margins and padding of the inline list.\n// $inline-list-top-margin: 0;\n// $inline-list-opposite-margin: 0;\n// $inline-list-bottom-margin: rem-calc(17);\n// $inline-list-default-float-margin: rem-calc(-22);\n// $inline-list-default-float-list-margin: rem-calc(22);\n\n// $inline-list-padding: 0;\n\n// We use this to control the overflow of the inline list.\n// $inline-list-overflow: hidden;\n\n// We use this to control the list items\n// $inline-list-display: block;\n\n// We use this to control any elements within list items\n// $inline-list-children-display: block;\n\n// 14. Joyride\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-joyride-classes: $include-html-classes;\n\n// Controlling default Joyride styles\n// $joyride-tip-bg: $oil;\n// $joyride-tip-default-width: 300px;\n// $joyride-tip-padding: rem-calc(18 20 24);\n// $joyride-tip-border: solid 1px $charcoal;\n// $joyride-tip-radius: 4px;\n// $joyride-tip-position-offset: 22px;\n\n// Here, we're setting the tip font styles\n// $joyride-tip-font-color: $white;\n// $joyride-tip-font-size: rem-calc(14);\n// $joyride-tip-header-weight: $font-weight-bold;\n\n// This changes the nub size\n// $joyride-tip-nub-size: 10px;\n\n// This adjusts the styles for the timer when its enabled\n// $joyride-tip-timer-width: 50px;\n// $joyride-tip-timer-height: 3px;\n// $joyride-tip-timer-color: $steel;\n\n// This changes up the styles for the close button\n// $joyride-tip-close-color: $monsoon;\n// $joyride-tip-close-size: 24px;\n// $joyride-tip-close-weight: $font-weight-normal;\n\n// When Joyride is filling the screen, we use this style for the bg\n// $joyride-screenfill: rgba(0,0,0,0.5);\n\n// 15. Keystrokes\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-keystroke-classes: $include-html-classes;\n\n// We use these to control text styles.\n// $keystroke-font: \"Consolas\", \"Menlo\", \"Courier\", monospace;\n// $keystroke-font-size: inherit;\n// $keystroke-font-color: $jet;\n// $keystroke-font-color-alt: $white;\n// $keystroke-function-factor: -7%;\n\n// We use this to control keystroke padding.\n// $keystroke-padding: rem-calc(2 4 0);\n\n// We use these to control background and border styles.\n// $keystroke-bg: scale-color($white, $lightness: $keystroke-function-factor);\n// $keystroke-border-style: solid;\n// $keystroke-border-width: 1px;\n// $keystroke-border-color: scale-color($keystroke-bg, $lightness: $keystroke-function-factor);\n// $keystroke-radius: $global-radius;\n\n// 16. Labels\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-label-classes: $include-html-classes;\n\n// We use these to style the labels\n// $label-padding: rem-calc(4 8 4);\n// $label-radius: $global-radius;\n\n// We use these to style the label text\n// $label-font-sizing: rem-calc(11);\n// $label-font-weight: $font-weight-normal;\n// $label-font-color: $oil;\n// $label-font-color-alt: $white;\n// $label-font-family: $body-font-family;\n\n// 17. Magellan\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-magellan-classes: $include-html-classes;\n\n// $magellan-bg: $white;\n// $magellan-padding: 0 !important;\n\n// 18. Off-canvas\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-off-canvas-classes: $include-html-classes;\n\n// $tabbar-bg: $oil;\n// $tabbar-height: rem-calc(45);\n// $tabbar-icon-width: $tabbar-height;\n// $tabbar-line-height: $tabbar-height;\n// $tabbar-color: $white;\n// $tabbar-middle-padding: 0 rem-calc(10);\n\n// Off Canvas Divider Styles\n// $tabbar-right-section-border: solid 1px scale-color($tabbar-bg, $lightness: 13%);\n// $tabbar-left-section-border: solid 1px scale-color($tabbar-bg, $lightness: -50%);\n\n// Off Canvas Tab Bar Headers\n// $tabbar-header-color: $white;\n// $tabbar-header-weight: $font-weight-bold;\n// $tabbar-header-line-height: $tabbar-height;\n// $tabbar-header-margin: 0;\n\n// Off Canvas Menu Variables\n// $off-canvas-width: rem-calc(250);\n// $off-canvas-bg: $oil;\n// $off-canvas-bg-hover: scale-color($tabbar-bg, $lightness: -30%);\n\n// Off Canvas Menu List Variables\n// $off-canvas-label-padding: 0.3rem rem-calc(15);\n// $off-canvas-label-color: $aluminum;\n// $off-canvas-label-text-transform: uppercase;\n// $off-canvas-label-font-size: rem-calc(12);\n// $off-canvas-label-font-weight: $font-weight-bold;\n// $off-canvas-label-bg: $tuatara;\n// $off-canvas-label-border-top: 1px solid scale-color($tuatara, $lightness: 14%);\n// $off-canvas-label-border-bottom: none;\n// $off-canvas-label-margin:0;\n// $off-canvas-link-padding: rem-calc(10, 15);\n// $off-canvas-link-color: rgba($white, 0.7);\n// $off-canvas-link-border-bottom: 1px solid scale-color($off-canvas-bg, $lightness: -25%);\n// $off-canvas-back-bg: $tuatara;\n// $off-canvas-back-border-top: $off-canvas-label-border-top;\n// $off-canvas-back-border-bottom: $off-canvas-label-border-bottom;\n// $off-canvas-back-hover-bg: scale-color($off-canvas-back-bg, $lightness: -30%);\n// $off-canvas-back-hover-border-top: 1px solid scale-color($off-canvas-label-bg, $lightness: 14%);\n// $off-canvas-back-hover-border-bottom: none;\n\n// Off Canvas Menu Icon Variables\n// $tabbar-menu-icon-color: $white;\n// $tabbar-menu-icon-hover: scale-color($tabbar-menu-icon-color, $lightness: -30%);\n\n// $tabbar-menu-icon-text-indent: rem-calc(35);\n// $tabbar-menu-icon-width: $tabbar-height;\n// $tabbar-menu-icon-height: $tabbar-height;\n// $tabbar-menu-icon-padding: 0;\n\n// $tabbar-hamburger-icon-width: rem-calc(16);\n// $tabbar-hamburger-icon-left: false;\n// $tabbar-hamburger-icon-top: false;\n// $tabbar-hamburger-icon-thickness: 1px;\n// $tabbar-hamburger-icon-gap: 6px;\n\n// Off Canvas Back-Link Overlay\n// $off-canvas-overlay-transition: background 300ms ease;\n// $off-canvas-overlay-cursor: pointer;\n// $off-canvas-overlay-box-shadow: -4px 0 4px rgba($black, 0.5), 4px 0 4px rgba($black, 0.5);\n// $off-canvas-overlay-background: rgba($white, 0.2);\n// $off-canvas-overlay-background-hover: rgba($white, 0.05);\n\n// Transition Variables\n// $menu-slide: \"transform 500ms ease\";\n\n// 19. Orbit\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-orbit-classes: $include-html-classes;\n\n// We use these to control the caption styles\n// $orbit-container-bg: none;\n// $orbit-caption-bg: rgba(51,51,51, 0.8);\n// $orbit-caption-font-color: $white;\n// $orbit-caption-font-size: rem-calc(14);\n// $orbit-caption-position: \"bottom\"; // Supported values: \"bottom\", \"under\"\n// $orbit-caption-padding: rem-calc(10 14);\n// $orbit-caption-height: auto;\n\n// We use these to control the left/right nav styles\n// $orbit-nav-bg: transparent;\n// $orbit-nav-bg-hover: rgba(0,0,0,0.3);\n// $orbit-nav-arrow-color: $white;\n// $orbit-nav-arrow-color-hover: $white;\n\n// We use these to control the timer styles\n// $orbit-timer-bg: rgba(255,255,255,0.3);\n// $orbit-timer-show-progress-bar: true;\n\n// We use these to control the bullet nav styles\n// $orbit-bullet-nav-color: $iron;\n// $orbit-bullet-nav-color-active: $aluminum;\n// $orbit-bullet-radius: rem-calc(9);\n\n// We use these to controls the style of slide numbers\n// $orbit-slide-number-bg: rgba(0,0,0,0);\n// $orbit-slide-number-font-color: $white;\n// $orbit-slide-number-padding: rem-calc(5);\n\n// Hide controls on small\n// $orbit-nav-hide-for-small: true;\n// $orbit-bullet-hide-for-small: true;\n// $orbit-timer-hide-for-small: true;\n\n// Graceful Loading Wrapper and preloader\n// $wrapper-class: \"slideshow-wrapper\";\n// $preloader-class: \"preloader\";\n\n// 20. Pagination\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-pagination-classes: $include-html-classes;\n\n// We use these to control the pagination container\n// $pagination-height: rem-calc(24);\n// $pagination-margin: rem-calc(-5);\n\n// We use these to set the list-item properties\n// $pagination-li-float: $default-float;\n// $pagination-li-height: rem-calc(24);\n// $pagination-li-font-color: $jet;\n// $pagination-li-font-size: rem-calc(14);\n// $pagination-li-margin: rem-calc(5);\n\n// We use these for the pagination anchor links\n// $pagination-link-pad: rem-calc(1 10 1);\n// $pagination-link-font-color: $aluminum;\n// $pagination-link-active-bg: scale-color($white, $lightness: -10%);\n\n// We use these for disabled anchor links\n// $pagination-link-unavailable-cursor: default;\n// $pagination-link-unavailable-font-color: $aluminum;\n// $pagination-link-unavailable-bg-active: transparent;\n\n// We use these for currently selected anchor links\n// $pagination-link-current-background: $primary-color;\n// $pagination-link-current-font-color: $white;\n// $pagination-link-current-font-weight: $font-weight-bold;\n// $pagination-link-current-cursor: default;\n// $pagination-link-current-active-bg: $primary-color;\n\n// 21. Panels\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-panel-classes: $include-html-classes;\n\n// We use these to control the background and border styles\n$panel-bg: $grey-1;\n// $panel-border-style: solid;\n// $panel-border-size: 1px;\n\n// We use this % to control how much we darken things on hover\n// $panel-function-factor: -11%;\n// $panel-border-color: scale-color($panel-bg, $lightness: $panel-function-factor);\n\n// We use these to set default inner padding and bottom margin\n// $panel-margin-bottom: rem-calc(20);\n// $panel-padding: rem-calc(20);\n\n// We use these to set default font colors\n// $panel-font-color: $oil;\n// $panel-font-color-alt: $white;\n\n// $panel-header-adjust: true;\n// $callout-panel-link-color: $primary-color;\n\n// 22. Pricing Tables\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-pricing-classes: $include-html-classes;\n\n// We use this to control the border color\n// $price-table-border: solid 1px $gainsboro;\n\n// We use this to control the bottom margin of the pricing table\n// $price-table-margin-bottom: rem-calc(20);\n\n// We use these to control the title styles\n// $price-title-bg: $oil;\n// $price-title-padding: rem-calc(15 20);\n// $price-title-align: center;\n// $price-title-color: $smoke;\n// $price-title-weight: $font-weight-normal;\n// $price-title-size: rem-calc(16);\n// $price-title-font-family: $body-font-family;\n\n// We use these to control the price styles\n// $price-money-bg: $vapor  ;\n// $price-money-padding: rem-calc(15 20);\n// $price-money-align: center;\n// $price-money-color: $oil;\n// $price-money-weight: $font-weight-normal;\n// $price-money-size: rem-calc(32);\n// $price-money-font-family: $body-font-family;\n\n// We use these to control the description styles\n// $price-bg: $white;\n// $price-desc-color: $monsoon;\n// $price-desc-padding: rem-calc(15);\n// $price-desc-align: center;\n// $price-desc-font-size: rem-calc(12);\n// $price-desc-weight: $font-weight-normal;\n// $price-desc-line-height: 1.4;\n// $price-desc-bottom-border: dotted 1px $gainsboro;\n\n// We use these to control the list item styles\n// $price-item-color: $oil;\n// $price-item-padding: rem-calc(15);\n// $price-item-align: center;\n// $price-item-font-size: rem-calc(14);\n// $price-item-weight: $font-weight-normal;\n// $price-item-bottom-border: dotted 1px $gainsboro;\n\n// We use these to control the CTA area styles\n// $price-cta-bg: $white;\n// $price-cta-align: center;\n// $price-cta-padding: rem-calc(20 20 0);\n\n// 23. Progress Bar\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-media-classes: $include-html-classes;\n\n// We use this to set the progress bar height\n// $progress-bar-height: rem-calc(25);\n// $progress-bar-color: $vapor  ;\n\n// We use these to control the border styles\n// $progress-bar-border-color: scale-color($white, $lightness: 20%);\n// $progress-bar-border-size: 1px;\n// $progress-bar-border-style: solid;\n// $progress-bar-border-radius: $global-radius;\n\n// We use these to control the margin & padding\n// $progress-bar-pad: rem-calc(2);\n// $progress-bar-margin-bottom: rem-calc(10);\n\n// We use these to set the meter colors\n// $progress-meter-color: $primary-color;\n// $progress-meter-secondary-color: $secondary-color;\n// $progress-meter-success-color: $success-color;\n// $progress-meter-alert-color: $alert-color;\n\n// 24. Range Slider\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-range-slider-classes: $include-html-classes;\n\n// These variables define the slider bar styles\n// $range-slider-bar-width: 100%;\n// $range-slider-bar-height: rem-calc(16);\n\n// $range-slider-bar-border-width: 1px;\n// $range-slider-bar-border-style: solid;\n// $range-slider-bar-border-color: $gainsboro;\n// $range-slider-radius: $global-radius;\n// $range-slider-round: $global-rounded;\n// $range-slider-bar-bg-color: $ghost;\n\n// Vertical bar styles\n// $range-slider-vertical-bar-width: rem-calc(16);\n// $range-slider-vertical-bar-height: rem-calc(200);\n\n// These variables define the slider handle styles\n// $range-slider-handle-width: rem-calc(32);\n// $range-slider-handle-height: rem-calc(22);\n// $range-slider-handle-position-top: rem-calc(-5);\n// $range-slider-handle-bg-color: $primary-color;\n// $range-slider-handle-border-width: 1px;\n// $range-slider-handle-border-style: solid;\n// $range-slider-handle-border-color: none;\n// $range-slider-handle-radius: $global-radius;\n// $range-slider-handle-round: $global-rounded;\n// $range-slider-handle-bg-hover-color: scale-color($primary-color, $lightness: -12%);\n// $range-slider-handle-cursor: pointer;\n\n// 25. Reveal\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-reveal-classes: $include-html-classes;\n\n// We use these to control the style of the reveal overlay.\n// $reveal-overlay-bg: rgba($black, .45);\n// $reveal-overlay-bg-old: $black;\n\n// We use these to control the style of the modal itself.\n// $reveal-modal-bg: $white;\n// $reveal-position-top: rem-calc(100);\n// $reveal-default-width: 80%;\n// $reveal-max-width: $row-width;\n// $reveal-modal-padding: rem-calc(20);\n// $reveal-box-shadow: 0 0 10px rgba($black,.4);\n\n// We use these to style the reveal close button\n// $reveal-close-font-size: rem-calc(40);\n// $reveal-close-top: rem-calc(8);\n// $reveal-close-side: rem-calc(11);\n// $reveal-close-color: $base;\n// $reveal-close-weight: $font-weight-bold;\n\n// We use this to set the default radius used throughout the core.\n// $reveal-radius: $global-radius;\n// $reveal-round: $global-rounded;\n\n// We use these to control the modal border\n// $reveal-border-style: solid;\n// $reveal-border-width: 1px;\n// $reveal-border-color: $steel;\n\n// $reveal-modal-class: \"reveal-modal\";\n// $close-reveal-modal-class: \"close-reveal-modal\";\n\n// 26. Side Nav\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-nav-classes: $include-html-classes;\n\n// We use this to control padding.\n$side-nav-padding: rem-calc(0 0 0 0);\n\n// We use these to control list styles.\n// $side-nav-list-type: none;\n// $side-nav-list-position: inside;\n$side-nav-list-margin: rem-calc(0 0 0 0);\n\n// We use these to control link styles.\n$side-nav-link-color: $primary-color;\n$side-nav-link-color-active: scale-color($side-nav-link-color, $lightness: -40%);\n$side-nav-link-color-hover: scale-color($side-nav-link-color, $lightness: -40%);\n$side-nav-font-size: rem-calc(16);\n\n// $side-nav-link-bg-hover: hsla(0, 0, 0, 0.025);\n// $side-nav-link-margin: 0;\n// $side-nav-link-padding: rem-calc(7 14);\n// $side-nav-font-size: rem-calc(14);\n// $side-nav-font-weight: $font-weight-normal;\n// $side-nav-font-weight-active: $side-nav-font-weight;\n// $side-nav-font-family: $body-font-family;\n// $side-nav-font-family-active: $side-nav-font-family;\n\n// We use these to control heading styles.\n// $side-nav-heading-color: $side-nav-link-color;\n// $side-nav-heading-font-size: $side-nav-font-size;\n// $side-nav-heading-font-weight: bold;\n// $side-nav-heading-text-transform: uppercase;\n\n// We use these to control border styles\n$side-nav-divider-size: 1px;\n$side-nav-divider-style: solid;\n$side-nav-divider-color: $grey-1;\n\n\n\n// 27. Split Buttons\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-button-classes: $include-html-classes;\n\n// We use these to control different shared styles for Split Buttons\n// $split-button-function-factor: 10%;\n// $split-button-pip-color: $white;\n// $split-button-pip-color-alt: $oil;\n// $split-button-active-bg-tint: rgba(0,0,0,0.1);\n\n// We use these to control tiny split buttons\n// $split-button-padding-tny: $button-pip-tny * 10;\n// $split-button-span-width-tny: $button-pip-tny * 6;\n// $split-button-pip-size-tny: $button-pip-tny;\n// $split-button-pip-top-tny: $button-pip-tny * 2;\n// $split-button-pip-default-float-tny: rem-calc(-6);\n\n// We use these to control small split buttons\n// $split-button-padding-sml: $button-pip-sml * 10;\n// $split-button-span-width-sml: $button-pip-sml * 6;\n// $split-button-pip-size-sml: $button-pip-sml;\n// $split-button-pip-top-sml: $button-pip-sml * 1.5;\n// $split-button-pip-default-float-sml: rem-calc(-6);\n\n// We use these to control medium split buttons\n// $split-button-padding-med: $button-pip-med * 9;\n// $split-button-span-width-med: $button-pip-med * 5.5;\n// $split-button-pip-size-med: $button-pip-med - rem-calc(3);\n// $split-button-pip-top-med: $button-pip-med * 1.5;\n// $split-button-pip-default-float-med: rem-calc(-6);\n\n// We use these to control large split buttons\n// $split-button-padding-lrg: $button-pip-lrg * 8;\n// $split-button-span-width-lrg: $button-pip-lrg * 5;\n// $split-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);\n// $split-button-pip-top-lrg: $button-pip-lrg + rem-calc(5);\n// $split-button-pip-default-float-lrg: rem-calc(-6);\n\n// 28. Sub Nav\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-nav-classes: $include-html-classes;\n\n// We use these to control margin and padding\n// $sub-nav-list-margin: rem-calc(-4 0 18);\n// $sub-nav-list-padding-top: rem-calc(4);\n\n// We use this to control the definition\n// $sub-nav-font-family: $body-font-family;\n// $sub-nav-font-size: rem-calc(14);\n// $sub-nav-font-color: $aluminum;\n// $sub-nav-font-weight: $font-weight-normal;\n// $sub-nav-text-decoration: none;\n// $sub-nav-padding: rem-calc(3 16);\n// $sub-nav-border-radius: 3px;\n// $sub-nav-font-color-hover: scale-color($sub-nav-font-color, $lightness: -25%);\n\n// We use these to control the active item styles\n// $sub-nav-active-font-weight: $font-weight-normal;\n// $sub-nav-active-bg: $primary-color;\n// $sub-nav-active-bg-hover: scale-color($sub-nav-active-bg, $lightness: -14%);\n// $sub-nav-active-color: $white;\n// $sub-nav-active-padding: $sub-nav-padding;\n// $sub-nav-active-cursor: default;\n\n// $sub-nav-item-divider: \"\";\n// $sub-nav-item-divider-margin: rem-calc(12);\n\n// 29. Switch\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-form-classes: $include-html-classes;\n\n// Controlling border styles and background colors for the switch container\n// $switch-border-color: scale-color($white, $lightness: -20%);\n// $switch-border-style: solid;\n// $switch-border-width: 1px;\n// $switch-bg: $white;\n\n// We use these to control the switch heights for our default classes\n// $switch-height-tny: rem-calc(22);\n// $switch-height-sml: rem-calc(28);\n// $switch-height-med: rem-calc(36);\n// $switch-height-lrg: rem-calc(44);\n// $switch-bottom-margin: rem-calc(20);\n\n// We use these to control default font sizes for our classes.\n// $switch-font-size-tny: 11px;\n// $switch-font-size-sml: 12px;\n// $switch-font-size-med: 14px;\n// $switch-font-size-lrg: 17px;\n// $switch-label-side-padding: 6px;\n\n// We use these to style the switch-paddle\n// $switch-paddle-bg: $white;\n// $switch-paddle-fade-to-color: scale-color($switch-paddle-bg, $lightness: -10%);\n// $switch-paddle-border-color: scale-color($switch-paddle-bg, $lightness: -35%);\n// $switch-paddle-border-width: 1px;\n// $switch-paddle-border-style: solid;\n// $switch-paddle-transition-speed: .1s;\n// $switch-paddle-transition-ease: ease-out;\n// $switch-positive-color: scale-color($success-color, $lightness: 94%);\n// $switch-negative-color: $white-smoke;\n\n// Outline Style for tabbing through switches\n// $switch-label-outline: 1px dotted $jumbo;\n\n// 30. Tables\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-table-classes: $include-html-classes;\n\n// These control the background color for the table and even rows\n// $table-bg: $white;\n$table-even-row-bg: $grey-1;\n\n// These control the table cell border style\n// $table-border-style: solid;\n// $table-border-size: 1px;\n// $table-border-color: $gainsboro;\n\n// These control the table head styles\n$table-head-bg: $grey-2;\n// $table-head-font-size: rem-calc(14);\n// $table-head-font-color: $jet;\n// $table-head-font-weight: $font-weight-bold;\n// $table-head-padding: rem-calc(8 10 10);\n\n// These control the row padding and font styles\n// $table-row-padding: rem-calc(9 10);\n// $table-row-font-size: rem-calc(14);\n// $table-row-font-color: $jet;\n// $table-line-height: rem-calc(18);\n\n// These are for controlling the layout, display and margin of tables\n// $table-layout: auto;\n// $table-display: table-cell;\n// $table-margin-bottom: rem-calc(20);\n\n// 31. Tabs\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-tabs-classes: $include-html-classes;\n\n// $tabs-navigation-padding: rem-calc(16);\n// $tabs-navigation-bg-color: $silver  ;\n// $tabs-navigation-active-bg-color: $white;\n// $tabs-navigation-hover-bg-color: scale-color($tabs-navigation-bg-color, $lightness: -6%);\n// $tabs-navigation-font-color: $jet;\n// $tabs-navigation-active-font-color: $tabs-navigation-font-color;\n// $tabs-navigation-font-size: rem-calc(16);\n// $tabs-navigation-font-family: $body-font-family;\n\n// $tabs-content-margin-bottom: rem-calc(24);\n// $tabs-content-padding: $column-gutter/2;\n\n// $tabs-vertical-navigation-margin-bottom: 1.25rem;\n\n// 32. Thumbnails\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-media-classes: $include-html-classes;\n\n// We use these to control border styles\n// $thumb-border-style: solid;\n// $thumb-border-width: 4px;\n// $thumb-border-color: $white;\n// $thumb-box-shadow: 0 0 0 1px rgba($black,.2);\n// $thumb-box-shadow-hover: 0 0 6px 1px rgba($primary-color,0.5);\n\n// Radius and transition speed for thumbs\n// $thumb-radius: $global-radius;\n// $thumb-transition-speed: 200ms;\n\n// 33. Tooltips\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-tooltip-classes: $include-html-classes;\n\n// $has-tip-border-bottom: dotted 1px $iron;\n// $has-tip-font-weight: $font-weight-bold;\n// $has-tip-font-color: $oil;\n// $has-tip-border-bottom-hover: dotted 1px scale-color($primary-color, $lightness: -55%);\n// $has-tip-font-color-hover: $primary-color;\n// $has-tip-cursor-type: help;\n\n// $tooltip-padding: rem-calc(12);\n// $tooltip-bg: $oil;\n// $tooltip-font-size: rem-calc(14);\n// $tooltip-font-weight: $font-weight-normal;\n// $tooltip-font-color: $white;\n// $tooltip-line-height: 1.3;\n// $tooltip-close-font-size: rem-calc(10);\n// $tooltip-close-font-weight: $font-weight-normal;\n// $tooltip-close-font-color: $monsoon;\n// $tooltip-font-size-sml: rem-calc(14);\n// $tooltip-radius: $global-radius;\n// $tooltip-rounded: $global-rounded;\n// $tooltip-pip-size: 5px;\n// $tooltip-max-width: 300px;\n\n// 34. Top Bar\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-top-bar-classes: $include-html-classes;\n\n// Background color for the top bar\n$topbar-bg-color: #fff;\n$topbar-bg: $topbar-bg-color;\n\n// Height and margin\n$topbar-height: rem-calc(50);\n// $topbar-margin-bottom: 0;\n\n// Controlling the styles for the title in the top bar\n$topbar-title-weight: $font-weight-bold;\n$topbar-title-font-size: rem-calc(19);\n\n// Style the top bar dropdown elements\n// $topbar-dropdown-bg: $oil;\n// $topbar-dropdown-link-color: $white;\n// $topbar-dropdown-link-bg: $ci-2;\n// $topbar-dropdown-link-weight: $font-weight-normal;\n// $topbar-dropdown-toggle-size: 5px;\n// $topbar-dropdown-toggle-color: $ci-2;\n// $topbar-dropdown-toggle-alpha: 0.4;\n\n// Set the link colors and styles for top-level nav\n// $topbar-link-color: #000;\n// $topbar-link-color-hover: #000;\n// $topbar-link-color-active: #000;\n// $topbar-link-color-active-hover: #000;\n// $topbar-link-weight: $font-weight-normal;\n$topbar-link-font-size: rem-calc(15);\n// $topbar-link-hover-lightness: -10%; // Darken by 10%\n// $topbar-link-bg: $topbar-bg;\n// $topbar-link-bg-color-hover: #ff0;\n// $topbar-link-bg-hover: #f00;\n// $topbar-link-bg-active: $primary-color;\n// $topbar-link-bg-active-hover: scale-color($primary-color, $lightness: -14%);\n// $topbar-link-font-family: $body-font-family;\n$topbar-link-text-transform: uppercase;\n// $topbar-link-padding: $topbar-height / 3;\n// $topbar-back-link-size: $h5-font-size;\n// $topbar-link-dropdown-padding: 20px;\n\n// $topbar-button-font-size: 0.75rem;\n// $topbar-button-top: 7px;\n\n// $topbar-dropdown-label-color: #f77;\n// $topbar-dropdown-label-text-transform: uppercase;\n// $topbar-dropdown-label-font-weight: $font-weight-bold;\n// $topbar-dropdown-label-font-size: rem-calc(10);\n// $topbar-dropdown-label-bg: $oil;\n\n// Top menu icon styles\n$topbar-menu-link-transform: uppercase;\n// $topbar-menu-link-font-size: rem-calc(13);\n// $topbar-menu-link-weight: $font-weight-bold;\n// $topbar-menu-link-color: $white;\n// $topbar-menu-icon-color: $white;\n// $topbar-menu-link-color-toggled: $ci-6;\n// $topbar-menu-icon-color-toggled: $ci-6;\n\n// Transitions and breakpoint styles\n// $topbar-transition-speed: 300ms;\n// Using rem-calc for the below breakpoint causes issues with top bar\n$topbar-breakpoint: #{lower-bound($large-range)}; // Change to 9999px for always mobile layout\n$topbar-media-query: \"only screen and (min-width: #{$topbar-breakpoint})\" !default;\n\n// Divider Styles\n$topbar-divider-border-bottom: solid 0px scale-color($topbar-bg-color, $lightness: 23%);\n$topbar-divider-border-top: solid 0px scale-color($topbar-bg-color, $lightness: -50%);\n\n// Sticky Class\n// $topbar-sticky-class: \".sticky\";\n// $topbar-arrows: true; //Set false to remove the triangle icon from the menu item\n\n// 36. Visibility Classes\n// - - - - - - - - - - - - - - - - - - - - - - - - -\n\n// $include-html-visibility-classes: $include-html-classes;\n// $include-table-visibility-classes: true;\n// $include-legacy-visibility-classes: true;\n// $include-accessibility-classes: true;\n"
	],
	"names": [],
	"mappings": "AGsDA,AAAA,aAAa,AAAG,CAAE,SAAS,CAPP,OAAO,CAOmB,AAC9C,AAAA,aAAa,AAAG,CAAE,SAAS,CAPP,OAAO,CAOmB,AAC9C,AAAA,aAAa,AAAG,CAAE,SAAS,CAPP,OAAO,CAOmB,AAC9C,AAAA,aAAa,AAAG,CAAE,SAAS,CAPP,MAAM,CAOoB,AAC9C,AAAA,aAAa,AAAG,CAAE,SAAS,CAPP,OAAO,CAOmB,ACgP5C,AAAA,IAAI,AAAA,mBAAmB,AAAC,CACtB,WAAW,CAAE,SAAS,CACvB,AAED,AAAA,IAAI,AAAA,oBAAoB,AAAC,CACvB,WAAW,CAAE,eAA8B,CAC3C,KAAK,CArDM,GAAG,CAsDf,AAED,AAAA,IAAI,AAAA,yBAAyB,AAAC,CAC5B,WAAW,CAAE,qCAAgC,CAC7C,KAAK,CA1DM,GAAG,CA2Df,AAED,AAAA,IAAI,AAAA,qBAAqB,AAAC,CACxB,WAAW,CAAE,wCAA+B,CAC5C,KAAK,CA9DO,QAAQ,CA+DrB,AAED,AAAA,IAAI,AAAA,0BAA0B,AAAC,CAC7B,WAAW,CAAE,6DAAiC,CAC9C,KAAK,CAnEO,QAAQ,CAoErB,AAED,AAAA,IAAI,AAAA,oBAAoB,AAAC,CACvB,WAAW,CAAE,wCAA8B,CAC3C,KAAK,CAvEM,QAAQ,CAwEpB,AAED,AAAA,IAAI,AAAA,yBAAyB,AAAC,CAC5B,WAAW,CAAE,6DAAgC,CAC7C,KAAK,CA5EM,QAAQ,CA6EpB,AAED,AAAA,IAAI,AAAA,qBAAqB,AAAC,CACxB,WAAW,CAAE,wCAA+B,CAC5C,KAAK,CAhFO,QAAQ,CAiFrB,AAED,AAAA,IAAI,AAAA,0BAA0B,AAAC,CAC7B,WAAW,CAAE,8DAAiC,CAC9C,KAAK,CArFO,QAAQ,CAsFrB,AAED,AAAA,IAAI,AAAA,sBAAsB,AAAC,CACzB,WAAW,CAAE,yCAAgC,CAC7C,KAAK,CAzFQ,SAAS,CA0FvB,AAED,AAAA,IAAI,AAAA,oCAAoC,AAAC,CACvC,WAAW,CAAC,KAAC,CACd,AJnVH,AAAA,CAAC,AAAC,CACD,OAAO,CAAE,KAAK,CACd,CAEA,AAAD,IAAK,AAAC,CACL,MAAM,CAAE,GAAG,CACX,UAAU,CEGS,OAAO,CFF1B,KAAK,CEAc,OAAO,CFC1B,WAAW,CGKa,MAAM,CAAE,gBAAgB,CAAE,SAAS,CAAE,KAAK,CAAE,UAAU,CHJ9E,AAED,AACC,IADG,CACD,KAAK,AAAC,CACP,UAAU,CAAE,MAAM,CAClB,KAAK,CEGA,OAAkB,CFFvB,WAAW,CGFY,MAAM,CAAE,gBAAgB,CAAE,SAAS,CAAE,KAAK,CAAE,UAAU,CHG7E,SAAS,CAAE,QAAmB,CAC9B,WAAW,CAAE,MAAM,CAenB,AArBF,AAOE,IAPE,CACD,KAAK,EAMH,MAAM,AAAC,CACT,OAAO,CAAE,gBAAgB,CACzB,WAAW,CAAE,OAAO,CACpB,AAVH,AAWE,IAXE,CACD,KAAK,EAUH,KAAK,AAAC,CACR,OAAO,CAAE,6EAA6E,CACtF,OAAO,CAAE,KAAK,CACd,OAAO,CAAE,GAAG,CACZ,gBAAgB,CETZ,OAAkB,CFUtB,KAAK,CAAE,IAAI,CACX,WAAW,CAAE,OAAO,CACpB,SAAS,CAAE,OAAO,CAClB,cAAc,CAAE,OAAO,CACvB,AApBH,AAuBC,IAvBG,CAuBD,EAAE,CAvBL,IAAI,CAwBD,OAAO,CAxBV,IAAI,CAyBD,QAAQ,CAzBX,IAAI,CA0BD,MAAM,CA1BT,IAAI,CA2BD,IAAI,CA3BP,IAAI,CA4BD,SAAS,AAAC,CACX,OAAO,CAAE,IAAI,CACb,AAGF,AAAA,KAAK,AAAC,CACL,OAAO,CAAE,KAAK,CACd,aAAa,CAAE,GAAG,CAAC,KAAK,CAAC,OAAgB,CAiCzC,AAnCD,AAGC,KAHI,CAGF,UAAU,AAAC,CACZ,aAAa,CAAE,IAAI,CACnB,AALF,AAOC,KAPI,CAOF,KAAK,AAAC,CACP,KAAK,CEnCA,OAAkB,CFoCvB,WAAW,CGxCY,MAAM,CAAE,gBAAgB,CAAE,SAAS,CAAE,KAAK,CAAE,UAAU,CHyC7E,SAAS,CGjBS,OAAO,CHkBzB,aAAa,CAAE,KAAK,CACpB,AAZF,AAcC,KAdI,CAcF,IAAI,EAAE,KAAK,AAAC,CACb,OAAO,CAAE,UAAU,CACnB,KAAK,CE3CA,OAAkB,CF4CvB,AAjBF,AAmBC,KAnBI,CAmBF,OAAO,AAAC,CACT,KAAK,CEHE,OAAO,CFId,SAAS,CAAE,KAAK,CAChB,AAtBF,AAwBC,KAxBI,CAwBF,OAAO,AAAC,CACT,UAAU,CAAE,GAAG,CACf,AA1BF,AA4BC,KA5BI,CA4BF,EAAE,CA5BL,KAAK,CA6BF,MAAM,CA7BT,KAAK,CA8BF,QAAQ,CA9BX,KAAK,CA+BF,SAAS,CA/BZ,KAAK,CAgCF,OAAO,AAAC,CACT,OAAO,CAAE,IAAI,CACb"
}