` for available grid columns\n/// and spread of the container\n/// - Span-counts like `of 6` are only valid\n/// in the context of symmetrical grids\n/// - Valid spreads include `narrow`, `wide`, or `wider`\n///\n/// @param {map} $config [()] -\n/// Optional map of Susy grid configuration settings.\n/// See `$susy` documentation for details.\n///\n/// @return {list} -\n/// Subset list of columns for use for a nested context\n///\n/// @example scss - Return a nested segment of asymmetrical grid\n/// $context: susy-slice(3 at 3 of (1 2 3 5 8));\n/// /* $context: #{$context}; */\n@function susy-slice(\n $span,\n $config: ()\n) {\n $span: susy-compile($span, $config);\n\n @return su-call('su-slice', $span);\n}\n\n\n\n/// ## Building Grids\n/// The web has come a long way\n/// since the days of double-margin-hacks\n/// and inconsistent subpixel rounding.\n/// In addition to floats and tables,\n/// we can now use much more powerful tools,\n/// like flexbox and CSS grid,\n/// to build more interesting and responsive layouts.\n///\n/// With Susy3, we hope you'll start moving in that direction.\n/// You can still build classic 12-column Grid Systems,\n/// and we'll help you get there,\n/// but Susy3 is primarily designed for a grid-math-on-demand\n/// approach to layout:\n/// applying our functions only where you really need grid math.\n/// Read the [intro article by OddBird][welcome] for more details.\n///\n/// [welcome]: http://oddbird.net/2017/06/28/susy3/\n///\n/// @group b-api\n/// @link http://oddbird.net/2017/06/28/susy3/ Article: Welcome to Susy3\n///\n/// @example scss - floats\n/// .float {\n/// width: span(3);\n/// margin-right: gutter();\n/// }\n///\n/// @example scss - flexbox\n/// .flexbox {\n/// flex: 1 1 span(3);\n/// // half a gutter on either side…\n/// padding: 0 gutter() / 2;\n/// }\n///\n/// @example scss - pushing and pulling\n/// .push-3 {\n/// margin-left: span(3 wide);\n/// }\n///\n/// .pull-3 {\n/// margin-left: 0 - span(3 wide);\n/// }\n///\n/// @example scss - building an attribute system\n/// // markup example:
\n/// [data-span] {\n/// float: left;\n///\n/// &:not([data-span*='last']) {\n/// margin-right: gutter();\n/// }\n/// }\n///\n/// @for $span from 1 through length(susy-get('columns')) {\n/// [data-span*='#{$span}'] {\n/// width: span($span);\n/// }\n/// }\n",
+ "// Unprefix Susy\n// =============\n\n\n// Span\n// ----\n/// Un-prefixed alias for `susy-span`\n/// (available by default)\n///\n/// @group api\n/// @alias susy-span\n///\n/// @param {list} $span\n/// @param {map} $config [()]\n@function span(\n $span,\n $config: ()\n) {\n @return susy-span($span, $config);\n}\n\n\n// Gutter\n// ------\n/// Un-prefixed alias for `susy-gutter`\n/// (available by default)\n///\n/// @group api\n/// @alias susy-gutter\n///\n/// @param {integer | list} $context [null] -\n/// @param {map} $config [()]\n@function gutter(\n $context: susy-get('columns'),\n $config: ()\n) {\n @return susy-gutter($context, $config);\n}\n\n\n// Slice\n// -----\n/// Un-prefixed alias for `susy-slice`\n/// (available by default)\n///\n/// @group api\n/// @alias susy-slice\n///\n/// @param {list} $span\n/// @param {map} $config [()]\n@function slice(\n $span,\n $config: ()\n) {\n @return susy-slice($span, $config);\n}\n",
+ "/* ==========================================================================\n MIXINS\n ========================================================================== */\n\n%tab-focus {\n /* Default*/\n outline: thin dotted $focus-color;\n /* Webkit*/\n outline: 5px auto $focus-color;\n outline-offset: -2px;\n}\n\n/*\n em function\n ========================================================================== */\n\n@function em($target, $context: $doc-font-size) {\n @return ($target / $context) * 1em;\n}\n\n\n/*\n Bourbon clearfix\n ========================================================================== */\n\n/*\n * Provides an easy way to include a clearfix for containing floats.\n * link http://cssmojo.com/latest_new_clearfix_so_far/\n *\n * example scss - Usage\n *\n * .element {\n * @include clearfix;\n * }\n *\n * example css - CSS Output\n *\n * .element::after {\n * clear: both;\n * content: \"\";\n * display: table;\n * }\n*/\n\n@mixin clearfix {\n clear: both;\n\n &::after {\n clear: both;\n content: \"\";\n display: table;\n }\n}\n\n/*\n Compass YIQ Color Contrast\n https://github.com/easy-designs/yiq-color-contrast\n ========================================================================== */\n\n@function yiq-is-light(\n $color,\n $threshold: $yiq-contrasted-threshold\n) {\n $red: red($color);\n $green: green($color);\n $blue: blue($color);\n\n $yiq: (($red*299)+($green*587)+($blue*114))/1000;\n\n @if $yiq-debug { @debug $yiq, $threshold; }\n\n @return if($yiq >= $threshold, true, false);\n}\n\n@function yiq-contrast-color(\n $color,\n $dark: $yiq-contrasted-dark-default,\n $light: $yiq-contrasted-light-default,\n $threshold: $yiq-contrasted-threshold\n) {\n @return if(yiq-is-light($color, $threshold), $yiq-contrasted-dark-default, $yiq-contrasted-light-default);\n}\n\n@mixin yiq-contrasted(\n $background-color,\n $dark: $yiq-contrasted-dark-default,\n $light: $yiq-contrasted-light-default,\n $threshold: $yiq-contrasted-threshold\n) {\n background-color: $background-color;\n color: yiq-contrast-color($background-color, $dark, $light, $threshold);\n}",
+ "/* ==========================================================================\n STYLE RESETS\n ========================================================================== */\n\n* { box-sizing: border-box; }\n\nhtml {\n /* apply a natural box layout model to all elements */\n box-sizing: border-box;\n background-color: $background-color;\n font-size: 16px;\n\n @include breakpoint($medium) {\n font-size: 18px;\n }\n\n @include breakpoint($large) {\n font-size: 20px;\n }\n\n @include breakpoint($x-large) {\n font-size: 22px;\n }\n\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n}\n\n/* Remove margin */\n\nbody { margin: 0; }\n\n/* Selected elements */\n\n::-moz-selection {\n color: #fff;\n background: #000;\n}\n\n::selection {\n color: #fff;\n background: #000;\n}\n\n/* Display HTML5 elements in IE6-9 and FF3 */\n\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nnav,\nsection {\n display: block;\n}\n\n/* Display block in IE6-9 and FF3 */\n\naudio,\ncanvas,\nvideo {\n display: inline-block;\n *display: inline;\n *zoom: 1;\n}\n\n/* Prevents modern browsers from displaying 'audio' without controls */\n\naudio:not([controls]) {\n display: none;\n}\n\na {\n color: $link-color;\n}\n\n/* Apply focus state */\n\na:focus {\n @extend %tab-focus;\n}\n\n/* Remove outline from links */\n\na:hover,\na:active {\n outline: 0;\n}\n\n/* Prevent sub and sup affecting line-height in all browsers */\n\nsub,\nsup {\n position: relative;\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}\n\nsup {\n top: -0.5em;\n}\n\nsub {\n bottom: -0.25em;\n}\n\n/* img border in anchor's and image quality */\n\nimg {\n /* Responsive images (ensure images don't scale beyond their parents) */\n max-width: 100%; /* part 1: Set a maximum relative to the parent*/\n width: auto\\9; /* IE7-8 need help adjusting responsive images*/\n height: auto; /* part 2: Scale the height according to the width, otherwise you get stretching*/\n\n vertical-align: middle;\n border: 0;\n -ms-interpolation-mode: bicubic;\n}\n\n/* Prevent max-width from affecting Google Maps */\n\n#map_canvas img,\n.google-maps img {\n max-width: none;\n}\n\n/* Consistent form font size in all browsers, margin changes, misc */\n\nbutton,\ninput,\nselect,\ntextarea {\n margin: 0;\n font-size: 100%;\n vertical-align: middle;\n}\n\nbutton,\ninput {\n *overflow: visible; /* inner spacing ie IE6/7*/\n line-height: normal; /* FF3/4 have !important on line-height in UA stylesheet*/\n}\n\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner { /* inner padding and border oddities in FF3/4*/\n padding: 0;\n border: 0;\n}\n\nbutton,\nhtml input[type=\"button\"], // avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n -webkit-appearance: button; /* corrects inability to style clickable `input` types in iOS*/\n cursor: pointer; /* improves usability and consistency of cursor style between image-type `input` and others*/\n}\n\nlabel,\nselect,\nbutton,\ninput[type=\"button\"],\ninput[type=\"reset\"],\ninput[type=\"submit\"],\ninput[type=\"radio\"],\ninput[type=\"checkbox\"] {\n cursor: pointer; /* improves usability and consistency of cursor style between image-type `input` and others*/\n}\n\ninput[type=\"search\"] { /* Appearance in Safari/Chrome*/\n box-sizing: border-box;\n -webkit-appearance: textfield;\n}\n\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-cancel-button {\n -webkit-appearance: none; /* inner-padding issues in Chrome OSX, Safari 5*/\n}\n\ntextarea {\n overflow: auto; /* remove vertical scrollbar in IE6-9*/\n vertical-align: top; /* readability and alignment cross-browser*/\n}",
+ "/* ==========================================================================\n BASE ELEMENTS\n ========================================================================== */\n\nhtml {\n /* sticky footer fix */\n position: relative;\n min-height: 100%;\n}\n\nbody {\n margin: 0;\n padding: 0;\n color: $text-color;\n font-family: $global-font-family;\n line-height: 1.5;\n\n &.overflow--hidden {\n /* when primary navigation is visible, the content in the background won't scroll */\n overflow: hidden;\n }\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 2em 0 0.5em;\n line-height: 1.2;\n font-family: $header-font-family;\n font-weight: bold;\n}\n\nh1 {\n margin-top: 0;\n font-size: $h-size-1;\n}\n\nh2 {\n font-size: $h-size-2;\n}\n\nh3 {\n font-size: $h-size-3;\n}\n\nh4 {\n font-size: $h-size-4;\n}\n\nh5 {\n font-size: $h-size-5;\n}\n\nh6 {\n font-size: $h-size-6;\n}\n\nsmall,\n.small {\n font-size: $type-size-6;\n}\n\np {\n margin-bottom: 1.3em;\n}\n\nu,\nins {\n text-decoration: none;\n border-bottom: 1px solid $text-color;\n a {\n color: inherit;\n }\n}\n\ndel a {\n color: inherit;\n}\n\n/* reduce orphans and widows when printing */\n\np,\npre,\nblockquote,\nul,\nol,\ndl,\nfigure,\ntable,\nfieldset {\n orphans: 3;\n widows: 3;\n}\n\n/* abbreviations */\n\nabbr[title],\nabbr[data-original-title] {\n text-decoration: none;\n cursor: help;\n border-bottom: 1px dotted $text-color;\n}\n\n/* blockquotes */\n\nblockquote {\n margin: 2em 1em 2em 0;\n padding-left: 1em;\n padding-right: 1em;\n font-style: italic;\n border-left: 0.25em solid $primary-color;\n\n cite {\n font-style: italic;\n\n &:before {\n content: \"\\2014\";\n padding-right: 5px;\n }\n }\n}\n\n/* links */\n\na {\n &:focus {\n @extend %tab-focus;\n }\n\n &:visited {\n color: $link-color-visited;\n }\n\n &:hover {\n color: $link-color-hover;\n outline: 0;\n }\n}\n\n/* buttons */\n\nbutton:focus {\n @extend %tab-focus;\n}\n\n/* code */\n\ntt,\ncode,\nkbd,\nsamp,\npre {\n font-family: $monospace;\n}\n\npre {\n overflow-x: auto; /* add scrollbars to wide code blocks*/\n}\n\n/* horizontal rule */\n\nhr {\n display: block;\n margin: 1em 0;\n border: 0;\n border-top: 1px solid $border-color;\n}\n\n/* lists */\n\nul li,\nol li {\n margin-bottom: 0.5em;\n}\n\nli ul,\nli ol {\n margin-top: 0.5em;\n}\n\n/*\n Media and embeds\n ========================================================================== */\n\n/* Figures and images */\n\nfigure {\n display: -webkit-box;\n display: flex;\n -webkit-box-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n align-items: flex-start;\n flex-wrap: wrap;\n margin: 2em 0;\n\n img,\n iframe,\n .fluid-width-video-wrapper {\n margin-bottom: 1em;\n }\n\n img {\n width: 100%;\n border-radius: $border-radius;\n -webkit-transition: $global-transition;\n transition: $global-transition;\n }\n\n > a {\n display: block;\n }\n\n &.half {\n > a,\n > img {\n @include breakpoint($small) {\n width: calc(50% - 0.5em);\n }\n }\n\n figcaption {\n width: 100%;\n }\n }\n\n &.third {\n > a,\n > img {\n @include breakpoint($small) {\n width: calc(33.3333% - 0.5em);\n }\n }\n\n figcaption {\n width: 100%;\n }\n }\n}\n\n/* Figure captions */\n\nfigcaption {\n margin-bottom: 0.5em;\n color: $muted-text-color;\n font-family: $caption-font-family;\n font-size: $type-size-6;\n\n a {\n -webkit-transition: $global-transition;\n transition: $global-transition;\n\n &:hover {\n color: $link-color-hover;\n }\n }\n}\n\n/* Fix IE9 SVG bug */\n\nsvg:not(:root) {\n overflow: hidden;\n}\n\n/*\n Navigation lists\n ========================================================================== */\n\n/**\n * Removes margins, padding, and bullet points from navigation lists\n *\n * Example usage:\n * \n * \n * \n */\n\nnav {\n ul {\n margin: 0;\n padding: 0;\n }\n\n li {\n list-style: none;\n }\n\n a {\n text-decoration: none;\n }\n\n /* override white-space for nested lists */\n ul li,\n ol li {\n margin-bottom: 0;\n }\n\n li ul,\n li ol {\n margin-top: 0;\n }\n}\n\n/*\n Global animation transition\n ========================================================================== */\n\nb,\ni,\nstrong,\nem,\nblockquote,\np,\nq,\nspan,\nfigure,\nimg,\nh1,\nh2,\nheader,\ninput,\na,\ntr,\ntd,\nform button,\ninput[type=\"submit\"],\n.btn,\n.highlight,\n.archive__item-teaser {\n -webkit-transition: $global-transition;\n transition: $global-transition;\n}\n",
+ "/* ==========================================================================\n Forms\n ========================================================================== */\n\nform {\n margin: 0 0 5px 0;\n padding: 1em;\n background-color: $form-background-color;\n\n fieldset {\n margin-bottom: 5px;\n padding: 0;\n border-width: 0;\n }\n\n legend {\n display: block;\n width: 100%;\n margin-bottom: 5px * 2;\n *margin-left: -7px;\n padding: 0;\n color: $text-color;\n border: 0;\n white-space: normal;\n }\n\n p {\n margin-bottom: (5px / 2);\n }\n\n ul {\n list-style-type: none;\n margin: 0 0 5px 0;\n padding: 0;\n }\n\n br {\n display: none;\n }\n}\n\nlabel,\ninput,\nbutton,\nselect,\ntextarea {\n vertical-align: baseline;\n *vertical-align: middle;\n}\n\ninput,\nbutton,\nselect,\ntextarea {\n box-sizing: border-box;\n font-family: $sans-serif;\n}\n\nlabel {\n display: block;\n margin-bottom: 0.25em;\n color: $text-color;\n cursor: pointer;\n\n small {\n font-size: $type-size-6;\n }\n\n input,\n textarea,\n select {\n display: block;\n }\n}\n\ninput,\ntextarea,\nselect {\n display: inline-block;\n width: 100%;\n padding: 0.25em;\n margin-bottom: 0.5em;\n color: $text-color;\n background-color: $background-color;\n border: $border-color;\n border-radius: $border-radius;\n box-shadow: $box-shadow;\n}\n\n.input-mini {\n width: 60px;\n}\n\n.input-small {\n width: 90px;\n}\n\ninput[type=\"image\"],\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n width: auto;\n height: auto;\n padding: 0;\n margin: 3px 0;\n *margin-top: 0;\n line-height: normal;\n cursor: pointer;\n border-radius: 0;\n border: 0 \\9;\n box-shadow: none;\n}\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n box-sizing: border-box;\n padding: 0;\n *width: 13px;\n *height: 13px;\n}\n\ninput[type=\"image\"] {\n border: 0;\n}\n\ninput[type=\"file\"] {\n width: auto;\n padding: initial;\n line-height: initial;\n border: initial;\n background-color: transparent;\n background-color: initial;\n box-shadow: none;\n}\n\ninput[type=\"button\"],\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n width: auto;\n height: auto;\n cursor: pointer;\n *overflow: visible;\n}\n\nselect,\ninput[type=\"file\"] {\n *margin-top: 4px;\n}\n\nselect {\n width: auto;\n background-color: #fff;\n}\n\nselect[multiple],\nselect[size] {\n height: auto;\n}\n\ntextarea {\n resize: vertical;\n height: auto;\n overflow: auto;\n vertical-align: top;\n}\n\ninput[type=\"hidden\"] {\n display: none;\n}\n\n.form {\n position: relative;\n}\n\n.radio,\n.checkbox {\n padding-left: 18px;\n font-weight: normal;\n}\n\n.radio input[type=\"radio\"],\n.checkbox input[type=\"checkbox\"] {\n float: left;\n margin-left: -18px;\n}\n\n.radio.inline,\n.checkbox.inline {\n display: inline-block;\n padding-top: 5px;\n margin-bottom: 0;\n vertical-align: middle;\n}\n\n.radio.inline + .radio.inline,\n.checkbox.inline + .checkbox.inline {\n margin-left: 10px;\n}\n\n/*\n Disabled state\n ========================================================================== */\n\ninput[disabled],\nselect[disabled],\ntextarea[disabled],\ninput[readonly],\nselect[readonly],\ntextarea[readonly] {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/*\n Focus & active state\n ========================================================================== */\n\ninput:focus,\ntextarea:focus {\n border-color: $primary-color;\n outline: 0;\n outline: thin dotted \\9;\n box-shadow: inset 0 1px 3px rgba($text-color, 0.06),\n 0 0 5px rgba($primary-color, 0.7);\n}\n\ninput[type=\"file\"]:focus,\ninput[type=\"radio\"]:focus,\ninput[type=\"checkbox\"]:focus,\nselect:focus {\n box-shadow: none;\n}\n\n/*\n Help text\n ========================================================================== */\n\n.help-block,\n.help-inline {\n color: $muted-text-color;\n}\n\n.help-block {\n display: block;\n margin-bottom: 1em;\n line-height: 1em;\n}\n\n.help-inline {\n display: inline-block;\n vertical-align: middle;\n padding-left: 5px;\n}\n\n/*\n .form-group\n ========================================================================== */\n\n.form-group {\n margin-bottom: 5px;\n padding: 0;\n border-width: 0;\n}\n\n/*\n .form-inline\n ========================================================================== */\n\n.form-inline input,\n.form-inline textarea,\n.form-inline select {\n display: inline-block;\n margin-bottom: 0;\n}\n\n.form-inline label {\n display: inline-block;\n}\n\n.form-inline .radio,\n.form-inline .checkbox,\n.form-inline .radio {\n padding-left: 0;\n margin-bottom: 0;\n vertical-align: middle;\n}\n\n.form-inline .radio input[type=\"radio\"],\n.form-inline .checkbox input[type=\"checkbox\"] {\n float: left;\n margin-left: 0;\n margin-right: 3px;\n}\n\n/*\n .form-search\n ========================================================================== */\n\n.form-search input,\n.form-search textarea,\n.form-search select {\n display: inline-block;\n margin-bottom: 0;\n}\n\n.form-search .search-query {\n padding-left: 14px;\n padding-right: 14px;\n margin-bottom: 0;\n border-radius: 14px;\n}\n\n.form-search label {\n display: inline-block;\n}\n\n.form-search .radio,\n.form-search .checkbox,\n.form-inline .radio {\n padding-left: 0;\n margin-bottom: 0;\n vertical-align: middle;\n}\n\n.form-search .radio input[type=\"radio\"],\n.form-search .checkbox input[type=\"checkbox\"] {\n float: left;\n margin-left: 0;\n margin-right: 3px;\n}\n\n/*\n .form--loading\n ========================================================================== */\n\n.form--loading:before {\n content: \"\";\n}\n\n.form--loading .form__spinner {\n display: block;\n}\n\n.form:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(255, 255, 255, 0.7);\n z-index: 10;\n}\n\n.form__spinner {\n display: none;\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: 11;\n}\n",
+ "/* ==========================================================================\n TABLES\n ========================================================================== */\n\ntable {\n display: block;\n margin-bottom: 1em;\n width: 100%;\n font-family: $global-font-family;\n font-size: $type-size-6;\n border-collapse: collapse;\n overflow-x: auto;\n\n & + table {\n margin-top: 1em;\n }\n}\n\nthead {\n background-color: $border-color;\n border-bottom: 2px solid mix(#000, $border-color, 25%);\n}\n\nth {\n padding: 0.5em;\n font-weight: bold;\n text-align: left;\n}\n\ntd {\n padding: 0.5em;\n border-bottom: 1px solid mix(#000, $border-color, 25%);\n}\n\ntr,\ntd,\nth {\n vertical-align: middle;\n}",
+ "/* ==========================================================================\n ANIMATIONS\n ========================================================================== */\n\n@-webkit-keyframes intro {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes intro {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}",
+ "/* ==========================================================================\n BUTTONS\n ========================================================================== */\n\n/*\n Default button\n ========================================================================== */\n\n.btn {\n /* default */\n display: inline-block;\n margin-bottom: 0.25em;\n padding: 0.5em 1em;\n font-family: $sans-serif;\n font-size: $type-size-6;\n font-weight: bold;\n text-align: center;\n text-decoration: none;\n border-width: 0;\n border-radius: $border-radius;\n cursor: pointer;\n\n .icon {\n margin-right: 0.5em;\n }\n\n .icon + .hidden {\n margin-left: -0.5em; /* override for hidden text*/\n }\n\n /* button colors */\n $buttoncolors:\n (primary, $primary-color),\n (inverse, #fff),\n (light-outline, transparent),\n (success, $success-color),\n (warning, $warning-color),\n (danger, $danger-color),\n (info, $info-color),\n (facebook, $facebook-color),\n (twitter, $twitter-color),\n (linkedin, $linkedin-color);\n\n @each $buttoncolor, $color in $buttoncolors {\n &--#{$buttoncolor} {\n @include yiq-contrasted($color);\n @if ($buttoncolor == inverse) {\n border: 1px solid $border-color;\n }\n @if ($buttoncolor == light-outline) {\n border: 1px solid #fff;\n }\n\n &:visited {\n @include yiq-contrasted($color);\n }\n\n &:hover {\n @include yiq-contrasted(mix(#000, $color, 20%));\n }\n }\n }\n\n /* fills width of parent container */\n &--block {\n display: block;\n width: 100%;\n\n + .btn--block {\n margin-top: 0.25em;\n }\n }\n\n /* disabled */\n &--disabled {\n pointer-events: none;\n cursor: not-allowed;\n filter: alpha(opacity=65);\n box-shadow: none;\n opacity: 0.65;\n }\n\n /* extra large button */\n &--x-large {\n font-size: $type-size-4;\n }\n\n /* large button */\n &--large {\n font-size: $type-size-5;\n }\n\n /* small button */\n &--small {\n font-size: $type-size-7;\n }\n}",
+ "/* ==========================================================================\n NOTICE TEXT BLOCKS\n ========================================================================== */\n\n/**\n * Default Kramdown usage (no indents!):\n * \n * #### Headline for the Notice\n * Text for the notice\n *
\n */\n\n@mixin notice($notice-color) {\n margin: 2em 0 !important; /* override*/\n padding: 1em;\n color: $text-color;\n font-family: $global-font-family;\n font-size: $type-size-6 !important;\n text-indent: initial; /* override*/\n background-color: mix($background-color, $notice-color, $notice-background-mix);\n border-radius: $border-radius;\n box-shadow: 0 1px 1px rgba($notice-color, 0.25);\n\n h4 {\n margin-top: 0 !important; /* override*/\n margin-bottom: 0.75em;\n line-height: inherit;\n }\n\n @at-root .page__content #{&} h4 {\n /* using at-root to override .page-content h4 font size*/\n margin-bottom: 0;\n font-size: 1em;\n }\n\n p {\n &:last-child {\n margin-bottom: 0 !important; /* override*/\n }\n }\n\n h4 + p {\n /* remove space above paragraphs that appear directly after notice headline*/\n margin-top: 0;\n padding-top: 0;\n }\n\n a {\n color: mix(#000, $notice-color, 10%);\n\n &:hover {\n color: mix(#000, $notice-color, 50%);\n }\n }\n\n @at-root #{selector-unify(&, \"blockquote\")} {\n border-left-color: mix(#000, $notice-color, 10%);\n }\n\n code {\n background-color: mix($background-color, $notice-color, $code-notice-background-mix)\n }\n\n\tpre code {\n\t\tbackground-color: inherit;\n\t}\n\n ul {\n &:last-child {\n margin-bottom: 0; /* override*/\n }\n }\n}\n\n/* Default notice */\n\n.notice {\n @include notice($light-gray);\n}\n\n/* Primary notice */\n\n.notice--primary {\n @include notice($primary-color);\n}\n\n/* Info notice */\n\n.notice--info {\n @include notice($info-color);\n}\n\n/* Warning notice */\n\n.notice--warning {\n @include notice($warning-color);\n}\n\n/* Success notice */\n\n.notice--success {\n @include notice($success-color);\n}\n\n/* Danger notice */\n\n.notice--danger {\n @include notice($danger-color);\n}\n",
+ "/* ==========================================================================\n MASTHEAD\n ========================================================================== */\n\n.masthead {\n position: relative;\n border-bottom: 1px solid $border-color;\n -webkit-animation: $intro-transition;\n animation: $intro-transition;\n -webkit-animation-delay: 0.15s;\n animation-delay: 0.15s;\n z-index: 20;\n\n &__inner-wrap {\n @include clearfix;\n margin-left: auto;\n margin-right: auto;\n padding: 1em;\n max-width: 100%;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n font-family: $sans-serif-narrow;\n\n @include breakpoint($x-large) {\n max-width: $max-width;\n }\n\n nav {\n z-index: 10;\n }\n\n a {\n text-decoration: none;\n }\n }\n}\n\n.site-logo img {\n max-height: 2rem;\n}\n\n.site-title {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-item-align: center;\n align-self: center;\n font-weight: bold;\n // z-index: 20;\n}\n\n.site-subtitle {\n display: block;\n font-size: $type-size-8;\n}\n\n.masthead__menu {\n float: left;\n margin-left: 0;\n margin-right: 0;\n width: 100%;\n clear: both;\n\n .site-nav {\n margin-left: 0;\n\n @include breakpoint($small) {\n float: right;\n }\n }\n\n ul {\n margin: 0;\n padding: 0;\n clear: both;\n list-style-type: none;\n }\n}\n\n.masthead__menu-item {\n display: block;\n list-style-type: none;\n white-space: nowrap;\n\n &--lg {\n padding-right: 2em;\n font-weight: 700;\n }\n}\n",
+ "/* ==========================================================================\n NAVIGATION\n ========================================================================== */\n\n/*\n Breadcrumb navigation links\n ========================================================================== */\n\n.breadcrumbs {\n @include clearfix;\n margin: 0 auto;\n max-width: 100%;\n padding-left: 1em;\n padding-right: 1em;\n font-family: $sans-serif;\n -webkit-animation: $intro-transition;\n animation: $intro-transition;\n -webkit-animation-delay: 0.3s;\n animation-delay: 0.3s;\n\n @include breakpoint($x-large) {\n max-width: $x-large;\n }\n\n ol {\n padding: 0;\n list-style: none;\n font-size: $type-size-6;\n\n @include breakpoint($large) {\n float: right;\n width: calc(100% - #{$right-sidebar-width-narrow});\n }\n\n @include breakpoint($x-large) {\n width: calc(100% - #{$right-sidebar-width});\n }\n }\n\n li {\n display: inline;\n }\n\n .current {\n font-weight: bold;\n }\n}\n\n/*\n Post pagination navigation links\n ========================================================================== */\n\n.pagination {\n @include clearfix();\n float: left;\n margin-top: 1em;\n padding-top: 1em;\n width: 100%;\n\n ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n font-family: $sans-serif;\n }\n\n li {\n display: block;\n float: left;\n margin-left: -1px;\n\n a {\n display: block;\n margin-bottom: 0.25em;\n padding: 0.5em 1em;\n font-family: $sans-serif;\n font-size: 14px;\n font-weight: bold;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n color: $muted-text-color;\n border: 1px solid mix(#000, $border-color, 25%);\n border-radius: 0;\n\n &:hover {\n color: $link-color-hover;\n }\n\n &.current,\n &.current.disabled {\n color: #fff;\n background: $primary-color;\n }\n\n &.disabled {\n color: rgba($muted-text-color, 0.5);\n pointer-events: none;\n cursor: not-allowed;\n }\n }\n\n &:first-child {\n margin-left: 0;\n\n a {\n border-top-left-radius: $border-radius;\n border-bottom-left-radius: $border-radius;\n }\n }\n\n &:last-child {\n a {\n border-top-right-radius: $border-radius;\n border-bottom-right-radius: $border-radius;\n }\n }\n }\n\n /* next/previous buttons */\n &--pager {\n display: block;\n padding: 1em 2em;\n float: left;\n width: 50%;\n font-family: $sans-serif;\n font-size: $type-size-5;\n font-weight: bold;\n text-align: center;\n text-decoration: none;\n color: $muted-text-color;\n border: 1px solid mix(#000, $border-color, 25%);\n border-radius: $border-radius;\n\n &:hover {\n @include yiq-contrasted($muted-text-color);\n }\n\n &:first-child {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n &:last-child {\n margin-left: -1px;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n &.disabled {\n color: rgba($muted-text-color, 0.5);\n pointer-events: none;\n cursor: not-allowed;\n }\n }\n}\n\n.page__content + .pagination,\n.page__meta + .pagination,\n.page__share + .pagination,\n.page__comments + .pagination {\n margin-top: 2em;\n padding-top: 2em;\n border-top: 1px solid $border-color;\n}\n\n/*\n Priority plus navigation\n ========================================================================== */\n\n.greedy-nav {\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: $nav-height;\n background: $background-color;\n\n a {\n display: block;\n margin: 0 1rem;\n color: $masthead-link-color;\n text-decoration: none;\n -webkit-transition: none;\n transition: none;\n\n &:hover {\n color: $masthead-link-color-hover;\n }\n\n &.site-logo {\n margin-left: 0;\n margin-right: 0.5rem;\n }\n\n &.site-title {\n margin-left: 0;\n }\n }\n\n img {\n -webkit-transition: none;\n transition: none;\n }\n\n &__toggle {\n -ms-flex-item-align: center;\n align-self: center;\n height: $nav-toggle-height;\n border: 0;\n outline: none;\n background-color: transparent;\n cursor: pointer;\n }\n\n .visible-links {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -webkit-box-flex: 1;\n -ms-flex: 1;\n flex: 1;\n overflow: hidden;\n\n li {\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n }\n\n a {\n position: relative;\n\n &:before {\n content: \"\";\n position: absolute;\n left: 0;\n bottom: 0;\n height: 4px;\n background: $primary-color;\n width: 100%;\n -webkit-transition: $global-transition;\n transition: $global-transition;\n -webkit-transform: scaleX(0) translate3d(0, 0, 0);\n transform: scaleX(0) translate3d(0, 0, 0); // hide\n }\n\n &:hover:before {\n -webkit-transform: scaleX(1);\n -ms-transform: scaleX(1);\n transform: scaleX(1); // reveal\n }\n }\n }\n\n .hidden-links {\n position: absolute;\n top: 100%;\n right: 0;\n margin-top: 15px;\n padding: 5px;\n border: 1px solid $border-color;\n border-radius: $border-radius;\n background: $background-color;\n -webkit-box-shadow: 0 2px 4px 0 rgba(#000, 0.16),\n 0 2px 10px 0 rgba(#000, 0.12);\n box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);\n\n &.hidden {\n display: none;\n }\n\n a {\n margin: 0;\n padding: 10px 20px;\n font-size: $type-size-5;\n\n &:hover {\n color: $masthead-link-color-hover;\n background: $navicon-link-color-hover;\n }\n }\n\n &:before {\n content: \"\";\n position: absolute;\n top: -11px;\n right: 10px;\n width: 0;\n border-style: solid;\n border-width: 0 10px 10px;\n border-color: $border-color transparent;\n display: block;\n z-index: 0;\n }\n\n &:after {\n content: \"\";\n position: absolute;\n top: -10px;\n right: 10px;\n width: 0;\n border-style: solid;\n border-width: 0 10px 10px;\n border-color: $background-color transparent;\n display: block;\n z-index: 1;\n }\n\n li {\n display: block;\n border-bottom: 1px solid $border-color;\n\n &:last-child {\n border-bottom: none;\n }\n }\n }\n}\n\n.no-js {\n .greedy-nav {\n .visible-links {\n -ms-flex-wrap: wrap;\n flex-wrap: wrap;\n overflow: visible;\n }\n }\n}\n\n/*\n Navigation list\n ========================================================================== */\n\n.nav__list {\n margin-bottom: 1.5em;\n\n input[type=\"checkbox\"],\n label {\n display: none;\n }\n\n @include breakpoint(max-width $large - 1px) {\n label {\n position: relative;\n display: inline-block;\n padding: 0.5em 2.5em 0.5em 1em;\n color: $gray;\n font-size: $type-size-6;\n font-weight: bold;\n border: 1px solid $light-gray;\n border-radius: $border-radius;\n z-index: 20;\n -webkit-transition: 0.2s ease-out;\n transition: 0.2s ease-out;\n cursor: pointer;\n\n &:before,\n &:after {\n content: \"\";\n position: absolute;\n right: 1em;\n top: 1.25em;\n width: 0.75em;\n height: 0.125em;\n line-height: 1;\n background-color: $gray;\n -webkit-transition: 0.2s ease-out;\n transition: 0.2s ease-out;\n }\n\n &:after {\n -webkit-transform: rotate(90deg);\n -ms-transform: rotate(90deg);\n transform: rotate(90deg);\n }\n\n &:hover {\n color: #fff;\n border-color: $gray;\n background-color: mix(white, #000, 20%);\n\n &:before,\n &:after {\n background-color: #fff;\n }\n }\n }\n\n /* selected*/\n input:checked + label {\n color: white;\n background-color: mix(white, #000, 20%);\n\n &:before,\n &:after {\n background-color: #fff;\n }\n }\n\n /* on hover show expand*/\n label:hover:after {\n -webkit-transform: rotate(90deg);\n -ms-transform: rotate(90deg);\n transform: rotate(90deg);\n }\n\n input:checked + label:hover:after {\n -webkit-transform: rotate(0);\n -ms-transform: rotate(0);\n transform: rotate(0);\n }\n\n ul {\n margin-bottom: 1em;\n }\n\n a {\n display: block;\n padding: 0.25em 0;\n\n @include breakpoint($large) {\n padding-top: 0.125em;\n padding-bottom: 0.125em;\n }\n\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n\n.nav__list .nav__items {\n margin: 0;\n font-size: 1.25rem;\n\n a {\n color: inherit;\n }\n\n .active {\n margin-left: -0.5em;\n padding-left: 0.5em;\n padding-right: 0.5em;\n font-weight: bold;\n }\n\n @include breakpoint(max-width $large - 1px) {\n position: relative;\n max-height: 0;\n opacity: 0%;\n overflow: hidden;\n z-index: 10;\n -webkit-transition: 0.3s ease-in-out;\n transition: 0.3s ease-in-out;\n -webkit-transform: translate(0, 10%);\n -ms-transform: translate(0, 10%);\n transform: translate(0, 10%);\n }\n}\n\n@include breakpoint(max-width $large - 1px) {\n .nav__list input:checked ~ .nav__items {\n -webkit-transition: 0.5s ease-in-out;\n transition: 0.5s ease-in-out;\n max-height: 9999px; /* exaggerate max-height to accommodate tall lists*/\n overflow: visible;\n opacity: 1;\n margin-top: 1em;\n -webkit-transform: translate(0, 0);\n -ms-transform: translate(0, 0);\n transform: translate(0, 0);\n }\n}\n\n.nav__title {\n margin: 0;\n padding: 0.5rem 0.75rem;\n font-family: $sans-serif-narrow;\n font-size: $type-size-5;\n font-weight: bold;\n}\n\n.nav__sub-title {\n display: block;\n margin: 0.5rem 0;\n padding: 0.25rem 0;\n font-family: $sans-serif-narrow;\n font-size: $type-size-6;\n font-weight: bold;\n text-transform: uppercase;\n border-bottom: 1px solid $border-color;\n}\n\n/*\n Table of contents navigation\n ========================================================================== */\n\n.toc {\n font-family: $sans-serif-narrow;\n color: $gray;\n background-color: $background-color;\n border: 1px solid $border-color;\n border-radius: $border-radius;\n -webkit-box-shadow: $box-shadow;\n box-shadow: $box-shadow;\n\n .nav__title {\n color: #fff;\n font-size: $type-size-6;\n background: $primary-color;\n border-top-left-radius: $border-radius;\n border-top-right-radius: $border-radius;\n }\n\n // Scrollspy marks toc items as .active when they are in focus\n .active a {\n @include yiq-contrasted($active-color);\n }\n}\n\n.toc__menu {\n margin: 0;\n padding: 0;\n width: 100%;\n list-style: none;\n font-size: $type-size-6;\n\n @include breakpoint($large) {\n font-size: $type-size-7;\n }\n\n a {\n display: block;\n padding: 0.25rem 0.75rem;\n color: $muted-text-color;\n font-weight: bold;\n line-height: 1.5;\n border-bottom: 1px solid $border-color;\n\n &:hover {\n color: $text-color;\n }\n }\n\n li ul > li a {\n padding-left: 1.25rem;\n font-weight: normal;\n }\n\n li ul li ul > li a {\n padding-left: 1.75rem;\n }\n\n li ul li ul li ul > li a {\n padding-left: 2.25rem;\n }\n\n li ul li ul li ul li ul > li a {\n padding-left: 2.75rem;\n }\n\n li ul li ul li ul li ul li ul > li a {\n padding-left: 3.25rem\n }\n}\n",
+ "/* ==========================================================================\n FOOTER\n ========================================================================== */\n\n.page__footer {\n @include clearfix;\n float: left;\n margin-left: 0;\n margin-right: 0;\n width: 100%;\n margin-top: 3em;\n color: $muted-text-color;\n -webkit-animation: $intro-transition;\n animation: $intro-transition;\n -webkit-animation-delay: 0.45s;\n animation-delay: 0.45s;\n background-color: $footer-background-color;\n\n footer {\n @include clearfix;\n margin-left: auto;\n margin-right: auto;\n margin-top: 2em;\n max-width: 100%;\n padding: 0 1em 2em;\n\n @include breakpoint($x-large) {\n max-width: $x-large;\n }\n }\n\n a {\n color: inherit;\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n }\n\n .fas,\n .fab,\n .far,\n .fal {\n color: $muted-text-color;\n }\n}\n\n.page__footer-copyright {\n font-family: $global-font-family;\n font-size: $type-size-7;\n}\n\n.page__footer-follow {\n ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n }\n\n li {\n display: inline-block;\n padding-top: 5px;\n padding-bottom: 5px;\n font-family: $sans-serif-narrow;\n font-size: $type-size-6;\n text-transform: uppercase;\n }\n\n li + li:before {\n content: \"\";\n padding-right: 5px;\n }\n\n a {\n padding-right: 10px;\n font-weight: bold;\n }\n\n .social-icons {\n a {\n white-space: nowrap;\n }\n }\n}\n",
+ "/* ==========================================================================\n SEARCH\n ========================================================================== */\n\n.layout--search {\n .archive__item-teaser {\n margin-bottom: 0.25em;\n }\n}\n\n.search__toggle {\n margin-left: 1rem;\n margin-right: 1rem;\n height: $nav-toggle-height;\n border: 0;\n outline: none;\n color: $primary-color;\n background-color: transparent;\n cursor: pointer;\n -webkit-transition: 0.2s;\n transition: 0.2s;\n\n &:hover {\n color: mix(#000, $primary-color, 25%);\n }\n}\n\n.search-icon {\n width: 100%;\n height: 100%;\n}\n\n.search-content {\n display: none;\n visibility: hidden;\n padding-top: 1em;\n padding-bottom: 1em;\n\n &__inner-wrap {\n width: 100%;\n margin-left: auto;\n margin-right: auto;\n padding-left: 1em;\n padding-right: 1em;\n -webkit-animation: $intro-transition;\n animation: $intro-transition;\n -webkit-animation-delay: 0.15s;\n animation-delay: 0.15s;\n\n @include breakpoint($x-large) {\n max-width: $max-width;\n }\n\n }\n\n &__form {\n background-color: transparent;\n }\n\n .search-input {\n display: block;\n margin-bottom: 0;\n padding: 0;\n border: none;\n outline: none;\n box-shadow: none;\n background-color: transparent;\n font-size: $type-size-3;\n\n @include breakpoint($large) {\n font-size: $type-size-2;\n }\n\n @include breakpoint($x-large) {\n font-size: $type-size-1;\n }\n }\n\n &.is--visible {\n display: block;\n visibility: visible;\n\n &::after {\n content: \"\";\n display: block;\n }\n }\n\n .results__found {\n margin-top: 0.5em;\n font-size: $type-size-6;\n }\n\n .archive__item {\n margin-bottom: 2em;\n\n @include breakpoint($large) {\n width: 75%;\n }\n\n @include breakpoint($x-large) {\n width: 50%;\n }\n }\n\n .archive__item-title {\n margin-top: 0;\n }\n\n .archive__item-excerpt {\n margin-bottom: 0;\n }\n}\n\n/* Algolia search */\n\n.ais-search-box {\n max-width: 100% !important;\n margin-bottom: 2em;\n}\n\n.archive__item-title .ais-Highlight {\n color: $primary-color;\n font-style: normal;\n text-decoration: underline;\n}\n\n.archive__item-excerpt .ais-Highlight {\n color: $primary-color;\n font-style: normal;\n font-weight: bold;\n}\n",
+ "/* ==========================================================================\n Syntax highlighting\n ========================================================================== */\n\ndiv.highlighter-rouge,\nfigure.highlight {\n position: relative;\n margin-bottom: 1em;\n background: $base00;\n color: $base05;\n font-family: $monospace;\n font-size: $type-size-6;\n line-height: 1.8;\n border-radius: $border-radius;\n\n > pre,\n pre.highlight {\n margin: 0;\n padding: 1em;\n }\n}\n\n.highlight table {\n margin-bottom: 0;\n font-size: 1em;\n border: 0;\n\n td {\n padding: 0;\n width: calc(100% - 1em);\n border: 0;\n\n /* line numbers*/\n &.gutter,\n &.rouge-gutter {\n padding-right: 1em;\n width: 1em;\n color: $base04;\n border-right: 1px solid $base04;\n text-align: right;\n }\n\n /* code */\n &.code,\n &.rouge-code {\n padding-left: 1em;\n }\n }\n\n pre {\n margin: 0;\n }\n}\n\n.highlight pre {\n width: 100%;\n}\n\n.highlight .hll {\n background-color: $base06;\n}\n.highlight {\n .c {\n /* Comment */\n color: $base04;\n }\n .err {\n /* Error */\n color: $base08;\n }\n .k {\n /* Keyword */\n color: $base0e;\n }\n .l {\n /* Literal */\n color: $base09;\n }\n .n {\n /* Name */\n color: $base05;\n }\n .o {\n /* Operator */\n color: $base0c;\n }\n .p {\n /* Punctuation */\n color: $base05;\n }\n .cm {\n /* Comment.Multiline */\n color: $base04;\n }\n .cp {\n /* Comment.Preproc */\n color: $base04;\n }\n .c1 {\n /* Comment.Single */\n color: $base04;\n }\n .cs {\n /* Comment.Special */\n color: $base04;\n }\n .gd {\n /* Generic.Deleted */\n color: $base08;\n }\n .ge {\n /* Generic.Emph */\n font-style: italic;\n }\n .gh {\n /* Generic.Heading */\n color: $base05;\n font-weight: bold;\n }\n .gi {\n /* Generic.Inserted */\n color: $base0b;\n }\n .gp {\n /* Generic.Prompt */\n color: $base04;\n font-weight: bold;\n }\n .gs {\n /* Generic.Strong */\n font-weight: bold;\n }\n .gu {\n /* Generic.Subheading */\n color: $base0c;\n font-weight: bold;\n }\n .kc {\n /* Keyword.Constant */\n color: $base0e;\n }\n .kd {\n /* Keyword.Declaration */\n color: $base0e;\n }\n .kn {\n /* Keyword.Namespace */\n color: $base0c;\n }\n .kp {\n /* Keyword.Pseudo */\n color: $base0e;\n }\n .kr {\n /* Keyword.Reserved */\n color: $base0e;\n }\n .kt {\n /* Keyword.Type */\n color: $base0a;\n }\n .ld {\n /* Literal.Date */\n color: $base0b;\n }\n .m {\n /* Literal.Number */\n color: $base09;\n }\n .s {\n /* Literal.String */\n color: $base0b;\n }\n .na {\n /* Name.Attribute */\n color: $base0d;\n }\n .nb {\n /* Name.Builtin */\n color: $base05;\n }\n .nc {\n /* Name.Class */\n color: $base0a;\n }\n .no {\n /* Name.Constant */\n color: $base08;\n }\n .nd {\n /* Name.Decorator */\n color: $base0c;\n }\n .ni {\n /* Name.Entity */\n color: $base05;\n }\n .ne {\n /* Name.Exception */\n color: $base08;\n }\n .nf {\n /* Name.Function */\n color: $base0d;\n }\n .nl {\n /* Name.Label */\n color: $base05;\n }\n .nn {\n /* Name.Namespace */\n color: $base0a;\n }\n .nx {\n /* Name.Other */\n color: $base0d;\n }\n .py {\n /* Name.Property */\n color: $base05;\n }\n .nt {\n /* Name.Tag */\n color: $base0c;\n }\n .nv {\n /* Name.Variable */\n color: $base08;\n }\n .ow {\n /* Operator.Word */\n color: $base0c;\n }\n .w {\n /* Text.Whitespace */\n color: $base05;\n }\n .mf {\n /* Literal.Number.Float */\n color: $base09;\n }\n .mh {\n /* Literal.Number.Hex */\n color: $base09;\n }\n .mi {\n /* Literal.Number.Integer */\n color: $base09;\n }\n .mo {\n /* Literal.Number.Oct */\n color: $base09;\n }\n .sb {\n /* Literal.String.Backtick */\n color: $base0b;\n }\n .sc {\n /* Literal.String.Char */\n color: $base05;\n }\n .sd {\n /* Literal.String.Doc */\n color: $base04;\n }\n .s2 {\n /* Literal.String.Double */\n color: $base0b;\n }\n .se {\n /* Literal.String.Escape */\n color: $base09;\n }\n .sh {\n /* Literal.String.Heredoc */\n color: $base0b;\n }\n .si {\n /* Literal.String.Interpol */\n color: $base09;\n }\n .sx {\n /* Literal.String.Other */\n color: $base0b;\n }\n .sr {\n /* Literal.String.Regex */\n color: $base0b;\n }\n .s1 {\n /* Literal.String.Single */\n color: $base0b;\n }\n .ss {\n /* Literal.String.Symbol */\n color: $base0b;\n }\n .bp {\n /* Name.Builtin.Pseudo */\n color: $base05;\n }\n .vc {\n /* Name.Variable.Class */\n color: $base08;\n }\n .vg {\n /* Name.Variable.Global */\n color: $base08;\n }\n .vi {\n /* Name.Variable.Instance */\n color: $base08;\n }\n .il {\n /* Literal.Number.Integer.Long */\n color: $base09;\n }\n}\n\n.gist {\n th, td {\n border-bottom: 0;\n }\n}",
+ "/* ==========================================================================\n UTILITY CLASSES\n ========================================================================== */\n\n/*\n Visibility\n ========================================================================== */\n\n/* http://www.456bereastreet.com/archive/200711/screen_readers_sometimes_ignore_displaynone/ */\n\n.hidden,\n.is--hidden {\n display: none;\n visibility: hidden;\n}\n\n/* for preloading images */\n\n.load {\n display: none;\n}\n\n.transparent {\n opacity: 0;\n}\n\n/* https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html */\n\n.visually-hidden,\n.screen-reader-text,\n.screen-reader-text span,\n.screen-reader-shortcut {\n position: absolute !important;\n clip: rect(1px, 1px, 1px, 1px);\n height: 1px !important;\n width: 1px !important;\n border: 0 !important;\n overflow: hidden;\n}\n\nbody:hover .visually-hidden a,\nbody:hover .visually-hidden input,\nbody:hover .visually-hidden button {\n display: none !important;\n}\n\n/* screen readers */\n\n.screen-reader-text:focus,\n.screen-reader-shortcut:focus {\n clip: auto !important;\n height: auto !important;\n width: auto !important;\n display: block;\n font-size: 1em;\n font-weight: bold;\n padding: 15px 23px 14px;\n background: #fff;\n z-index: 100000;\n text-decoration: none;\n box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);\n}\n\n/*\n Skip links\n ========================================================================== */\n\n.skip-link {\n position: fixed;\n z-index: 20;\n margin: 0;\n font-family: $sans-serif;\n white-space: nowrap;\n}\n\n.skip-link li {\n height: 0;\n width: 0;\n list-style: none;\n}\n\n/*\n Type\n ========================================================================== */\n\n.text-left {\n text-align: left;\n}\n\n.text-center {\n text-align: center;\n}\n\n.text-right {\n text-align: right;\n}\n\n.text-justify {\n text-align: justify;\n}\n\n.text-nowrap {\n white-space: nowrap;\n}\n\n/*\n Task lists\n ========================================================================== */\n\n.task-list {\n padding:0;\n\n li {\n list-style-type: none;\n }\n\n .task-list-item-checkbox {\n margin-right: 0.5em;\n opacity: 1;\n }\n}\n\n.task-list .task-list {\n margin-left: 1em;\n}\n\n/*\n Alignment\n ========================================================================== */\n\n/* clearfix */\n\n.cf {\n clear: both;\n}\n\n.wrapper {\n margin-left: auto;\n margin-right: auto;\n width: 100%;\n}\n\n/*\n Images\n ========================================================================== */\n\n/* image align left */\n\n.align-left {\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n @include breakpoint($small) {\n float: left;\n margin-right: 1em;\n }\n}\n\n/* image align right */\n\n.align-right {\n display: block;\n margin-left: auto;\n margin-right: auto;\n\n @include breakpoint($small) {\n float: right;\n margin-left: 1em;\n }\n}\n\n/* image align center */\n\n.align-center {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n\n/* file page content container */\n\n.full {\n @include breakpoint($large) {\n margin-right: -1 * span(2.5 of 12) !important;\n }\n}\n\n/*\n Icons\n ========================================================================== */\n\n.icon {\n display: inline-block;\n fill: currentColor;\n width: 1em;\n height: 1.1em;\n line-height: 1;\n position: relative;\n top: -0.1em;\n vertical-align: middle;\n}\n\n/* social icons*/\n\n.social-icons {\n .fas,\n .fab,\n .far,\n .fal {\n color: $text-color;\n }\n\n @each $color, $icons in (\n $behance-color: \".fa-behance, .fa-behance-square\",\n $bitbucket-color: \".fa-bitbucket\",\n $dribbble-color: \".fa-dribbble, .fa-dribbble-square\",\n $facebook-color: \".fa-facebook, .fa-facebook-square, .fa-facebook-f\",\n $flickr-color: \".fa-flickr\",\n $foursquare-color: \".fa-foursquare\",\n $github-color: \".fa-github, .fa-github-alt, .fa-github-square\",\n $gitlab-color: \".fa-gitlab\",\n $instagram-color: \".fa-instagram\",\n $keybase-color: \".fa-keybase\",\n $lastfm-color: \".fa-lastfm, .fa-lastfm-square\",\n $linkedin-color: \".fa-linkedin, .fa-linkedin-in\",\n $mastodon-color: \".fa-mastodon, .fa-mastodon-square\",\n $pinterest-color: \".fa-pinterest, .fa-pinterest-p, .fa-pinterest-square\",\n $reddit-color: \".fa-reddit\",\n $rss-color: \".fa-rss, .fa-rss-square\",\n $soundcloud-color: \".fa-soundcloud\",\n $stackoverflow-color: \".fa-stack-exchange, .fa-stack-overflow\",\n $tumblr-color: \".fa-tumblr, .fa-tumblr-square\",\n $twitter-color: \".fa-twitter, .fa-twitter-square\",\n $vimeo-color: \".fa-vimeo, .fa-vimeo-square, .fa-vimeo-v\",\n $vine-color: \".fa-vine\",\n $xing-color: \".fa-xing, .fa-xing-square\",\n $youtube-color: \".fa-youtube\",\n ) {\n #{$icons} {\n color: $color;\n }\n }\n}\n\n/*\n Navicons\n ========================================================================== */\n\n.navicon {\n position: relative;\n width: $navicon-width;\n height: $navicon-height;\n background: $primary-color;\n margin: auto;\n -webkit-transition: 0.3s;\n transition: 0.3s;\n\n &:before,\n &:after {\n content: \"\";\n position: absolute;\n left: 0;\n width: $navicon-width;\n height: $navicon-height;\n background: $primary-color;\n -webkit-transition: 0.3s;\n transition: 0.3s;\n }\n\n &:before {\n top: (-2 * $navicon-height);\n }\n\n &:after {\n bottom: (-2 * $navicon-height);\n }\n}\n\n.close .navicon {\n /* hide the middle line*/\n background: transparent;\n\n /* overlay the lines by setting both their top values to 0*/\n &:before,\n &:after {\n -webkit-transform-origin: 50% 50%;\n -ms-transform-origin: 50% 50%;\n transform-origin: 50% 50%;\n top: 0;\n width: $navicon-width;\n }\n\n /* rotate the lines to form the x shape*/\n &:before {\n -webkit-transform: rotate3d(0, 0, 1, 45deg);\n transform: rotate3d(0, 0, 1, 45deg);\n }\n &:after {\n -webkit-transform: rotate3d(0, 0, 1, -45deg);\n transform: rotate3d(0, 0, 1, -45deg);\n }\n}\n\n.greedy-nav__toggle {\n &:before {\n @supports (pointer-events: none) {\n content: '';\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n background-color: $background-color;\n -webkit-transition: $global-transition;\n transition: $global-transition;\n pointer-events: none;\n }\n }\n\n &.close {\n &:before {\n opacity: 0.9;\n -webkit-transition: $global-transition;\n transition: $global-transition;\n pointer-events: auto;\n }\n }\n}\n\n.greedy-nav__toggle:hover {\n .navicon,\n .navicon:before,\n .navicon:after {\n background: mix(#000, $primary-color, 25%);\n }\n\n &.close {\n .navicon {\n background: transparent;\n }\n }\n}\n\n/*\n Sticky, fixed to top content\n ========================================================================== */\n\n.sticky {\n @include breakpoint($large) {\n @include clearfix();\n position: -webkit-sticky;\n position: sticky;\n top: 2em;\n\n > * {\n display: block;\n }\n }\n}\n\n/*\n Wells\n ========================================================================== */\n\n.well {\n min-height: 20px;\n padding: 19px;\n margin-bottom: 20px;\n background-color: #f5f5f5;\n border: 1px solid #e3e3e3;\n border-radius: $border-radius;\n box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\n}\n\n/*\n Modals\n ========================================================================== */\n\n.show-modal {\n overflow: hidden;\n position: relative;\n\n &:before {\n position: absolute;\n content: \"\";\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 999;\n background-color: rgba(255, 255, 255, 0.85);\n }\n\n .modal {\n display: block;\n }\n}\n\n.modal {\n display: none;\n position: fixed;\n width: 300px;\n top: 50%;\n left: 50%;\n margin-left: -150px;\n margin-top: -150px;\n min-height: 0;\n z-index: 9999;\n background: #fff;\n border: 1px solid $border-color;\n border-radius: $border-radius;\n box-shadow: $box-shadow;\n\n &__title {\n margin: 0;\n padding: 0.5em 1em;\n }\n\n &__supporting-text {\n padding: 0 1em 0.5em 1em;\n }\n\n &__actions {\n padding: 0.5em 1em;\n border-top: 1px solid $border-color;\n }\n}\n\n/*\n Footnotes\n ========================================================================== */\n\n.footnote {\n color: mix(#fff, $gray, 25%);\n text-decoration: none;\n}\n\n.footnotes {\n color: mix(#fff, $gray, 25%);\n\n ol,\n li,\n p {\n margin-bottom: 0;\n font-size: $type-size-6;\n }\n}\n\na.reversefootnote {\n color: $gray;\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n}\n\n/*\n Required\n ========================================================================== */\n\n.required {\n color: $danger-color;\n font-weight: bold;\n}\n\n/*\n Google Custom Search Engine\n ========================================================================== */\n\n.gsc-control-cse {\n table,\n tr,\n td {\n border: 0; /* remove table borders widget */\n }\n}\n\n/*\n Responsive Video Embed\n ========================================================================== */\n\n.responsive-video-container {\n position: relative;\n margin-bottom: 1em;\n padding-bottom: 56.25%;\n height: 0;\n overflow: hidden;\n max-width: 100%;\n\n iframe,\n object,\n embed {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n// full screen video fixes\n:-webkit-full-screen-ancestor {\n .masthead,\n .page__footer {\n position: static;\n }\n}\n\n/*\n Copy block to clipboard\n ========================================================================== */\n\n// a