{"version":3,"sources":["webpack:///./~/prb-style-library/reset.scss?a0db*","webpack:///./~/prb-style-library/base.scss?62fb*","webpack:///./~/prb-style-library/utilities.scss?f9f1**","webpack:///./client/scss/styleguide.scss","webpack:///./~/prb-style-library/variables.scss?a0d0**"],"names":[],"mappings":"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","file":"css/styleguide.0483068c4994e10dde59.min.css","sourcesContent":["// Reset\n\n/* http://meyerweb.com/eric/tools/css/reset/\n\tv2.0 | 20110126\n\tLicense: none (public domain)\n*/\n/* stylelint-disable */\nhtml, body, div, span, applet, object, iframe,\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\na, abbr, acronym, address, big, cite, code,\ndel, dfn, em, img, ins, kbd, q, s, samp,\nsmall, strike, strong, sub, sup, tt, var,\nb, u, i, center,\ndl, dt, dd, ol, ul, li,\nfieldset, form, label, legend,\ntable, caption, tbody, tfoot, thead, tr, th, td,\narticle, aside, canvas, details, embed,\nfigure, figcaption, footer, header, hgroup,\nmenu, nav, output, ruby, section, summary,\ntime, mark, audio, video {\n\tmargin: 0;\n\tpadding: 0;\n\tborder: 0;\n\tfont-size: 100%;\n\tfont: inherit;\n\tvertical-align: baseline;\n}\n/* HTML5 display-role reset for older browsers */\narticle, aside, details, figcaption, figure,\nfooter, header, hgroup, menu, nav, section {\n\tdisplay: block;\n}\n\nbody {\n\tline-height: 1;\n}\n\nol, ul {\n\tlist-style: none;\n}\n\nblockquote, q {\n\tquotes: none;\n}\n\nblockquote:before, blockquote:after,\nq:before, q:after {\n\tcontent: '';\n\tcontent: none;\n}\n\ntable {\n\tborder-collapse: collapse;\n\tborder-spacing: 0;\n}\n/* stylelint-enable */\n\n\n\n// WEBPACK FOOTER //\n// ./~/prb-style-library/reset.scss","// Common baseline styles\n\nhtml {\n  box-sizing: border-box;\n  color: $prb-gray;\n  font-family: $font-body;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n*,\n*::before,\n*::after {\n  box-sizing: inherit;\n}\n\nimg {\n  height: auto;\n  width: 100%;\n}\n\n.content-area {\n  @include vertical-rhythm(2);\n}\n\na {\n  color: $color-anchor;\n  text-decoration: none;\n}\n\n.site {\n  min-width: px-to-em(320);\n}\n\n/* a11y\n-------------------------------------------------------------- */\n\n.screen-reader-text {\n  @include sr-only();\n}\n\n/* Page overlay\n-------------------------------------------------------------- */\n\n.overlay-active {\n  position: relative;\n\n  &::before {\n    background-color: $prb-overlay;\n    content: '';\n    display: block;\n    height: 100%;\n    left: 0;\n    pointer-events: none;\n    position: fixed;\n    top: 0;\n    width: 100%;\n    z-index: index($indices, pageoverlay);\n  }\n}\n\n/* Section Content - Layout\n-------------------------------------------------------------- */\n\n// Define a section of content for column layout\n.section-content {\n  @include container;\n\n  @include breakpoint(false, m) {\n    @include vertical-rhythm(1);\n  }\n\n  @include breakpoint(m) {\n    lost-flex-container: row;\n  }\n}\n\n// Section content modifier to add negitive margin to top\n.section-content--offset-top {\n  margin-top: - px-to-em($spacer * 3);\n}\n\n// Represents primary content area\n.section-content__primary {\n  @include vertical-rhythm(1);\n\n  @include breakpoint(m) {\n    lost-column: 8.5/12 1;\n    order: 2;\n  }\n\n  @include breakpoint(l) {\n    lost-column: 9/12 1;\n  }\n}\n\n// Represents secondary content area\n.section-content__secondary {\n  @include vertical-rhythm(2);\n\n  @include breakpoint(m) {\n    lost-column: 3.5/12;\n    order: 1;\n  }\n\n  @include breakpoint(l) {\n    lost-column: 2/12;\n  }\n}\n\n// Section content modifier to center primary content w/o secondary\n.section-content--centered {\n\n  .section-content__primary,\n  .post-body {\n    margin-left: auto;\n    margin-right: auto;\n  }\n}\n\n\n\n\n// WEBPACK FOOTER //\n// ./~/prb-style-library/base.scss","// Common Sass utility functions and mixins\n\n/* Imports\n-------------------------------------------------------------- */\n@import 'arrows';\n\n/* Unit Conversion\n-------------------------------------------------------------- */\n\n/**\n * Convert px to rem or em\n * Unitless values are assumed to be in px\n *\n * $px: pixel value, can be unitless\n * $rem: should output be in rem units?\n * $base-value: font size from which calculations are made\n */\n@function px-to-em($px, $rem: false, $base-value: $base-unit) {\n  @if ('px' == unit($px)) {\n    $px: $px / 1px;\n  }\n\n  @if $rem == true {\n    @return $px / $base-value * 1rem;\n  }\n\n  @else {\n    @return $px / $base-value * 1em;\n  }\n}\n\n/*\n * Convert a list of unitless values (or px) to rem or em\n *\n * $values: single value or list of values\n * $rem: should output be in rem units?\n * $base-value: font size from which calculations are made\n*/\n@function em-calc($values, $rem: false, $base-value: $base-unit) {\n  $max: length($values);\n  $em-values: ();\n\n  @if $max == 1 {\n    @return px-to-em(nth($values, 1), $rem, $base-value);\n  }\n\n  @for $i from 1 through $max {\n    $value: nth($values, $i);\n    // It's 'auto'\n    @if (string == type-of($value)) {\n      $em-values: append($em-values, $value);\n    }\n\n    @else if (number == type-of($value)) {\n      $em-values: append($em-values, px-to-em(nth($values, $i), $rem, $base-value));\n    }\n  }\n\n  @return $em-values;\n}\n\n/* Typography\n-------------------------------------------------------------- */\n\n/*\n * Establish font property\n */\n@mixin font(\n  $font-size: $base-unit,\n  $line-height: $base-unit,\n  $font-family: $font-body,\n  $font-weight: 400,\n  $font-style: normal\n) {\n  // stylelint-disable font-family-name-quotes\n  font: $font-style\n    $font-weight #{px-to-em($font-size) + '/' + ($line-height / $font-size)}\n    $font-family;\n  // stylelint-enable font-family-name-quotes\n}\n\n/*\n * Establish font label style\n */\n@mixin font-label($size: 14) {\n  @include font($size, $size, $font-label, 600);\n  text-transform: uppercase;\n}\n\n/*\n * Establish font stack for articles\n */\n@mixin article-font-stack($size: 'normal') {\n  @if ('normal' == $size) {\n\n    &__text {\n      @include vertical-rhythm(0.5);\n    }\n\n    &__byline,\n    &__meta {\n      @include font(12, 15, $font-label, 700);\n      text-transform: uppercase;\n    }\n\n    &__readmore {\n      @include font(14, 18, $font-label, 700);\n      text-transform: uppercase;\n    }\n\n    &__title {\n      @include font(20, 24, $font-title, 600);\n    }\n\n    &__excerpt {\n      @include font(18, 26);\n    }\n  }\n}\n\n/**\n * Aside Header\n */\n@mixin aside-header() {\n  @include font(12, 15, $font-body, 600);\n  color: $ocean;\n  text-transform: uppercase;\n}\n\n/* Layout\n-------------------------------------------------------------- */\n\n/*\n * Style based on a generated breakpoint\n * Note: use both $from-breakpoint and $to-breakpoint to do a min/max range\n *\n * $from-breakpoint: use only this to specify a minimum width\n * $to-breakpoint: use only this to specify a maximum width\n */\n@mixin breakpoint( $from-breakpoint, $to-breakpoint: false ) {\n  $breakpoint-string: null;\n\n  @if ( false == $to-breakpoint and false != $from-breakpoint ) {\n    $start: $column-width * map-get( $columns-map, $from-breakpoint );\n    $breakpoint-string: '(min-width: ' + em-calc( $start ) ')';\n  }\n\n  @else if ( false == $from-breakpoint and false != $to-breakpoint  ) {\n    $end: ( $column-width * map-get( $columns-map, $to-breakpoint ) ) - 1;\n    $breakpoint-string: '(max-width: ' + em-calc( $end ) ')';\n  }\n\n  @else {\n    $start: $column-width * map-get( $columns-map, $from-breakpoint );\n    $end: ( $column-width * map-get( $columns-map, $to-breakpoint ) ) - 1;\n    $breakpoint-string: '(min-width: ' + em-calc( $start ) + ')\n      and (max-width: ' + em-calc( $end ) ')';\n  }\n\n  @if ( null != $breakpoint-string ) {\n    @media #{$breakpoint-string} {\n      @content;\n    }\n  }\n\n  @else {\n    @error 'Breakpoint '#{$breakpoint}' does not exist';\n  }\n}\n\n/*\n * Establish a vertical rhythm in a container\n */\n@mixin vertical-rhythm( $margin-bottom: 1 ) {\n\n  > * {\n    margin-bottom: #{$margin-bottom}rem;\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n}\n\n/*\n * Establish a container\n */\n@mixin container( $max-width: $container-max-width ) {\n  margin-left: auto;\n  margin-right: auto;\n  max-width: px-to-em($max-width);\n  padding: px-to-em($container-padding);\n}\n\n/*\n * Add horizontal rule to an item or mutliple items\n */\n@mixin horizontal-rule($count:single, $color: $border-color-dark) {\n  border-bottom: 1px solid $color;\n  padding-bottom: px-to-em($spacer);\n\n  @if ('multi' == $count) {\n\n    &:last-of-type {\n      border-bottom: 0;\n      padding-bottom: 0;\n    }\n  }\n}\n\n/**\n * Span a inline element full browser width\n */\n@mixin size-full-browser-width() {\n  @include breakpoint(false, m) {\n    margin-left: - px-to-em($spacer * 2); // offset equal to l/r padding around section content\n    width: 100vw;\n  }\n\n  @include breakpoint(xl) {\n    margin-left: calc(50% - 50vw - #{$spacer/2}px);\n    margin-right: calc(50% - 50vw - #{$spacer/2}px);\n    width: calc(100vw - #{$spacer}px);\n  }\n}\n\n/**\n * Span a inline element slightly outside the post-body wrapper\n */\n@mixin size-outset() {\n  @include breakpoint(xl) {\n    // ([width of image] - [width of postbody]) / 2\n    margin-left: calc((-#{$media-outset-size}px - -#{$container-post-body}px) / 2);\n    max-width: none; // don't contain image size to wrapper\n    width: #{$media-outset-size}px;\n  }\n}\n\n/**\n * Create a value that multiplies the site's default unit.\n * @param  {number} $multiplier             How many units to return.\n * @return {number}                         A measurement in rem units.\n */\n@function spacer($multiplier: 1) {\n  @return em-calc(($spacer * $multiplier), true);\n}\n\n/* A11y\n-------------------------------------------------------------- */\n\n/*\n * Only display content to screen readers\n * See: http://a11yproject.com/posts/how-to-hide-content\n */\n@mixin sr-only() {\n  border: 0;\n  clip: rect(0,0,0,0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  width: 1px;\n}\n\n/*\n * Use in conjunction with .sr-only to only display content when it's focused.\n * Useful for \"Skip to main content\" links;\n * @see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1\n * Credit: HTML5 Boilerplate\n */\n@mixin sr-only-focusable() {\n\n  &:active,\n  &:focus {\n    clip: auto;\n    height: auto;\n    margin: 0;\n    overflow: visible;\n    position: static;\n    width: auto;\n  }\n}\n\n/* Buttons\n-------------------------------------------------------------- */\n\n/*\n * Button Reset\n */\n@mixin button-reset() {\n  background: transparent;\n  border: 0;\n  cursor: pointer;\n  padding: 0;\n}\n\n/*\n * Button Default\n */\n@mixin button-default($bgcolor: $prb-blend-linear, $textcolor: $white) {\n  @include button-reset;\n  @include font(14, 14, $font-body, 600);\n  background: $bgcolor;\n  color: $textcolor;\n  display: inline-block;\n  padding: px-to-em($spacer) px-to-em($spacer * 2);\n  text-transform: uppercase;\n\n  a {\n    color: $white;\n  }\n}\n\n/*\n * Button Outlined\n */\n@mixin button-outlined() {\n  @include button-reset;\n  @include font(14, 14, $font-body, 600);\n  border: 1px solid $ocean;\n  color: $ocean;\n  display: inline-block;\n  padding: px-to-em($spacer / 2) px-to-em($spacer * 2);\n  text-transform: uppercase;\n  vertical-align: middle;\n\n  a {\n    color: $ocean;\n  }\n}\n\n/* Motifs\n --------------------------------------------------------------*/\n\n@mixin data-section() {\n  background-color: $white;\n  box-shadow: 0 rem(1) rem(3) 0 $prb-borders;\n  margin-bottom: spacer(3);\n  padding: spacer(2);\n\n  p {\n    color: $prb-gray;\n    font-family: $font-body;\n    font-size: rem(18);\n    line-height: 1.777777778;\n    margin-bottom: spacer();\n  }\n}\n\n@mixin data-copy() {\n  color: $prb-gray;\n  font-family: $font-body;\n  font-size: rem(18);\n  line-height: 1.777777778;\n  margin-bottom: spacer();\n}\n\n\n\n// WEBPACK FOOTER //\n// ./~/prb-style-library/utilities.scss","// Styleguide specific styles go here\n\n@import '~prb-style-library/loader';\n\n// Wrappers\n.prototype-styleguide {\n\tbackground-color: darken($white, 2%);\n\tmargin: 0;\n\toverflow-x: hidden;\n}\n\n.styleguide-logo {\n\tmargin: 2em 0;\n}\n\n.styleguide-header {\n\tpadding: 4rem 1.5rem 0;\n\tposition: relative;\n\n\t> h4 {\n\t\tmargin-bottom: 0.5em;\n\t}\n\n\t.section-menu-open & {\n\t\tleft: px-to-em($styleguide-menu-width);\n\t}\n}\n\n.styleguide-links {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\n\tli {\n\t\tmargin-right: 1em;\n\n\t\t@media (max-width: 40em) {\n\t\t\tmargin: 0 0 1em 0;\n\t\t\twidth: 100%;\n\t\t}\n\t}\n\n\ta {\n\t\t@include font(13, 13, $font-body, 600);\n\t\tborder-radius: 3px;\n\t\tborder: 1px solid $gray;\n\t\tdisplay: block;\n\t\tpadding: 8px 15px;\n\n\t\t&:hover {\n\t\t\tbackground-color: $brand-primary;\n\t\t\tcolor: $white;\n\t\t}\n\t}\n}\n\n// Menu\n[huron-menu] {\n\tborder-right: 1px solid $gray-light;\n\tbox-shadow: 1px 1px 2px rgba(0, 0, 0, 0.07);\n\tfont-size: 1rem;\n\theight: 100%;\n\tleft: 0;\n\toverflow-x: visible;\n\toverflow-y: scroll;\n\tpadding: 2em 1em;\n\tposition: fixed;\n\ttop: 0;\n\ttransform: translateX(-100%);\n\twidth: px-to-em($styleguide-menu-width);\n\n\t.section-menu-open & {\n\t\ttransform: translateX(0);\n\t}\n}\n\n.section-menu__expand {\n\t@include font(14, 14, $font-body, 600);\n\tbackground-color: $gray-medium;\n\tborder: 0;\n\tcolor: $gray-lightest;\n\tcursor: pointer;\n\tleft: 0;\n\tpadding: 0.5em 1em;\n\tposition: fixed;\n\ttext-transform: uppercase;\n\ttop: 0;\n\ttransition: background 125ms linear;\n\tz-index: 999999;\n\n\t&:hover {\n\t\tbackground-color: $brand-primary;\n\t}\n\n\t.section-menu-open & {\n\t\tleft: px-to-em($styleguide-menu-width);\n\t}\n}\n\n.section-menu {\n\tborder-left: 3px solid $gray;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.section-menu--submenu {\n\n\t> li {\n\n\t\ta {\n\t\t\t@include font(13, 15, $font-body, 700);\n\t\t\tcolor: $gray-medium;\n\t\t}\n\t}\n}\n\n.section-menu__item {\n\tborder-left: 3px solid transparent;\n\tcolor: $gray-dark;\n\tleft: -3px;\n\tpadding: 0.25em 0 0.25em 0.5em;\n\tposition: relative;\n\ttransition: border 125ms linear, color 125ms linear;\n\n\t&:hover {\n\t\tborder-left-color: $brand-primary;\n\n\t\t> a {\n\t\t\tcolor: $brand-primary;\n\t\t}\n\t}\n\n\ta {\n\t\t@include font(16, 20, $font-body, 700);\n\t\tcolor: $gray-dark;\n\t\tdisplay: block;\n\t\ttext-decoration: none;\n\t\twidth: 100%;\n\t}\n}\n\n.section-menu__item--has-submenu {\n\tpadding-bottom: 0;\n}\n\n// Sections\n[huron-sections] {\n\tpadding: 1em 0;\n\twidth: 100vw;\n\n\t.section-menu-open & {\n\t\tmargin-left: px-to-em($styleguide-menu-width + 32);\n\t\twidth: calc(100vw - (#{$styleguide-menu-width}px));\n\t}\n}\n\n.section--top-level__wrapper {\n\tborder-bottom: 1px solid $gray-light;\n\tmargin-bottom: 3em;\n\tmin-height: 100vh;\n\tpadding: 0 0 3em;\n\n\t&:last-child {\n\t\tborder-bottom: 0;\n\t}\n\n\t> * {\n\t\tmargin-bottom: 4em;\n\t}\n\n\t.section,\n\t.section > div {\n\n\t\t&:last-of-type { // stylelint-disable-line selector-max-specificity\n\t\t\tmargin-bottom: 0;\n\t\t}\n\t}\n}\n\n.section {\n\tfont-size: 1rem;\n\tpadding-top: 1.5rem;\n\n\t> * {\n\t\tmargin-bottom: 2rem;\n\n\t\t&:last-child {\n\t\t\tmargin-bottom: 0;\n\t\t}\n\t}\n}\n\n.section__header {\n\t@include font(32, 38, $font-body, 700);\n\tborder-bottom: 1px dotted darken($gray-light, 2%);\n\tcolor: $brand-primary;\n\tmargin-bottom: 1em;\n}\n\n.section__meta {\n\n\tp {\n\t\tmargin-top: 0;\n\t}\n}\n\n.section__field-title,\n.section__description,\n.section__header {\n\tpadding: 0 1.5rem;\n}\n\n.section__field-title {\n\t@include font(16, 20, $font-body, 700);\n\tcolor: $gray-medium;\n\tmargin: 0 0 0.5rem;\n}\n\n.section__reference {\n\n\tspan {\n\t\tcolor: $brand-primary;\n\t\ttext-transform: none;\n\t}\n}\n\n// Markup\n.section__modifier,\n.section__markup-content,\n.section__markup-illustrated {\n\tbackground-color: $white;\n\tborder-bottom: 1px solid darken($gray-light, 2%);\n\tborder-top: 1px solid darken($gray-light, 2%);\n\tmargin-bottom: 1em;\n\tpadding: 2em 1.5em;\n\n\t&::after {\n\t\tclear: both;\n\t\tcontent: '';\n\t\tdisplay: table;\n\t}\n}\n\n.section__markup-content,\n.section__modifier-content {\n\n\t> * {\n\t\tmax-width: $container-max-width;\n\t\tmargin: 0 auto;\n\t}\n}\n\n.section__modifier-header {\n\t@include font(14, 19, $font-body, 700);\n\tcolor: $gray-medium;\n\tmargin: 0 0 1rem 0;\n}\n\n.section__modifier-name {\n\tcolor: $brand-primary;\n\ttext-transform: none;\n}\n\n.section__modifier-description {\n\tcolor: darken($gray-medium, 2%);\n\ttext-transform: none;\n}\n\n.section__markup-illustrated {\n\tbackground-color: $gray-lightest;\n\n\tpre {\n\t\toverflow-x: auto;\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// ./client/scss/styleguide.scss","// Common Variables\n\n// Base\n$base-unit: 16; // 16px\n\n// Container\n$container-padding: $base-unit; // 16px\n$container-max-width: 1260 - ($container-padding * 2); // 1228px\n$container-post-body: 620;\n\n// Article Media Widths:\n$media-outset-size: 1020;\n\n// Landing Hero\n$landing-hero-container-width: 1000;\n\n// Spacers\n$spacer: $base-unit; // 16px\n$spacer-vertical-rhythm: 2 * $spacer;\n\n// Columns (@mixin breakpoint)\n$column-width: 64;\n$columns-map: (\n  xl: 20, // 1280px\n  ad: 18.125, //1160px\n  l: 16, // 1024px\n  m: 12, // 768px\n  s: 8, // 512px\n  xs: 8 // 512px and under\n);\n\n// Styleguide\n$styleguide-menu-width: 300;\n\n// Colors\n$black:              #000;\n$white:              #fff;\n$gray-lightest:      #eee;\n$gray-light:         #ddd;\n$gray:               #ccc;\n$gray-medium:        #999;\n$gray-dark:          #333;\n$prb-blue:           #2375BB;\n$prb-gray:           #717073;\n$midnight:           #00467F;\n$ocean:              #218291;\n$seafoam:            #F2FAFC;\n$seafog:             #90B4BC;\n$dust:               #D8D8D8;\n$mist:               #F2FAFC;\n$brand-primary:      $prb-blue;\n$color-anchor:       $brand-primary;\n$prb-darkbg:         #01060A;\n$border-color-dark:  $gray-dark;\n$prb-overlay:        rgba(35, 117, 187, 0.4);\n$prb-borders:        $seafog;\n\n// Color Gradient\n$prb-blend-linear: linear-gradient(to right, #31bfce 0%,#2580be 100%);\n$prb-blend-diagonal: linear-gradient(135deg, #31bfce 0%,#2580be 100%);\n\n// Typography\n$font-sans:      'Source Sans Pro', sans-serif; // 400 Reg/Italic 600;\n$font-serif:     'Alegreya', serif; // 400 Reg\n$font-condensed: 'Roboto Condensed', sans-serif; // 400 Reg 700 Italic;\n$font-body:      $font-sans;\n$font-header:    $font-condensed;\n$font-title:     $font-condensed;\n$font-label:     $font-condensed;\n\n// Lost Vars\n// @ref - http://lostgrid.org/docs.html#global-grid-settings\n@lost flexbox flex;\n@lost gutter #{$base-unit}px;\n\n$post-list-border: 1px solid $white;\n$search-field-height: 96;\n\n// Used as a catalogue of global-scope z-indices to ensure that\n// no element overlaps another element unintentionally.\n$indices: sitenav,\n  pageoverlay,\n  search,\n  pushnav;\n\n\n\n// WEBPACK FOOTER //\n// ./~/prb-style-library/variables.scss"],"sourceRoot":""}