/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
WARNING - this .css file has been generated using the Scss precompiler. DO NOT modify this file directly!! Instead, you
should write and compile your changes using the .scss files. If you do not know how to do this, consider writing any
custom CSS rules in the style.css file, contained within your themes directory.
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= */
/* line 64, ../../../pdsfw/library/scss/core-mixins/animate/animate.scss */
body {
  -webkit-backface-visibility: hidden; }

/**
 * Wraps any styles in a retina media query.
 */
/**
 * Wraps any styles in a retina media query.
 */
/**
 * Option variable to define the spacing between images in the generated sprite
 */
/**
 * A mixin to create retina sprites with hover & active states
 *
 * You have to register a pair of sprites using `{@link #retina-sprite-add}` and then you can use this mixin:
 * 
 *     @include retina-sprite-add(icons, "icons/*.png", "icons-retina/*.png");
 *
 *     .my-icon {
 *       @include retina-sprite(icon-name, icons);
 *     }
 * 
 * @param {String} $name
 * @param {String} [$sprite-name]
 * @param {Boolean} [$hover=false]
 * @param {Boolean} [$active=false]
 */
/**
 * @param {String} $name
 * @param {String} $path
 * @param {String} $path2x
 */
/**
 * Wraps any styles in a retina media query.
 */
/**
 * Mixin for retina backgrounds where you can't use a sprite.
 * 
 * - Make sure you have a file@2x.png file additional to your file.png.
 * - The mixin prepends $imgPath, which should be set globally at some point. Default is: "img/"
 *
 * Examples:
 *     li {
 *       @include retina-background(arrow, no-repeat 10px 15px)
 *     }
 *     
 *     a.external {
 *       @include retina-background(external, no-repeat right)
 *     }
 * 
 * @param {String} $file Path to file relative to images folder defined in config.rb and without a file extension
 * @param {Object} [$attr] Additional attributes like position or repetition. E.g. `no-repeat top right`
 * @param {String} [$type] The file type.
 */
/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
WARNING - this .css file has been generated using the Scss precompiler. DO NOT modify this file directly!! Instead, you
should write and compile your changes using the .scss files. If you do not know how to do this, consider writing any
custom CSS rules in the style.css file, contained within your themes directory.
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= */
/* line 14, ../scss/header.scss */
.pdsfw-header-row {
  text-align: center;
  background-color: white;
  padding: 1em 0; }
  /* line 18, ../scss/header.scss */
  .pdsfw-header-row h1, .pdsfw-header-row h3 {
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    *zoom: 1;
    *display: inline;
    margin: 16px 0 0 !important;
    height: 80px; }
  /* line 23, ../scss/header.scss */
  .pdsfw-header-row .bt-logo {
    display: inline-block;
    background-image: url('../images/sprites-retina/global/1x-se79224f0f4.png');
    background-position: 0 -214px;
    background-repeat: no-repeat;
    height: 80px;
    width: 136px;
    /**
     * Option variable to turn on/off IE8 support.
     *
     * This requires Modernizr's test for `css-mediaqueries` and RespondJS
     *
     * Set to `1` to turn on support.
     */ }
    @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3 / 2), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
      /* line 23, ../scss/header.scss */
      .pdsfw-header-row .bt-logo {
        background-image: url('../images/sprites-retina/global/2x-s81c16f7c00.png');
        -moz-background-size: 136px auto;
        -o-background-size: 136px auto;
        -webkit-background-size: 136px auto;
        background-size: 136px auto;
        background-position: 0 -214px; } }
  /* line 27, ../scss/header.scss */
  .pdsfw-header-row .quote-wrap {
    margin-top: 1em; }
  /* line 30, ../scss/header.scss */
  .pdsfw-header-row .quote {
    font-size: 1.17647em;
    line-height: 1.4em;
    color: black; }
  @media (min-width: 48em) {
    /* line 14, ../scss/header.scss */
    .pdsfw-header-row {
      text-align: start; }
      /* line 36, ../scss/header.scss */
      .pdsfw-header-row h1, .pdsfw-header-row h3 {
        margin: 0 !important; }
      /* line 37, ../scss/header.scss */
      .pdsfw-header-row .grid-container {
        position: relative; }
      /* line 38, ../scss/header.scss */
      .pdsfw-header-row .quote-wrap {
        margin-top: 0;
        position: absolute;
        top: 0;
        right: 1em;
        height: 100%;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        *zoom: 1;
        *display: inline; }
      /* line 46, ../scss/header.scss */
      .pdsfw-header-row .quote {
        float: right; } }

/* line 51, ../scss/header.scss */
.bt-page-title-image {
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center;
  height: 260px;
  text-align: center;
  color: white;
  font-family: HelloILikeYou-Regular, "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif normal normal;
  padding: 0 1em; }
  /* line 60, ../scss/header.scss */
  .bt-page-title-image h1, .bt-page-title-image h3 {
    font-size: 1.64706em;
    line-height: 1.25em;
    margin: 0;
    position: relative;
    top: -0.25em; }
    @media (min-width: 48em) {
      /* line 60, ../scss/header.scss */
      .bt-page-title-image h1, .bt-page-title-image h3 {
        font-size: 2.64706em;
        line-height: 1.08889em; } }

/*# sourceMappingURL=header.css.map */
