@charset "UTF-8";
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0; }

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic; }

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0; }

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden; }

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0; }

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto; }

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal; }

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  /* 2 */
  box-sizing: content-box; }

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto; }

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold; }

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

/*
    Quantcast Colors

    Author: Quantcast UX / Jonathan Smiley
    Email: jsmiley@quantcast.com

    Description: This file contains global colors used
    throughout Quantcast apps. This is stored as a Sass
    Map and colors can be called with:

    map-get($qc-color, [colorname])

*/
/*
	Quantcast Global Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains global styles
	that are applied to all pages and apps at QC.

*/
/*

	Quantcast Z-Index Reference

	Due to the Callahan layered approach to the UI it's important
	to maintain a consistent z-index scheme.

	1	- Base UI Level
	2	– Page Location Controls

	20

	30

	40  - Mini Sheets (Tooltips)

	50	- Panel Mask
	51	- App Nav
		- Masthead
		- Explore Panel
	52	- Panels

	60

	70	- Sheet Mask
	71	- Sheets
	72	- Side Flyout Mask
	73	- Side Flyouts (Filters)
	74	- Side Flyouts Second Level

	80	- Flyout Nav

	90

	100	- Max UI Level

*/
/* Global Variables */
/* Media Query Variables */
* {
  box-sizing: border-box; }

body {
  font-family: "proxima-nova", "Helvetica Neue", Arial, sans-serif;
  background: rgba(33, 41, 52, 0.02); }
  body.mask-on {
    overflow: hidden; }

#quantcast-page {
  font-family: "proxima-nova", "Helvetica Neue", Arial, sans-serif; }

img {
  width: 100%;
  max-width: 100%;
  display: block; }

.is-firefox img {
  width: 100%; }

hr {
  margin: 20px 0;
  padding: 0;
  border: none;
  border-top: 1px solid rgba(33, 41, 52, 0.1); }

#mask {
  position: fixed;
  z-index: 0;
  height: 0;
  top: 0;
  left: 0;
  background: transparent;
  -webkit-transition: background 0.25s linear;
          transition: background 0.25s linear;
  will-change: background, opacity;
  cursor: pointer; }
  #mask.for-panel {
    z-index: 50;
    background: rgba(33, 41, 52, 0.5);
    height: 100vh;
    width: 100vw; }
    #mask.for-panel:hover {
      background: rgba(33, 41, 52, 0.4); }
  #mask.for-sheet {
    z-index: 70;
    background: rgba(33, 41, 52, 0.5);
    height: 100vh;
    width: 100vw; }
    #mask.for-sheet:hover {
      background: rgba(33, 41, 52, 0.4); }
  #mask.for-side {
    z-index: 72;
    background: rgba(33, 41, 52, 0.2);
    height: 100vh;
    width: 100vw; }
    #mask.for-side:hover {
      background: rgba(33, 41, 52, 0.1); }

a[data-qc-scrolltop] {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background: #212934;
  text-indent: -9999px;
  position: fixed;
  bottom: 30px;
  left: 50%;
  z-index: 99;
  margin-left: -15px;
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
          transition: all 0.15s ease-out;
  -webkit-transform: translateY(80px);
      -ms-transform: translateY(80px);
          transform: translateY(80px); }
  a[data-qc-scrolltop]:before, a[data-qc-scrolltop]:after {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
    left: 7px;
    top: 10px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff; }
  a[data-qc-scrolltop]:after {
    top: 11px;
    border-bottom-color: #212934; }

a.disabled {
  pointer-events: none;
  cursor: default; }

body.scrolled a[data-qc-scrolltop] {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0); }

.qc-loading {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  height: 80px;
  width: 80px;
  margin-left: -40px;
  margin-top: -40px;
  background: #212934;
  border-radius: 100%;
  -webkit-animation: load-main 3s infinite 1s;
          animation: load-main 3s infinite 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both; }
  .qc-loading:after {
    display: block;
    content: "";
    width: 60px;
    height: 10px;
    position: absolute;
    left: 50%;
    bottom: 0;
    background: #212934;
    -webkit-animation: load-tail 3s infinite 1s;
            animation: load-tail 3s infinite 1s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both; }
  .qc-loading.quick {
    height: 40px;
    width: 40px;
    -webkit-animation: load-quick 6s infinite 1s;
            animation: load-quick 6s infinite 1s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
    .qc-loading.quick:after {
      width: 30px;
      height: 5px;
      -webkit-animation: none;
              animation: none; }

@-webkit-keyframes load-quick {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(2880deg);
            transform: rotate(2880deg); } }

@keyframes load-quick {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(2880deg);
            transform: rotate(2880deg); } }
@-webkit-keyframes load-main {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  10% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2); }
  20% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  80% {
    -webkit-transform: scale(1) rotate(0deg);
            transform: scale(1) rotate(0deg); }
  100% {
    -webkit-transform: scale(0) rotate(720deg);
            transform: scale(0) rotate(720deg); } }
@keyframes load-main {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  10% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2); }
  20% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  80% {
    -webkit-transform: scale(1) rotate(0deg);
            transform: scale(1) rotate(0deg); }
  100% {
    -webkit-transform: scale(0) rotate(720deg);
            transform: scale(0) rotate(720deg); } }
@-webkit-keyframes load-tail {
  0% {
    width: 0; }
  10% {
    width: 0; }
  20% {
    width: 70px; }
  30% {
    width: 60px; }
  80% {
    width: 60px; }
  100% {
    width: 100px; } }
@keyframes load-tail {
  0% {
    width: 0; }
  10% {
    width: 0; }
  20% {
    width: 70px; }
  30% {
    width: 60px; }
  80% {
    width: 60px; }
  100% {
    width: 100px; } }
/*
	Quantcast Typography Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains typgraphy styles
	that are applied globally and overriden as needed.

	* NOTE *
	Overrides should not go in this file under
	any circumstances.
*/
/* Fonts */
@font-face {
  font-family: 'Liberation Mono';
  src: url("../fonts/LiberationMono-Bold-webfont.eot");
  src: url("../fonts/LiberationMono-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/LiberationMono-Bold-webfont.woff") format("woff"), url("../fonts/LiberationMono-Bold-webfont.ttf") format("truetype"), url("../fonts/LiberationMono-Bold-webfont.svg#liberation_monobold") format("svg");
  font-weight: bold;
  font-style: normal; }
@font-face {
  font-family: 'Liberation Mono';
  src: url("../fonts/LiberationMono-Regular-webfont.eot");
  src: url("../fonts/LiberationMono-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/LiberationMono-Regular-webfont.woff") format("woff"), url("../fonts/LiberationMono-Regular-webfont.ttf") format("truetype"), url("../fonts/LiberationMono-Regular-webfont.svg#liberation_monoregular") format("svg");
  font-weight: normal;
  font-style: normal; }
/* Styles */
body {
  font-size: 13px;
  color: #212934; }

h1, h2, h3, h4, h5, h6, p, label {
  position: relative;
  font-family: "proxima-nova", "Helvetica Neue", Arial, Verdana, sans-serif;
  margin: 0;
  padding: 0;
  line-height: 1;
  color: #212934; }
  h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, p small, label small {
    font-size: 100%;
    font-weight: normal; }
  h1.has-actions, h2.has-actions, h3.has-actions, h4.has-actions, h5.has-actions, h6.has-actions, p.has-actions, label.has-actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between; }
    h1.has-actions .group, h2.has-actions .group, h3.has-actions .group, h4.has-actions .group, h5.has-actions .group, h6.has-actions .group, p.has-actions .group, label.has-actions .group {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto;
      font-size: 13px;
      color: rgba(33, 41, 52, 0.6);
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: row nowrap;
          -ms-flex-flow: row nowrap;
              flex-flow: row nowrap;
      -webkit-box-pack: end;
      -webkit-justify-content: flex-end;
          -ms-flex-pack: end;
              justify-content: flex-end;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center; }
      h1.has-actions .group > *, h2.has-actions .group > *, h3.has-actions .group > *, h4.has-actions .group > *, h5.has-actions .group > *, h6.has-actions .group > *, p.has-actions .group > *, label.has-actions .group > * {
        margin-left: 20px; }
      h1.has-actions .group a.secondary, h2.has-actions .group a.secondary, h3.has-actions .group a.secondary, h4.has-actions .group a.secondary, h5.has-actions .group a.secondary, h6.has-actions .group a.secondary, p.has-actions .group a.secondary, label.has-actions .group a.secondary {
        color: #212934;
        font-weight: 600; }
  h1 span.count, h2 span.count, h3 span.count, h4 span.count, h5 span.count, h6 span.count, p span.count, label span.count {
    padding: 4px 10px 2px 10px;
    border: 1px solid rgba(33, 41, 52, 0.2);
    border-radius: 200px;
    opacity: 0.5; }
  h1[data-qc-tooltip], h2[data-qc-tooltip], h3[data-qc-tooltip], h4[data-qc-tooltip], h5[data-qc-tooltip], h6[data-qc-tooltip], p[data-qc-tooltip], label[data-qc-tooltip] {
    display: inline-block; }

a {
  font-family: "proxima-nova", "Helvetica Neue", Arial, Verdana, sans-serif;
  color: #0096c8;
  text-decoration: none; }
  a:hover, a:active, a:visited {
    text-decoration: none; }
  a.simple {
    color: rgba(33, 41, 52, 0.6); }

h1 {
  font-size: 36px;
  font-weight: 600;
  padding: 0 0 15px; }

main h1 {
  padding-bottom: 20px;
  margin-bottom: 20px; }

h2 {
  font-size: 24px;
  font-weight: 300;
  text-transform: uppercase;
  margin: 0 0 20px; }
  h2 small {
    font-size: 13px;
    display: block;
    text-transform: none;
    font-weight: normal;
    padding-top: 8px; }
  h2 .button {
    position: absolute;
    right: 0;
    top: 0; }

h3 {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0 0 20px;
  letter-spacing: 2px; }

h4 {
  font-size: 13px;
  font-weight: 600;
  padding: 0;
  margin: 0 0 3px;
  line-height: 20px; }

h5 {
  font-size: 13px;
  font-weight: 600;
  padding: 0;
  margin: 0 0 10px;
  height: 20px;
  line-height: 20px;
  opacity: 0.45; }

p {
  margin: 0 0 20px;
  padding: 0;
  line-height: 1.2;
  color: rgba(33, 41, 52, 0.5); }

ul, ol, dl {
  margin: 0 0 20px;
  padding: 0;
  color: rgba(33, 41, 52, 0.5); }

ul li, ol li {
  list-style-position: inside; }
ul ul, ul ol, ol ul, ol ol {
  padding-left: 13px; }

dl dt {
  font-weight: 600;
  color: #212934; }
dl dd {
  margin: 0 0 10px;
  padding: 0; }
  dl dd:last-child {
    margin-bottom: 0; }

data {
  font-family: 'Liberation Mono', "proxima-nova", "Helvetica Neue", Arial, Verdana, sans-serif;
  font-weight: 500;
  padding-top: 1px; }

/*
	Quantcast Measure Profile Structure

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: Major structural pieces for the
	Measure 2.0 profile layout.

*/
.filter-bar {
  height: 50px;
  border-bottom: 1px solid rgba(33, 41, 52, 0.2);
  margin: 0 0 30px;
  width: 100%;
  background: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  padding: 0 20px; }
  .filter-bar li {
    display: inline-block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    line-height: 50px;
    height: 50px;
    padding-right: 6px;
    font-weight: 600;
    color: #212934; }
    .filter-bar li:after {
      content: ","; }
    .filter-bar li:last-child:after {
      content: none; }
    .filter-bar li.label {
      font-weight: normal; }
      .filter-bar li.label:after {
        content: none; }
  .filter-bar a {
    opacity: .5; }
    .filter-bar a.active {
      opacity: 1; }

main {
  width: 100%;
  max-width: 1400px;
  min-width: 1024px;
  margin: 0 auto;
  padding: 40px 0 0;
  position: relative;
  min-height: 300px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap; }
  main.narrow {
    width: 720px;
    min-width: 720px;
    max-width: 720px; }
  main #onpageNav, main left-nav-panel {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 220px;
    /* ie fix */
    padding: 0 10px 0 20px; }
  main .content {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    padding: 0 20px 0 15px; }
  main #cards {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    padding: 0 20px 0 15px; }
    main #cards .card {
      margin-bottom: 30px;
      padding: 30px;
      position: relative;
      background: #fff;
      border: 1px solid rgba(33, 41, 52, 0.075);
      border-radius: 3px; }
      main #cards .card .report {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: row nowrap;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap; }
        main #cards .card .report .data {
          -webkit-box-flex: 1;
          -webkit-flex: 1 1 auto;
              -ms-flex: 1 1 auto;
                  flex: 1 1 auto;
          padding: 0 15px 0 0;
          min-height: 150px; }
          main #cards .card .report .data.columns {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-flex-flow: row nowrap;
                -ms-flex-flow: row nowrap;
                    flex-flow: row nowrap; }
            @media only screen and (max-width: 800px) {
              main #cards .card .report .data.columns {
                -webkit-flex-flow: row wrap;
                    -ms-flex-flow: row wrap;
                        flex-flow: row wrap; } }
        main #cards .card .report .card-controls {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          width: 175px;
          /* ie fix */
          padding: 0 0 0 30px; }
  main .side-panel {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 320px;
        -ms-flex: 0 0 320px;
            flex: 0 0 320px;
    padding: 40px 30px;
    margin-top: -40px;
    height: calc(100vh - 60px);
    position: relative;
    background: rgba(33, 41, 52, 0.03); }
  @media only screen and (max-width: 800px) {
    main {
      max-width: auto;
      min-width: 0;
      padding-top: 20px; }
      main #onpageNav, main left-nav-panel {
        display: none; }
      main #cards {
        width: 100%; }
        main #cards .card {
          width: 100%;
          overflow: hidden; }
          main #cards .card a.toggle-controls {
            display: block;
            position: absolute;
            top: 30px;
            right: 30px;
            height: 24px;
            width: 24px;
            background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMXB4IiB2aWV3Qm94PSIwIDAgMjAgMjEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPiAgICAgICAgPHRpdGxlPmVxdWFsaXplcjwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPiAgICAgICAgPGcgaWQ9ImlQaG9uZS02IiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzM1LjAwMDAwMCwgLTYxMi4wMDAwMDApIiBmaWxsPSIjMDAwMDAwIiBvcGFjaXR5PSIwLjMiPiAgICAgICAgICAgIDxnIGlkPSJUcmFmZmljIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4wMDAwMDAsIDYwOS4wMDAwMDApIj4gICAgICAgICAgICAgICAgPGcgaWQ9ImVxdWFsaXplciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzI2LjY2NjY2NywgMTMuODMzMzMzKSByb3RhdGUoLTkwLjAwMDAwMCkgdHJhbnNsYXRlKC0zMjYuNjY2NjY3LCAtMTMuODMzMzMzKSB0cmFuc2xhdGUoMzE2LjE2NjY2NywgMy44MzMzMzMpIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj4gICAgICAgICAgICAgICAgICAgIDxnIGlkPSJQYWdlLTEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEuMDAwMDAwLCAwLjAwMDAwMCkiPiAgICAgICAgICAgICAgICAgICAgICAgIDxnIGlkPSJJY29uLVNldCI+ICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0zLjMzMzMzMzMzLDEzLjMzMzMzMzMgQzIuMjI4NjY2NjcsMTMuMzMzMzMzMyAxLjMzMzMzMzMzLDEyLjQzOCAxLjMzMzMzMzMzLDExLjMzMzMzMzMgQzEuMzMzMzMzMzMsMTAuMjI5MzMzMyAyLjIyODY2NjY3LDkuMzMzMzMzMzMgMy4zMzMzMzMzMyw5LjMzMzMzMzMzIEM0LjQzOCw5LjMzMzMzMzMzIDUuMzMzMzMzMzMsMTAuMjI5MzMzMyA1LjMzMzMzMzMzLDExLjMzMzMzMzMgQzUuMzMzMzMzMzMsMTIuNDM4IDQuNDM4LDEzLjMzMzMzMzMgMy4zMzMzMzMzMywxMy4zMzMzMzMzIEwzLjMzMzMzMzMzLDEzLjMzMzMzMzMgTDMuMzMzMzMzMzMsMTMuMzMzMzMzMyBaIE00LDguMDY3MzMzMzMgTDQsMC42NjY2NjY2NjcgQzQsMC4yOTg2NjY2NjcgMy43MDIsMCAzLjMzMzMzMzMzLDAgQzIuOTY0NjY2NjcsMCAyLjY2NjY2NjY3LDAuMjk4NjY2NjY3IDIuNjY2NjY2NjcsMC42NjY2NjY2NjcgTDIuNjY2NjY2NjcsOC4wNjczMzMzMyBDMS4xNDUzMzMzMyw4LjM3NiAwLDkuNzIwNjY2NjcgMCwxMS4zMzMzMzMzIEMwLDEyLjk0NiAxLjE0NTMzMzMzLDE0LjI5MDY2NjcgMi42NjY2NjY2NywxNC41OTkzMzMzIEwyLjY2NjY2NjY3LDE4IEMyLjY2NjY2NjY3LDE4LjM2ODY2NjcgMi45NjQ2NjY2NywxOC42NjY2NjY3IDMuMzMzMzMzMzMsMTguNjY2NjY2NyBDMy43MDIsMTguNjY2NjY2NyA0LDE4LjM2ODY2NjcgNCwxOCBMNCwxNC41OTkzMzMzIEM1LjUyMTMzMzMzLDE0LjI5MDY2NjcgNi42NjY2NjY2NywxMi45NDYgNi42NjY2NjY2NywxMS4zMzMzMzMzIEM2LjY2NjY2NjY3LDkuNzIwNjY2NjcgNS41MjEzMzMzMyw4LjM3NiA0LDguMDY3MzMzMzMgTDQsOC4wNjczMzMzMyBMNCw4LjA2NzMzMzMzIFogTTEwLDYuNjY2NjY2NjcgQzguODk1MzMzMzMsNi42NjY2NjY2NyA4LDUuNzcxMzMzMzMgOCw0LjY2NjY2NjY3IEM4LDMuNTYyNjY2NjcgOC44OTUzMzMzMywyLjY2NjY2NjY3IDEwLDIuNjY2NjY2NjcgQzExLjEwNDY2NjcsMi42NjY2NjY2NyAxMiwzLjU2MjY2NjY3IDEyLDQuNjY2NjY2NjcgQzEyLDUuNzcxMzMzMzMgMTEuMTA0NjY2Nyw2LjY2NjY2NjY3IDEwLDYuNjY2NjY2NjcgTDEwLDYuNjY2NjY2NjcgTDEwLDYuNjY2NjY2NjcgWiBNMTAuNjY2NjY2NywxLjQwMDY2NjY3IEwxMC42NjY2NjY3LDAuNjY2NjY2NjY3IEMxMC42NjY2NjY3LDAuMjk4NjY2NjY3IDEwLjM2ODY2NjcsMCAxMCwwIEM5LjYzMTMzMzMzLDAgOS4zMzMzMzMzMywwLjI5ODY2NjY2NyA5LjMzMzMzMzMzLDAuNjY2NjY2NjY3IEw5LjMzMzMzMzMzLDEuNDAwNjY2NjcgQzcuODEyLDEuNzA5MzMzMzMgNi42NjY2NjY2NywzLjA1NCA2LjY2NjY2NjY3LDQuNjY2NjY2NjcgQzYuNjY2NjY2NjcsNi4yNzkzMzMzMyA3LjgxMiw3LjYyNCA5LjMzMzMzMzMzLDcuOTMyNjY2NjcgTDkuMzMzMzMzMzMsMTggQzkuMzMzMzMzMzMsMTguMzY4NjY2NyA5LjYzMTMzMzMzLDE4LjY2NjY2NjcgMTAsMTguNjY2NjY2NyBDMTAuMzY4NjY2NywxOC42NjY2NjY3IDEwLjY2NjY2NjcsMTguMzY4NjY2NyAxMC42NjY2NjY3LDE4IEwxMC42NjY2NjY3LDcuOTMyNjY2NjcgQzEyLjE4OCw3LjYyNCAxMy4zMzMzMzMzLDYuMjc5MzMzMzMgMTMuMzMzMzMzMyw0LjY2NjY2NjY3IEMxMy4zMzMzMzMzLDMuMDU0IDEyLjE4OCwxLjcwOTMzMzMzIDEwLjY2NjY2NjcsMS40MDA2NjY2NyBMMTAuNjY2NjY2NywxLjQwMDY2NjY3IEwxMC42NjY2NjY3LDEuNDAwNjY2NjcgWiBNMTYuNjY2NjY2NywxNiBDMTUuNTYyLDE2IDE0LjY2NjY2NjcsMTUuMTA0NjY2NyAxNC42NjY2NjY3LDE0IEMxNC42NjY2NjY3LDEyLjg5NiAxNS41NjIsMTIgMTYuNjY2NjY2NywxMiBDMTcuNzcxMzMzMywxMiAxOC42NjY2NjY3LDEyLjg5NiAxOC42NjY2NjY3LDE0IEMxOC42NjY2NjY3LDE1LjEwNDY2NjcgMTcuNzcxMzMzMywxNiAxNi42NjY2NjY3LDE2IEwxNi42NjY2NjY3LDE2IEwxNi42NjY2NjY3LDE2IFogTTE3LjMzMzMzMzMsMTAuNzM0IEwxNy4zMzMzMzMzLDAuNjY2NjY2NjY3IEMxNy4zMzMzMzMzLDAuMjk4NjY2NjY3IDE3LjAzNTMzMzMsMCAxNi42NjY2NjY3LDAgQzE2LjI5OCwwIDE2LDAuMjk4NjY2NjY3IDE2LDAuNjY2NjY2NjY3IEwxNiwxMC43MzQgQzE0LjQ3ODY2NjcsMTEuMDQyNjY2NyAxMy4zMzMzMzMzLDEyLjM4NzMzMzMgMTMuMzMzMzMzMywxNCBDMTMuMzMzMzMzMywxNS42MTI2NjY3IDE0LjQ3ODY2NjcsMTYuOTU3MzMzMyAxNiwxNy4yNjYgTDE2LDE4IEMxNiwxOC4zNjg2NjY3IDE2LjI5OCwxOC42NjY2NjY3IDE2LjY2NjY2NjcsMTguNjY2NjY2NyBDMTcuMDM1MzMzMywxOC42NjY2NjY3IDE3LjMzMzMzMzMsMTguMzY4NjY2NyAxNy4zMzMzMzMzLDE4IEwxNy4zMzMzMzMzLDE3LjI2NiBDMTguODU0NjY2NywxNi45NTczMzMzIDIwLDE1LjYxMjY2NjcgMjAsMTQgQzIwLDEyLjM4NzMzMzMgMTguODU0NjY2NywxMS4wNDI2NjY3IDE3LjMzMzMzMzMsMTAuNzM0IEwxNy4zMzMzMzMzLDEwLjczNCBMMTcuMzMzMzMzMywxMC43MzQgWiIgaWQ9ImVxdWFsaXplciI+PC9wYXRoPiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4gICAgICAgICAgICAgICAgICAgIDwvZz4gICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgIDwvZz4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==);
            background-size: 80% 80%;
            background-position: center center;
            background-repeat: no-repeat;
            border-radius: 2px; }
          main #cards .card.show-controls .report {
            -webkit-transform: translateX(-210px);
                -ms-transform: translateX(-210px);
                    transform: translateX(-210px); }
          main #cards .card.show-controls a.toggle-controls {
            background-color: #212934;
            background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMTlweCIgaGVpZ2h0PSIyMXB4IiB2aWV3Qm94PSIwIDAgMTkgMjEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPiAgICAgICAgPHRpdGxlPmVxdWFsaXplcjwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPiAgICAgICAgPGcgaWQ9ImlQaG9uZS02IiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTQ2LjAwMDAwMCwgLTYxMS4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj4gICAgICAgICAgICA8ZyBpZD0iR3JvdXAtQ29weSIgc2tldGNoOnR5cGU9Ik1TTGF5ZXJHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTE3MS4wMDAwMDAsIDYwOC4wMDAwMDApIj4gICAgICAgICAgICAgICAgPHBhdGggZD0iTTMyMCwxNy42NjY2NjY3IEMzMTguODk1MzMzLDE3LjY2NjY2NjcgMzE4LDE2Ljc3MTMzMzMgMzE4LDE1LjY2NjY2NjcgQzMxOCwxNC41NjI2NjY3IDMxOC44OTUzMzMsMTMuNjY2NjY2NyAzMjAsMTMuNjY2NjY2NyBDMzIxLjEwNDY2NywxMy42NjY2NjY3IDMyMiwxNC41NjI2NjY3IDMyMiwxNS42NjY2NjY3IEMzMjIsMTYuNzcxMzMzMyAzMjEuMTA0NjY3LDE3LjY2NjY2NjcgMzIwLDE3LjY2NjY2NjcgTDMyMCwxNy42NjY2NjY3IEwzMjAsMTcuNjY2NjY2NyBaIE0zMjAuNjY2NjY3LDEyLjQwMDY2NjcgTDMyMC42NjY2NjcsNSBDMzIwLjY2NjY2Nyw0LjYzMiAzMjAuMzY4NjY3LDQuMzMzMzMzMzMgMzIwLDQuMzMzMzMzMzMgQzMxOS42MzEzMzMsNC4zMzMzMzMzMyAzMTkuMzMzMzMzLDQuNjMyIDMxOS4zMzMzMzMsNSBMMzE5LjMzMzMzMywxMi40MDA2NjY3IEMzMTcuODEyLDEyLjcwOTMzMzMgMzE2LjY2NjY2NywxNC4wNTQgMzE2LjY2NjY2NywxNS42NjY2NjY3IEMzMTYuNjY2NjY3LDE3LjI3OTMzMzMgMzE3LjgxMiwxOC42MjQgMzE5LjMzMzMzMywxOC45MzI2NjY3IEwzMTkuMzMzMzMzLDIyLjMzMzMzMzMgQzMxOS4zMzMzMzMsMjIuNzAyIDMxOS42MzEzMzMsMjMgMzIwLDIzIEMzMjAuMzY4NjY3LDIzIDMyMC42NjY2NjcsMjIuNzAyIDMyMC42NjY2NjcsMjIuMzMzMzMzMyBMMzIwLjY2NjY2NywxOC45MzI2NjY3IEMzMjIuMTg4LDE4LjYyNCAzMjMuMzMzMzMzLDE3LjI3OTMzMzMgMzIzLjMzMzMzMywxNS42NjY2NjY3IEMzMjMuMzMzMzMzLDE0LjA1NCAzMjIuMTg4LDEyLjcwOTMzMzMgMzIwLjY2NjY2NywxMi40MDA2NjY3IEwzMjAuNjY2NjY3LDEyLjQwMDY2NjcgTDMyMC42NjY2NjcsMTIuNDAwNjY2NyBaIE0zMjYuNjY2NjY3LDExIEMzMjUuNTYyLDExIDMyNC42NjY2NjcsMTAuMTA0NjY2NyAzMjQuNjY2NjY3LDkgQzMyNC42NjY2NjcsNy44OTYgMzI1LjU2Miw3IDMyNi42NjY2NjcsNyBDMzI3Ljc3MTMzMyw3IDMyOC42NjY2NjcsNy44OTYgMzI4LjY2NjY2Nyw5IEMzMjguNjY2NjY3LDEwLjEwNDY2NjcgMzI3Ljc3MTMzMywxMSAzMjYuNjY2NjY3LDExIEwzMjYuNjY2NjY3LDExIEwzMjYuNjY2NjY3LDExIFogTTMyNy4zMzMzMzMsNS43MzQgTDMyNy4zMzMzMzMsNSBDMzI3LjMzMzMzMyw0LjYzMiAzMjcuMDM1MzMzLDQuMzMzMzMzMzMgMzI2LjY2NjY2Nyw0LjMzMzMzMzMzIEMzMjYuMjk4LDQuMzMzMzMzMzMgMzI2LDQuNjMyIDMyNiw1IEwzMjYsNS43MzQgQzMyNC40Nzg2NjcsNi4wNDI2NjY2NyAzMjMuMzMzMzMzLDcuMzg3MzMzMzMgMzIzLjMzMzMzMyw5IEMzMjMuMzMzMzMzLDEwLjYxMjY2NjcgMzI0LjQ3ODY2NywxMS45NTczMzMzIDMyNiwxMi4yNjYgTDMyNiwyMi4zMzMzMzMzIEMzMjYsMjIuNzAyIDMyNi4yOTgsMjMgMzI2LjY2NjY2NywyMyBDMzI3LjAzNTMzMywyMyAzMjcuMzMzMzMzLDIyLjcwMiAzMjcuMzMzMzMzLDIyLjMzMzMzMzMgTDMyNy4zMzMzMzMsMTIuMjY2IEMzMjguODU0NjY3LDExLjk1NzMzMzMgMzMwLDEwLjYxMjY2NjcgMzMwLDkgQzMzMCw3LjM4NzMzMzMzIDMyOC44NTQ2NjcsNi4wNDI2NjY2NyAzMjcuMzMzMzMzLDUuNzM0IEwzMjcuMzMzMzMzLDUuNzM0IEwzMjcuMzMzMzMzLDUuNzM0IFogTTMzMy4zMzMzMzMsMjAuMzMzMzMzMyBDMzMyLjIyODY2NywyMC4zMzMzMzMzIDMzMS4zMzMzMzMsMTkuNDM4IDMzMS4zMzMzMzMsMTguMzMzMzMzMyBDMzMxLjMzMzMzMywxNy4yMjkzMzMzIDMzMi4yMjg2NjcsMTYuMzMzMzMzMyAzMzMuMzMzMzMzLDE2LjMzMzMzMzMgQzMzNC40MzgsMTYuMzMzMzMzMyAzMzUuMzMzMzMzLDE3LjIyOTMzMzMgMzM1LjMzMzMzMywxOC4zMzMzMzMzIEMzMzUuMzMzMzMzLDE5LjQzOCAzMzQuNDM4LDIwLjMzMzMzMzMgMzMzLjMzMzMzMywyMC4zMzMzMzMzIEwzMzMuMzMzMzMzLDIwLjMzMzMzMzMgTDMzMy4zMzMzMzMsMjAuMzMzMzMzMyBaIE0zMzQsMTUuMDY3MzMzMyBMMzM0LDUgQzMzNCw0LjYzMiAzMzMuNzAyLDQuMzMzMzMzMzMgMzMzLjMzMzMzMyw0LjMzMzMzMzMzIEMzMzIuOTY0NjY3LDQuMzMzMzMzMzMgMzMyLjY2NjY2Nyw0LjYzMiAzMzIuNjY2NjY3LDUgTDMzMi42NjY2NjcsMTUuMDY3MzMzMyBDMzMxLjE0NTMzMywxNS4zNzYgMzMwLDE2LjcyMDY2NjcgMzMwLDE4LjMzMzMzMzMgQzMzMCwxOS45NDYgMzMxLjE0NTMzMywyMS4yOTA2NjY3IDMzMi42NjY2NjcsMjEuNTk5MzMzMyBMMzMyLjY2NjY2NywyMi4zMzMzMzMzIEMzMzIuNjY2NjY3LDIyLjcwMiAzMzIuOTY0NjY3LDIzIDMzMy4zMzMzMzMsMjMgQzMzMy43MDIsMjMgMzM0LDIyLjcwMiAzMzQsMjIuMzMzMzMzMyBMMzM0LDIxLjU5OTMzMzMgQzMzNS41MjEzMzMsMjEuMjkwNjY2NyAzMzYuNjY2NjY3LDE5Ljk0NiAzMzYuNjY2NjY3LDE4LjMzMzMzMzMgQzMzNi42NjY2NjcsMTYuNzIwNjY2NyAzMzUuNTIxMzMzLDE1LjM3NiAzMzQsMTUuMDY3MzMzMyBMMzM0LDE1LjA2NzMzMzMgTDMzNCwxNS4wNjczMzMzIFoiIGlkPSJlcXVhbGl6ZXIiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyNi42NjY2NjcsIDEzLjY2NjY2Nykgcm90YXRlKC05MC4wMDAwMDApIHRyYW5zbGF0ZSgtMzI2LjY2NjY2NywgLTEzLjY2NjY2NykgIj48L3BhdGg+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+); }
          main #cards .card .report {
            overflow: hidden;
            -webkit-transition: -webkit-transform 0.15s ease;
                    transition: transform 0.15s ease;
            width: calc(100% + 215px); }
            main #cards .card .report .card-controls {
              -webkit-box-flex: 0;
              -webkit-flex: 0 0 195px;
                  -ms-flex: 0 0 195px;
                      flex: 0 0 195px;
              width: 195px;
              padding-left: 35px; }
            main #cards .card .report .data {
              -webkit-box-flex: 0;
              -webkit-flex: 0 0 calc(100vw - 80px);
                  -ms-flex: 0 0 calc(100vw - 80px);
                      flex: 0 0 calc(100vw - 80px); } }

/*
	Quantcast Grid Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains global styles
	that are available when a grid layout is expedient.

*/
/*

	Quantcast Grid Reference

	This is a twelve column grid which supports nesting and can be placed inside any container.
	It has no max-width and will assume the width of its container at all times. The syntax is
	built out of two units, a .grid element and a .block element.

	Simple Example
	==============

	<div class="grid">  - This opens up a grid row (basically a row though it doesn't have to be)
		<div class="four block">One Third</div>  – Since this is four out of twelve, 4/12, it's 1/3 of the row
		<div class="four block">One Third</div>
		<div class="four block">One Third</div>
	</div>

	Nested Example
	==============

	<div class="grid">
		<div class="six block">
			<div class="grid">
				<div class="eight block">Two Thirds</div>
				<div class="four block">One Thirds</div>
			</div>
		</div>
		<div class="six block">
			The Other half
		</div>
	</div>
	

*/
* {
  box-sizing: border-box; }

.grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  margin: 0 -15px 30px;
  padding: 0;
  width: auto;
  max-width: 1200px; }
  .grid.end {
    margin-bottom: 0; }
  .grid.small {
    max-width: 550px; }
  .grid .block {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    padding: 0 15px;
    margin: 0; }
    .grid .block.one {
      -webkit-flex-basis: 8.33333%;
          -ms-flex-preferred-size: 8.33333%;
              flex-basis: 8.33333%; }
    .grid .block.two {
      -webkit-flex-basis: 16.66667%;
          -ms-flex-preferred-size: 16.66667%;
              flex-basis: 16.66667%; }
    .grid .block.three {
      -webkit-flex-basis: 25%;
          -ms-flex-preferred-size: 25%;
              flex-basis: 25%; }
    .grid .block.four {
      -webkit-flex-basis: 33.33333%;
          -ms-flex-preferred-size: 33.33333%;
              flex-basis: 33.33333%; }
    .grid .block.five {
      -webkit-flex-basis: 41.66667%;
          -ms-flex-preferred-size: 41.66667%;
              flex-basis: 41.66667%; }
    .grid .block.six {
      -webkit-flex-basis: 50%;
          -ms-flex-preferred-size: 50%;
              flex-basis: 50%; }
    .grid .block.seven {
      -webkit-flex-basis: 58.33333%;
          -ms-flex-preferred-size: 58.33333%;
              flex-basis: 58.33333%; }
    .grid .block.eight {
      -webkit-flex-basis: 66.66667%;
          -ms-flex-preferred-size: 66.66667%;
              flex-basis: 66.66667%; }
    .grid .block.nine {
      -webkit-flex-basis: 75%;
          -ms-flex-preferred-size: 75%;
              flex-basis: 75%; }
    .grid .block.ten {
      -webkit-flex-basis: 83.33333%;
          -ms-flex-preferred-size: 83.33333%;
              flex-basis: 83.33333%; }
    .grid .block.eleven {
      -webkit-flex-basis: 91.66667%;
          -ms-flex-preferred-size: 91.66667%;
              flex-basis: 91.66667%; }
    .grid .block.twelve {
      -webkit-flex-basis: 100%;
          -ms-flex-preferred-size: 100%;
              flex-basis: 100%; }
    .grid .block > *:last-child {
      margin-bottom: 0; }
  .grid .divider {
    -webkit-flex-basis: 0px;
        -ms-flex-preferred-size: 0px;
            flex-basis: 0px;
    border-left: 1px solid #212934;
    opacity: 0.2;
    margin: 0 20px; }
  @media only screen and (max-width: 800px) {
    .grid {
      -webkit-flex-flow: column nowrap;
          -ms-flex-flow: column nowrap;
              flex-flow: column nowrap;
      margin: 0 0; }
      .grid .block {
        padding: 0;
        margin: 0 0 30px; }
        .grid .block.one, .grid .block.two, .grid .block.three, .grid .block.four, .grid .block.five, .grid .block.six, .grid .block.seven, .grid .block.eight, .grid .block.nine, .grid .block.ten, .grid .block.eleven, .grid .block.twelve {
          -webkit-flex-basis: auto;
              -ms-flex-preferred-size: auto;
                  flex-basis: auto; } }

.grid-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px; }
  .grid-container.small {
    max-width: 550px; }

/*
	Quantcast Button Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the
	global QC Masthead nav. This nav is used throughout
	all QC apps and the QC marketing site.

*/
.button {
  display: inline-block;
  position: relative;
  height: 36px;
  width: auto;
  margin: 0;
  padding: 0 13px;
  line-height: 36px;
  letter-spacing: 2px;
  cursor: pointer;
  font-size: 13px;
  font-family: "Proxima Nova", Helvetica, Arial, sans-serif;
  font-weight: 600;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 2px;
  border: 1px solid #0096c8;
  border-radius: 3px;
  color: #0096c8;
  background: #fff;
  -webkit-transition: all 0.15s linear;
          transition: all 0.15s linear;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 100%; }
  .button:hover {
    border-color: #007095;
    color: #007095;
    background: rgba(0, 150, 200, 0.05);
    text-decoration: none; }
  .button.open-sheet {
    padding-right: 46px; }
    .button.open-sheet:hover {
      cursor: pointer; }
    .button.open-sheet:after {
      content: "";
      display: block;
      position: absolute;
      height: 18px;
      width: 20px;
      right: 13px;
      top: 8px;
      border-radius: 3px;
      background: url(../images/buttons/up-arrow.svg) 3px 5px no-repeat #0096c8;
      background-size: 14px 8px; }
  .button.has-icon {
    padding-left: 33px; }
    .button.has-icon:after {
      content: "";
      display: block;
      position: absolute;
      height: 13px;
      width: 13px;
      left: 13px;
      top: 7px;
      border-radius: 3px; }
    .button.has-icon.delete:after {
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiDQoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSItMjA5NCAxNzk0IDEzIDEzIg0KCSBlbmFibGUtYmFja2dyb3VuZD0ibmV3IC0yMDk0IDE3OTQgMTMgMTMiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHRpdGxlPnRyYXNoIGNvcHkgNzwvdGl0bGU+DQo8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCjxnIGlkPSJBZGQtQ3JlYXRpdmVzIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4NCgk8ZyBpZD0iQWNjb3JkaW9uLS0tU3RhbmRhcmQtRmlsbGVkLU91dCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTMxOC4wMDAwMDAsIC00NDcuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TQXJ0Ym9hcmRHcm91cCI+DQoJCTxnIGlkPSJTdGFuZGFyZC1BY2NvcmRpb24tQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjAuMDAwMDAwLCAzNjMuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TTGF5ZXJHcm91cCI+DQoJCQk8ZyBpZD0iRGVsZXRlLUJ1dHRvbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjg1LjAwMDAwMCwgNzcuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+DQoJCQkJPHBhdGggaWQ9InRyYXNoLWNvcHktNyIgZmlsbD0iIzIxMjkzNCIgZmlsbC1vcGFjaXR5PSIwLjYiIGQ9Ik0tMjA3MC40LDE4MDQuMmgtOC4xYy0wLjIsMC0wLjQtMC4yLTAuNC0wLjQNCgkJCQkJYzAtMC4yLDAuMi0wLjQsMC40LTAuNGg4LjFjMC4yLDAsMC40LDAuMiwwLjQsMC40Qy0yMDcwLDE4MDQuMS0yMDcwLjIsMTgwNC4yLTIwNzAuNCwxODA0LjJMLTIwNzAuNCwxODA0LjJMLTIwNzAuNCwxODA0LjJ6DQoJCQkJCSBNLTIwNzAuOCwxODEyLjRjMCwwLjQtMC40LDAuOC0wLjgsMC44aC01LjdjLTAuNCwwLTAuOC0wLjQtMC44LTAuOHYtNy4zaDcuM1YxODEyLjRMLTIwNzAuOCwxODEyLjR6IE0tMjA3NS43LDE4MDIuMg0KCQkJCQljMC0wLjIsMC4yLTAuNCwwLjQtMC40aDEuNmMwLjIsMCwwLjQsMC4yLDAuNCwwLjR2MC40aC0yLjRWMTgwMi4yTC0yMDc1LjcsMTgwMi4yeiBNLTIwNzAsMTgwMi42aC0yLjR2LTAuOA0KCQkJCQljMC0wLjQtMC40LTAuOC0wLjgtMC44aC0yLjRjLTAuNCwwLTAuOCwwLjQtMC44LDAuOHYwLjhoLTIuNGMtMC40LDAtMC44LDAuNC0wLjgsMC44djAuOGMwLDAuNCwwLjQsMC44LDAuOCwwLjh2Ny4zDQoJCQkJCWMwLDAuOSwwLjcsMS42LDEuNiwxLjZoNS43YzAuOSwwLDEuNi0wLjcsMS42LTEuNnYtNy4zYzAuNCwwLDAuOC0wLjQsMC44LTAuOHYtMC44Qy0yMDY5LjIsMTgwMy0yMDY5LjYsMTgwMi42LTIwNzAsMTgwMi42DQoJCQkJCUwtMjA3MCwxODAyLjZMLTIwNzAsMTgwMi42eiBNLTIwNzQuNSwxODEyLjRjMC4yLDAsMC40LTAuMiwwLjQtMC40di00LjljMC0wLjItMC4yLTAuNC0wLjQtMC40Yy0wLjIsMC0wLjQsMC4yLTAuNCwwLjR2NC45DQoJCQkJCUMtMjA3NC45LDE4MTIuMi0yMDc0LjcsMTgxMi40LTIwNzQuNSwxODEyLjRMLTIwNzQuNSwxODEyLjRMLTIwNzQuNSwxODEyLjR6IE0tMjA3Ni41LDE4MTIuNGMwLjIsMCwwLjQtMC4yLDAuNC0wLjR2LTQuOQ0KCQkJCQljMC0wLjItMC4yLTAuNC0wLjQtMC40Yy0wLjIsMC0wLjQsMC4yLTAuNCwwLjR2NC45Qy0yMDc2LjksMTgxMi4yLTIwNzYuOCwxODEyLjQtMjA3Ni41LDE4MTIuNEwtMjA3Ni41LDE4MTIuNEwtMjA3Ni41LDE4MTIuNHoNCgkJCQkJIE0tMjA3Mi41LDE4MTIuNGMwLjIsMCwwLjQtMC4yLDAuNC0wLjR2LTQuOWMwLTAuMi0wLjItMC40LTAuNC0wLjRjLTAuMiwwLTAuNCwwLjItMC40LDAuNHY0LjkNCgkJCQkJQy0yMDcyLjksMTgxMi4yLTIwNzIuNywxODEyLjQtMjA3Mi41LDE4MTIuNEwtMjA3Mi41LDE4MTIuNEwtMjA3Mi41LDE4MTIuNHoiLz4NCgkJCTwvZz4NCgkJPC9nPg0KCTwvZz4NCjwvZz4NCjwvc3ZnPg0K); }
    .button.has-icon.remove:after {
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiDQoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSItMjA5MiAxNzkzIDEzIDEzIg0KCSBlbmFibGUtYmFja2dyb3VuZD0ibmV3IC0yMDkyIDE3OTMgMTMgMTMiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHRpdGxlPm1pbnVzLWNpcmNsZTwvdGl0bGU+DQo8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCjxnIGlkPSJGbGlnaHQtQXNzaWdubWVudCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+DQoJDQoJCTxnIGlkPSJGbGlnaHQtQXNzaWdubWVudC0tLUNyZWF0aXZlcy1TZWxlY3RlZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQxNS4wMDAwMDAsIC01MDkuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TQXJ0Ym9hcmRHcm91cCIgb3BhY2l0eT0iMC42Ij4NCgkJPGcgaWQ9IkZsaWdodC1IZWFkaW5nLS0tSUFCLUNvcHkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwLjAwMDAwMCwgMzUwLjAwMDAwMCkiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiPg0KCQkJPGcgaWQ9IkJ0bi4tUmVtb3ZlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzODMuMDAwMDAwLCAxNTQuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+DQoJCQkJPHBhdGggaWQ9Im1pbnVzLWNpcmNsZSIgZmlsbD0iIzIxMjkzNCIgZD0iTS0yMDczLjUsMTgxMC4yYy0zLjEsMC01LjctMi41LTUuNy01LjdzMi41LTUuNyw1LjctNS43czUuNywyLjUsNS43LDUuNw0KCQkJCQlTLTIwNzAuNCwxODEwLjItMjA3My41LDE4MTAuMkwtMjA3My41LDE4MTAuMkwtMjA3My41LDE4MTAuMnogTS0yMDczLjUsMTc5OGMtMy42LDAtNi41LDIuOS02LjUsNi41czIuOSw2LjUsNi41LDYuNQ0KCQkJCQlzNi41LTIuOSw2LjUtNi41Uy0yMDY5LjksMTc5OC0yMDczLjUsMTc5OEwtMjA3My41LDE3OThMLTIwNzMuNSwxNzk4eiBNLTIwNzEuMSwxODA0LjFoLTQuOWMtMC4yLDAtMC40LDAuMi0wLjQsMC40DQoJCQkJCXMwLjIsMC40LDAuNCwwLjRoNC45YzAuMiwwLDAuNC0wLjIsMC40LTAuNFMtMjA3MC44LDE4MDQuMS0yMDcxLjEsMTgwNC4xTC0yMDcxLjEsMTgwNC4xTC0yMDcxLjEsMTgwNC4xeiIvPg0KCQkJPC9nPg0KCQk8L2c+DQoJPC9nPg0KPC9nPg0KPC9zdmc+DQo=); }
    .button.has-icon.edit:after {
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiDQoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSItMjA5MiAxNzk0IDEzIDEzIg0KCSBlbmFibGUtYmFja2dyb3VuZD0ibmV3IC0yMDkyIDE3OTQgMTMgMTMiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHRpdGxlPu+BgCBjb3B5PC90aXRsZT4NCjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPg0KPGcgaWQ9IkZsaWdodC1Bc3NpZ25tZW50IiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4NCgkNCgkJPGcgaWQ9IkZsaWdodC1Bc3NpZ25tZW50LS0tQ3JlYXRpdmVzLVNlbGVjdGVkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjcwLjAwMDAwMCwgLTUxMC4wMDAwMDApIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiBvcGFjaXR5PSIwLjYiPg0KCQk8ZyBpZD0iRmxpZ2h0LUhlYWRpbmctLS1JQUItQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjAuMDAwMDAwLCAzNTAuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TTGF5ZXJHcm91cCI+DQoJCQk8ZyBpZD0iQnRuLi1FZGl0LUNyZWF0aXZlcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM4LjAwMDAwMCwgMTU0LjAwMDAwMCkiIHNrZXRjaDp0eXBlPSJNU1RleHRMYXllciI+DQoJCQkJPHRleHQgdHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgMSAtMjA4MCAxODEyKSIgZmlsbD0iIzIxMjkzNCIgZm9udC1mYW1pbHk9IidGb250QXdlc29tZSciIGZvbnQtc2l6ZT0iMTUiPu+BgDwvdGV4dD4NCgkJCTwvZz4NCgkJPC9nPg0KCTwvZz4NCjwvZz4NCjwvc3ZnPg0K); }
  .button.secondary {
    color: #212934;
    border-color: rgba(33, 41, 52, 0.2);
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); }
    .button.secondary:hover {
      background: rgba(33, 41, 52, 0.05); }
  .button.tertiary {
    height: 28px;
    line-height: 28px;
    color: rgba(33, 41, 52, 0.6);
    border-color: rgba(33, 41, 52, 0.2);
    text-transform: none;
    letter-spacing: 0;
    font-weight: normal;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); }
    .button.tertiary:hover {
      background: rgba(33, 41, 52, 0.05); }
  .button.expand {
    width: 85px; }

.button-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  margin: 0 -20px 20px 0; }
  .button-group > .button {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin: 0 20px 0 0; }
  .button-group.end {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end; }
  .button-group.stack {
    -webkit-flex-flow: column nowrap;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
    margin: 0 0 20px 0; }
    .button-group.stack > .button {
      display: block;
      width: 100%;
      margin: 0 0 20px; }
      .button-group.stack > .button:last-child {
        margin-bottom: 0; }
  .button-group.center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center; }
    .button-group.center > .button:last-child {
      margin-right: 0; }

h1.has-action, h2.has-action, h3.has-action {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between; }

/*
	Quantcast Alert Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the
	on-page alerts, floating alerts, and other messaging
	components.

*/
.onpage-alert {
  margin: 0 0 20px;
  padding: 22px 0;
  height: 80px;
  min-width: 1024px;
  width: 100%;
  background: #1EBFF0; }
  .onpage-alert.success {
    background: #54b948; }
    .onpage-alert.success .button {
      color: #439539; }
  .onpage-alert.caution {
    background: #F9A90C; }
    .onpage-alert.caution .button {
      color: #cd8905; }
  .onpage-alert.critical {
    background: #E85B86; }
    .onpage-alert.critical .button {
      color: #e22e65; }
  @media only screen and (max-width: 800px) {
    .onpage-alert {
      height: auto;
      min-width: 0; } }
  .onpage-alert .onpage-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px; }
    .onpage-alert .onpage-content.narrow {
      width: 720px;
      min-width: 720px;
      max-width: 720px; }
    @media only screen and (max-width: 800px) {
      .onpage-alert .onpage-content {
        -webkit-flex-flow: column nowrap;
            -ms-flex-flow: column nowrap;
                flex-flow: column nowrap;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        height: auto; }
        .onpage-alert .onpage-content .additional {
          padding-top: 10px;
          padding-left: 0; } }
  .onpage-alert .button {
    background: #fff;
    border: none;
    color: #0ea1cd;
    line-height: 39px; }
    .onpage-alert .button:hover {
      background: rgba(255, 255, 255, 0.9); }
  .onpage-alert .icon {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 36px;
        -ms-flex: 0 0 36px;
            flex: 0 0 36px;
    margin: 0 16px 0 0; }
  .onpage-alert .title {
    margin: 0;
    padding: 0 32px 0 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto; }
    .onpage-alert .title span {
      color: rgba(255, 255, 255, 0.5); }
    .onpage-alert .title h3 {
      letter-spacing: 0;
      text-transform: none;
      font-weight: 900;
      font-size: 24px;
      color: #fff;
      white-space: nowrap;
      padding: 0; }
  .onpage-alert .additional {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    padding-left: 32px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; }
    .onpage-alert .additional p {
      color: #fff;
      margin: 0;
      padding: 0;
      -webkit-align-self: flex-end;
          -ms-flex-item-align: end;
              align-self: flex-end; }

.secondary-onpage-alert {
  width: 100%;
  padding: 10px;
  text-align: center;
  background: #1fc1f1; }
  .secondary-onpage-alert h4 {
    color: white; }

.error {
  color: #E85B86; }

.error-msg {
  position: absolute;
  top: 32px;
  width: 100%;
  padding: 8px 10px;
  background-color: #f05050;
  color: rgba(255, 255, 255, 0.9);
  border-radius: 0 0 2px 2px;
  z-index: 2;
  -webkit-transition: all .35s ease;
          transition: all .35s ease; }

/*
	Quantcast Form Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains form styles
	that are applied globally and overriden as needed.

	* NOTE *
	Overrides should not go in this file under
	any circumstances.
*/
form {
  margin: 0;
  padding: 0 0 30px; }
  form:last-child {
    padding-bottom: 0; }

input[type="text"], input[type="password"], input[type="search"], input[type="date"] textarea {
  min-height: 40px;
  width: 100%;
  font-size: 13px;
  color: #212934;
  position: relative;
  padding: 10px 10px;
  margin: 0 0 20px 0;
  z-index: 3;
  border: 1px solid rgba(33, 41, 52, 0.2); }
  input[type="text"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="date"] textarea:focus {
    outline: none;
    border-color: rgba(33, 41, 52, 0.4); }
  input[type="text"][required], input[type="password"][required], input[type="search"][required], input[type="date"] textarea[required] {
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjIwMHB4IiB2aWV3Qm94PSIwIDAgMjAwIDIwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxuczpza2V0Y2g9Imh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaC9ucyI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDMuMy4yICgxMjA0MykgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+UGF0aCAxPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+CiAgICAgICAgPGcgaWQ9IkFydGJvYXJkLTEiIHNrZXRjaDp0eXBlPSJNU0FydGJvYXJkR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDAuMDAwMDAwLCAtNTAuMDAwMDAwKSIgZmlsbD0iI0VGNTg1QSI+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0xMDAsNTAgTDMwMCw1MCBMMzAwLDI1MCBMMTAwLDUwIFoiIGlkPSJQYXRoLTEiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==");
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 8px 8px; }

input[type="checkbox"] {
  -webkit-appearance: none;
  outline: none;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 7px 0 0;
  padding: 0;
  position: relative;
  border: 1px solid #212934;
  background: #fff; }
  input[type="checkbox"][checked] {
    background: #212934; }

input[type="radio"] {
  -webkit-appearance: none;
  outline: none;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 100%;
  margin: 0 7px 0 0;
  padding: 0;
  position: relative;
  border: 1px solid #212934;
  background: #fff; }
  input[type="radio"]:checked {
    background: #212934; }

label {
  display: block;
  margin: 0 0 4px;
  cursor: pointer;
  line-height: 1;
  margin-bottom: 8px; }

input[type="checkbox"], input[type="radio"] {
  position: absolute;
  left: -9999px; }
  input[type="checkbox"] + label, input[type="radio"] + label {
    position: relative; }
    input[type="checkbox"] + label i, input[type="radio"] + label i {
      padding: 0 10px 0 1px;
      opacity: 0; }
  input[type="checkbox"] + label::before, input[type="radio"] + label::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border: 1px solid #212934;
    position: absolute;
    left: 0;
    bottom: 1px; }

input[type="checkbox"] + label::before {
  width: 11px;
  height: 11px; }
input[type="checkbox"]:checked + label i {
  opacity: 1; }
input[type="checkbox"]:checked + label::before {
  width: 9px;
  height: 9px;
  border: 2px solid #212934; }

input[type="radio"] + label {
  padding-left: 20px; }
input[type="radio"] + label::before {
  border-radius: 12px; }
input[type="radio"]:checked + label::before {
  background: #212934; }

select {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  position: relative;
  z-index: 3;
  background-color: #fff;
  color: #212934;
  border-radius: 0;
  border: 1px solid rgba(33, 41, 52, 0.2);
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjIwcHgiIGhlaWdodD0iNnB4IiB2aWV3Qm94PSIwIDAgMjAgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxuczpza2V0Y2g9Imh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaC9ucyI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDMuMy4yICgxMjA0MykgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+QXJ0Ym9hcmQ8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4KICAgICAgICA8ZyBpZD0iQXJ0Ym9hcmQiIHNrZXRjaDp0eXBlPSJNU0FydGJvYXJkR3JvdXAiIGZpbGw9IiMyMTI5MzQiIG9wYWNpdHk9IjAuNiI+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLDAgTDgsMCBMNCw2IEwwLDAgWiIgaWQ9IlRyaWFuZ2xlLTMiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==");
  background-size: 20px 6px;
  background-position: right center;
  background-repeat: no-repeat; }
  select:focus {
    outline: none;
    border-color: rgba(33, 41, 52, 0.4); }
  select.simple {
    border: none;
    padding-left: 0;
    padding-right: 30px;
    width: auto;
    background-color: transparent; }

.date-picker .date-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 10px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between; }
.date-picker span {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 35px;
  padding-right: 5px; }
.date-picker label {
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 auto;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
  margin-bottom: 0; }
  .date-picker label input[type="text"] {
    background: transparent;
    margin: 0;
    padding: 10px;
    font-size: 12px;
    font-family: "proxima-nova", "Helvetica Neue", Arial, Verdana, sans-serif; }
  .date-picker label:before {
    position: absolute;
    top: 12px;
    right: 10px; }
.date-picker select {
  margin-bottom: 10px; }

input[type="text"]:focus + .error-msg, input[type="text"]:hover + .error-msg, input[type="password"]:focus + .error-msg, input[type="password"]:hover + .error-msg, input[type="search"]:focus + .error-msg, input[type="search"]:hover + .error-msg, textarea:focus + .error-msg, textarea:hover + .error-msg, select:focus + .error-msg, select:hover + .error-msg {
  -webkit-transform: translate(0, 28px);
      -ms-transform: translate(0, 28px);
          transform: translate(0, 28px);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15); }

/*
	Quantcast Control Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: Controls are elements that repeat and
	encompass things like option lists, setting lists,
	and other manipulation elements that are not
	specifically form-subsidiary tags.
*/
.link-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column nowrap;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  margin: 0; }
  .link-list section.labels {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap; }
    .link-list section.labels > * {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 150px;
          -ms-flex: 0 0 150px;
              flex: 0 0 150px;
      text-align: right;
      height: 30px; }
    .link-list section.labels > *:nth-child(1) {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto;
      text-align: left; }
    .link-list section.labels label {
      color: rgba(33, 41, 52, 0.4);
      font-weight: 600; }
      .link-list section.labels label.sort-descending, .link-list section.labels label.sort-ascending {
        color: rgba(33, 41, 52, 0.6); }
      .link-list section.labels label.sortable span {
        position: relative;
        padding-right: 16px; }
        .link-list section.labels label.sortable span:before, .link-list section.labels label.sortable span:after {
          position: absolute;
          content: "";
          display: block;
          width: 0;
          height: 0;
          right: 0;
          border-left: 4px solid transparent;
          border-right: 4px solid transparent;
          cursor: pointer; }
        .link-list section.labels label.sortable span:before {
          top: 0;
          border-bottom: 6px solid rgba(33, 41, 52, 0.2); }
        .link-list section.labels label.sortable span:after {
          top: 8px;
          border-top: 6px solid rgba(33, 41, 52, 0.2); }
      .link-list section.labels label.sortable.sort-descending span:before {
        top: 4px;
        border-top: 8px solid rgba(33, 41, 52, 0.4);
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-bottom: none; }
      .link-list section.labels label.sortable.sort-descending span:after {
        display: none; }
      .link-list section.labels label.sortable.sort-ascending span:before {
        top: 4px;
        border-bottom: 8px solid rgba(33, 41, 52, 0.4);
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: none; }
      .link-list section.labels label.sortable.sort-ascending span:after {
        display: none; }
  .link-list ul {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin: 0;
    padding: 0; }
    .link-list ul li {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: row wrap;
          -ms-flex-flow: row wrap;
              flex-flow: row wrap; }
      .link-list ul li a span {
        color: rgba(33, 41, 52, 0.4); }
      .link-list ul li a span:first-child {
        color: rgba(0, 150, 200, 0.7); }
      .link-list ul li.has-child {
        position: relative; }
        .link-list ul li.has-child > a {
          position: relative; }
        .link-list ul li.has-child .title {
          position: relative; }
          .link-list ul li.has-child .title > i.toggle {
            display: block;
            width: 0;
            height: 0;
            position: absolute;
            left: -12px;
            top: 3px;
            border-left: 7px solid rgba(33, 41, 52, 0.4);
            border-top: 5px solid transparent;
            border-bottom: 5px solid transparent;
            -webkit-transition: -webkit-transform 0.25s ease;
                    transition: transform 0.25s ease;
            cursor: pointer; }
        .link-list ul li.has-child.open > ul {
          display: block; }
        .link-list ul li.has-child.open > .title > i.toggle {
          -webkit-transform: rotate(90deg);
              -ms-transform: rotate(90deg);
                  transform: rotate(90deg); }
      .link-list ul li > * {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 150px;
            -ms-flex: 0 0 150px;
                flex: 0 0 150px;
        text-align: right;
        height: 30px; }
      .link-list ul li > *:nth-child(1) {
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        text-align: left; }
      .link-list ul li ul {
        display: none;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%;
        padding-left: 20px;
        height: auto; }

.tabs {
  display: block;
  margin: 0 0 20px;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }
  .tabs > * {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin: 0;
    padding: 0 30px 0 0;
    list-style: none;
    opacity: 0.5;
    -webkit-transition: opacity 0.25s ease;
            transition: opacity 0.25s ease; }
    @media only screen and (max-width: 800px) {
      .tabs > * {
        margin-bottom: 5px; } }
    .tabs > * a {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
      text-decoration: none;
      letter-spacing: 2px;
      color: #0096c8; }
    .tabs > *.active, .tabs > *:hover {
      opacity: 1; }
  .tabs > input[type="radio"] {
    display: none; }
    .tabs > input[type="radio"] + label {
      padding-left: 0; }
      .tabs > input[type="radio"] + label::before {
        display: none; }
  .tabs > label {
    padding: 0 30px 20px 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 2px;
    color: #0096c8;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
    cursor: pointer; }
  .tabs > input:checked + label {
    opacity: 1; }
  .tabs .tab-content {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2;
    opacity: 1;
    display: none;
    padding: 0;
    margin-bottom: -20px; }
  .tabs .has-dropdown {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    z-index: 1;
    position: relative; }
    .tabs .has-dropdown a {
      opacity: .5; }
    .tabs .has-dropdown.showing .action-dropdown {
      display: block; }
    .tabs .has-dropdown.active a, .tabs .has-dropdown.active:after {
      opacity: 1; }
    .tabs .has-dropdown:after {
      content: "";
      display: block;
      width: 0;
      height: 0;
      opacity: 0.5;
      margin-top: 4px;
      margin-left: 5px;
      border-top: 6px solid #0096C8;
      border-left: 4px solid transparent;
      border-right: 4px solid transparent; }
    .tabs .has-dropdown .action-dropdown {
      font-size: 14px;
      color: black;
      line-height: 20px;
      background: rgba(250, 250, 250, 0.95);
      padding: 10px;
      border-radius: 3px;
      opacity: 1;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
      position: absolute;
      top: 26px;
      right: 0px;
      z-index: 1;
      display: none; }
      .tabs .has-dropdown .action-dropdown div {
        cursor: pointer; }
      .tabs .has-dropdown .action-dropdown .active {
        font-weight: 600; }
      .tabs .has-dropdown .action-dropdown:before {
        content: "";
        display: block;
        width: 9px;
        height: 9px;
        position: absolute;
        -webkit-transform: rotate(225deg);
            -ms-transform: rotate(225deg);
                transform: rotate(225deg);
        background: rgba(250, 250, 250, 0.95);
        top: -3px;
        right: 27.5px;
        box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.15); }
  .tabs > input:checked + label + .tab-content {
    display: block; }

h1 .tabs, h2 .tabs, h3 .tabs, h4 .tabs, h5 .tabs {
  margin-bottom: 0; }

.card-controls {
  background: #fff; }
  .card-controls ul {
    margin: 0 0 15px;
    padding: 0; }
    .card-controls ul li {
      list-style: none;
      display: block;
      height: 20px;
      margin: 0;
      padding: 0;
      font-size: 13px;
      line-height: 13px;
      font-weight: 600; }
      .card-controls ul li a {
        color: #0096c8;
        opacity: 0.5;
        -webkit-transition: all 0.15s linear;
                transition: all 0.15s linear; }
        .card-controls ul li a:hover {
          opacity: 1;
          cursor: pointer;
          text-decoration: none; }
      .card-controls ul li.active a {
        opacity: 1; }
    .card-controls ul.data-source {
      border-bottom: 1px solid rgba(33, 41, 52, 0.1);
      padding-bottom: 10px; }
      @media only screen and (max-width: 800px) {
        .card-controls ul.data-source {
          border-bottom: 0; } }
  .card-controls .data-source-logo {
    width: 80%;
    height: 90px;
    margin: auto;
    margin-bottom: 30px;
    background-image: url("https://www.iriworldwide.com/img/IRI_logo_small");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center top; }
    @media only screen and (max-width: 800px) {
      .card-controls .data-source-logo {
        display: none; } }

.pagination {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  margin-top: 20px; }
  .pagination a {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    padding: 0;
    margin: 0 12px 0 0;
    text-transform: uppercase;
    font-weight: 600; }
    .pagination a.disabled {
      color: #212934;
      opacity: 0.2; }
    .pagination a.current {
      color: #212934; }

/*
	Quantcast App Nav Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the global
	App navigation (seconday nav).

*/
#appNav {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: absolute;
  top: 80px;
  left: 0;
  z-index: 51;
  width: 100%;
  min-width: 1024px;
  height: 50px;
  background: #1c232c; }
  #appNav.panel-active {
    box-shadow: none; }
  #appNav ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0;
    padding: 0 17px; }
    #appNav ul.breadcrumbs {
      -webkit-transition: -webkit-transform 0.15s ease-out;
              transition: transform 0.15s ease-out;
      -webkit-transform: translateX(-60px);
          -ms-transform: translateX(-60px);
              transform: translateX(-60px);
      overflow: hidden; }
      #appNav ul.breadcrumbs li {
        position: relative;
        font-size: 15px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: row nowrap;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
        overflow: hidden; }
        #appNav ul.breadcrumbs li ul {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          margin: 0;
          padding: 0; }
          #appNav ul.breadcrumbs li ul li a {
            margin-right: 20px; }
            #appNav ul.breadcrumbs li ul li a:after {
              content: "";
              display: none; }
        #appNav ul.breadcrumbs li.logo {
          padding: 0;
          display: block; }
          #appNav ul.breadcrumbs li.logo a {
            height: 30px;
            width: 30px;
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjQwcHgiIGhlaWdodD0iMzNweCIgdmlld0JveD0iMCAwIDQwIDMzIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjIgKDEyMDQzKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5RdWFudGNhc3RfU21hbGxfV2hpdGU8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4KICAgICAgICA8ZyBpZD0iTmV3LU1lYXN1cmUtUHJvZmlsZSIgc2tldGNoOnR5cGU9Ik1TQXJ0Ym9hcmRHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIwLjAwMDAwMCwgLTk4LjAwMDAwMCkiIGZpbGw9IiNGRkZGRkYiPgogICAgICAgICAgICA8ZyBpZD0iUXVhbnRjYXN0X1NtYWxsX1doaXRlIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMC4wMDAwMDAsIDk4LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPHBhdGggZD0iTTI3LjM5MzczOTcsMjguNzM3ODgyNCBDMzAuNzIxNTgxNSwyNS43NDAyMzUzIDMyLjg4OTYyMTEsMjEuNzQ3NzY0NyAzMi44ODk2MjExLDE2LjQxNzg4MjQgQzMyLjg4OTYyMTEsNy41MTA1ODgyNCAyNS4zOTcwMzQ2LDAuMDE5NzY0NzA1OSAxNi40MDg1NjY3LDAuMDE5NzY0NzA1OSBDNy40MjAwOTg4NSwwLjAxOTc2NDcwNTkgMC4wMDY1ODk3ODU4Myw3LjUxMDU4ODI0IDAuMDA2NTg5Nzg1ODMsMTYuNDE3ODgyNCBDMC4wMDY1ODk3ODU4MywyNS40ODk4ODI0IDcuMjQ4NzY0NDIsMzIuODk1MDU4OCAxNi40MDg1NjY3LDMyLjg5NTA1ODggTDM5Ljk2NzA1MTEsMzIuODk1MDU4OCBMMzkuOTY3MDUxMSwyOC43MzEyOTQxIEwyNy4zOTM3Mzk3LDI4LjczMTI5NDEgTDI3LjM5MzczOTcsMjguNzM3ODgyNCBaIiBpZD0iU2hhcGUiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain; }
            #appNav ul.breadcrumbs li.logo a:after {
              top: -9px;
              opacity: 0;
              -webkit-transition: opacity 0.15s ease-out;
                      transition: opacity 0.15s ease-out; }
        #appNav ul.breadcrumbs li:last-child a:after {
          content: ""; }
        #appNav ul.breadcrumbs li:last-child {
          -webkit-box-flex: 0;
          -webkit-flex: 0 1 auto;
              -ms-flex: 0 1 auto;
                  flex: 0 1 auto; }
          #appNav ul.breadcrumbs li:last-child a {
            -webkit-box-flex: 0;
            -webkit-flex: 0 1 auto;
                -ms-flex: 0 1 auto;
                    flex: 0 1 auto;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden; }
        #appNav ul.breadcrumbs li a.has-children:after {
          content: "/"; }
      #appNav ul.breadcrumbs a, #appNav ul.breadcrumbs span {
        display: block;
        position: relative;
        height: 46px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
        margin-right: 30px;
        line-height: 50px;
        color: rgba(255, 255, 255, 0.75);
        text-decoration: none;
        -webkit-transition: color 0.25s ease;
                transition: color 0.25s ease; }
        #appNav ul.breadcrumbs a:after, #appNav ul.breadcrumbs span:after {
          content: "/";
          font-size: 28px;
          font-weight: 100;
          position: absolute;
          right: -19px;
          top: 1px;
          color: rgba(255, 255, 255, 0.25); }
        #appNav ul.breadcrumbs a:hover, #appNav ul.breadcrumbs span:hover {
          color: #fff; }
        #appNav ul.breadcrumbs a.active, #appNav ul.breadcrumbs span.active {
          font-weight: 600;
          color: #fff; }
          #appNav ul.breadcrumbs a.active.has-panel a:after, #appNav ul.breadcrumbs span.active.has-panel a:after {
            border-top: 6px solid #fff; }
        #appNav ul.breadcrumbs a.open, #appNav ul.breadcrumbs span.open {
          border-bottom: 2px solid #1fc1f1; }
        #appNav ul.breadcrumbs a.has-panel, #appNav ul.breadcrumbs span.has-panel {
          position: relative;
          padding-right: 16px; }
          #appNav ul.breadcrumbs a.has-panel:before, #appNav ul.breadcrumbs span.has-panel:before {
            content: "";
            display: block;
            margin-left: 6px;
            position: absolute;
            right: 0;
            top: 21px;
            width: 0;
            height: 0;
            border-top: 6px solid #fff;
            border-left: 4px solid transparent;
            border-right: 4px solid transparent; }
    #appNav ul.actions {
      -webkit-box-pack: end;
      -webkit-justify-content: flex-end;
          -ms-flex-pack: end;
              justify-content: flex-end;
      -webkit-box-flex: 1;
      -webkit-flex: 1 0 auto;
          -ms-flex: 1 0 auto;
              flex: 1 0 auto; }
      #appNav ul.actions li {
        position: relative; }
      #appNav ul.actions .button {
        position: relative;
        border-color: rgba(255, 255, 255, 0.3);
        border-width: 0 0 0 1px;
        border-radius: 0;
        color: rgba(255, 255, 255, 0.8);
        text-transform: none;
        letter-spacing: 1px;
        height: 30px;
        line-height: 30px;
        -webkit-transition: color 0.25s ease;
                transition: color 0.25s ease;
        background: none;
        box-shadow: none; }
        #appNav ul.actions .button:hover {
          color: white;
          background: none; }
      #appNav ul.actions li:first-child .button {
        border-left: none; }
      #appNav ul.actions .has-dropdown {
        padding-right: 28px; }
        #appNav ul.actions .has-dropdown:before {
          content: "";
          display: block;
          margin-left: 6px;
          position: absolute;
          right: 13px;
          top: 12px;
          width: 0;
          height: 0;
          -webkit-transition: border-top-color 0.25s ease;
                  transition: border-top-color 0.25s ease;
          border-top: 6px solid rgba(255, 255, 255, 0.8);
          border-left: 4px solid transparent;
          border-right: 4px solid transparent; }
        #appNav ul.actions .has-dropdown:hover:before {
          border-top: 6px solid white; }
        #appNav ul.actions .has-dropdown.showing:after {
          content: "";
          display: block;
          width: 0;
          height: 0;
          position: absolute;
          bottom: -15px;
          left: 50%;
          margin-left: -8px;
          border-bottom: 8px solid rgba(255, 255, 255, 0.95);
          border-left: 8px solid transparent;
          border-right: 8px solid transparent; }
        #appNav ul.actions .has-dropdown.showing + .action-dropdown {
          display: -webkit-box;
          display: -webkit-flex;
          display: -ms-flexbox;
          display: flex; }
      #appNav ul.actions .action-dropdown {
        display: none;
        -webkit-flex-flow: column nowrap;
            -ms-flex-flow: column nowrap;
                flex-flow: column nowrap;
        position: absolute;
        top: 45px;
        right: 0;
        min-width: 150px;
        margin-left: -75px;
        padding: 20px;
        background: rgba(255, 255, 255, 0.95);
        border-radius: 2px;
        font-weight: 600;
        overflow-y: auto;
        max-height: 400px;
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); }
        #appNav ul.actions .action-dropdown > * {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          min-height: 20px;
          line-height: 20px;
          margin: 0;
          padding: 0;
          white-space: nowrap; }
        #appNav ul.actions .action-dropdown > a {
          padding-left: 10px;
          text-indent: -10px;
          opacity: 0.5; }
          #appNav ul.actions .action-dropdown > a:hover {
            opacity: 1; }
          #appNav ul.actions .action-dropdown > a.selected {
            opacity: 1;
            color: #212934; }
        #appNav ul.actions .action-dropdown label {
          opacity: 0.5;
          border-bottom: 1px solid rgba(33, 41, 52, 0.2);
          padding-bottom: 4px;
          margin: 8px 0;
          cursor: default; }
        #appNav ul.actions .action-dropdown hr {
          height: 0;
          min-height: 0;
          margin: 8px 0;
          padding: 0;
          border: none;
          border-bottom: 1px solid rgba(33, 41, 52, 0.2); }
    #appNav ul li {
      margin: 0;
      padding: 0;
      list-style: none; }
  @media only screen and (max-width: 800px) {
    #appNav {
      -webkit-flex-flow: column nowrap;
          -ms-flex-flow: column nowrap;
              flex-flow: column nowrap;
      min-width: 0;
      height: auto; }
      #appNav ul.breadcrumbs li {
        display: none; }
        #appNav ul.breadcrumbs li.logo {
          display: block; }
        #appNav ul.breadcrumbs li:nth-child(2) {
          display: block; }
        #appNav ul.breadcrumbs li:nth-child(3) {
          display: block; }
        #appNav ul.breadcrumbs li:last-child {
          display: block; }
      #appNav ul.actions {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
                justify-content: flex-start; }
        #appNav ul.actions a.button {
          font-weight: normal;
          border-width: 0;
          padding-left: 0;
          padding-right: 20px;
          color: rgba(255, 255, 255, 0.5); }
          #appNav ul.actions a.button.has-dropdown {
            padding-right: 37px; }
            #appNav ul.actions a.button.has-dropdown:before {
              right: 20px;
              opacity: 0.5; }
            #appNav ul.actions a.button.has-dropdown.showing {
              color: #fff; }
              #appNav ul.actions a.button.has-dropdown.showing:before {
                opacity: 1; }
        #appNav ul.actions .action-dropdown {
          right: auto;
          left: 20px; } }

body.scrolled #appNav ul.breadcrumbs {
  -webkit-transform: translateX(0px);
      -ms-transform: translateX(0px);
          transform: translateX(0px); }
  body.scrolled #appNav ul.breadcrumbs .logo a:after {
    opacity: 1; }

#onpageNav, main left-nav-panel {
  display: block;
  position: relative;
  margin: 0;
  padding: 0; }
  #onpageNav .button, main left-nav-panel .button {
    margin-top: 20px;
    position: relative;
    left: -10px;
    width: 170px;
    padding: 0;
    text-align: center; }
  #onpageNav a:not(.button), main left-nav-panel a:not(.button) {
    display: block;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    color: rgba(33, 41, 52, 0.6);
    -webkit-transition: all 0.15s linear;
            transition: all 0.15s linear; }
    #onpageNav a:not(.button).selected, main left-nav-panel a:not(.button).selected, #onpageNav a:not(.button).active, main left-nav-panel a:not(.button).active {
      color: #212934;
      font-weight: 600; }
    #onpageNav a:not(.button):hover, main left-nav-panel a:not(.button):hover {
      color: #212934;
      text-decoration: none; }
    #onpageNav a:not(.button).new:after, main left-nav-panel a:not(.button).new:after {
      content: "New";
      display: inline-block;
      height: 18px;
      margin: 0 0 0 8px;
      padding: 0 4px;
      line-height: 18px;
      font-size: 11px;
      text-transform: uppercase;
      font-weight: 600;
      border: solid 1px #faaa0b;
      border-radius: 3px;
      color: #faaa0b;
      opacity: 1; }
  #onpageNav #fixedNav, main left-nav-panel #fixedNav {
    position: relative; }
    #onpageNav #fixedNav:before, main left-nav-panel #fixedNav:before {
      content: "";
      display: block;
      width: 5px;
      height: 20px;
      position: absolute;
      left: -10px;
      top: 37px;
      background: #0096c8;
      border-radius: 1px;
      -webkit-transition: all 0.5s ease-in-out;
              transition: all 0.5s ease-in-out; }
  #onpageNav.report1 #fixedNav:before, main left-nav-panel.report1 #fixedNav:before {
    -webkit-transform: translateY(0px);
        -ms-transform: translateY(0px);
            transform: translateY(0px); }
  #onpageNav.report2 #fixedNav:before, main left-nav-panel.report2 #fixedNav:before {
    -webkit-transform: translateY(30px);
        -ms-transform: translateY(30px);
            transform: translateY(30px); }
  #onpageNav.report3 #fixedNav:before, main left-nav-panel.report3 #fixedNav:before {
    -webkit-transform: translateY(60px);
        -ms-transform: translateY(60px);
            transform: translateY(60px); }
  #onpageNav.report4 #fixedNav:before, main left-nav-panel.report4 #fixedNav:before {
    -webkit-transform: translateY(90px);
        -ms-transform: translateY(90px);
            transform: translateY(90px); }
  #onpageNav.report5 #fixedNav:before, main left-nav-panel.report5 #fixedNav:before {
    -webkit-transform: translateY(120px);
        -ms-transform: translateY(120px);
            transform: translateY(120px); }
  #onpageNav.report6 #fixedNav:before, main left-nav-panel.report6 #fixedNav:before {
    -webkit-transform: translateY(150px);
        -ms-transform: translateY(150px);
            transform: translateY(150px); }
  #onpageNav.report7 #fixedNav:before, main left-nav-panel.report7 #fixedNav:before {
    -webkit-transform: translateY(180px);
        -ms-transform: translateY(180px);
            transform: translateY(180px); }
  #onpageNav.report8 #fixedNav:before, main left-nav-panel.report8 #fixedNav:before {
    -webkit-transform: translateY(210px);
        -ms-transform: translateY(210px);
            transform: translateY(210px); }
  #onpageNav.report9 #fixedNav:before, main left-nav-panel.report9 #fixedNav:before {
    -webkit-transform: translateY(240px);
        -ms-transform: translateY(240px);
            transform: translateY(240px); }
  #onpageNav.report10 #fixedNav:before, main left-nav-panel.report10 #fixedNav:before {
    -webkit-transform: translateY(270px);
        -ms-transform: translateY(270px);
            transform: translateY(270px); }
  #onpageNav.report11 #fixedNav:before, main left-nav-panel.report11 #fixedNav:before {
    -webkit-transform: translateY(300px);
        -ms-transform: translateY(300px);
            transform: translateY(300px); }
  #onpageNav.report12 #fixedNav:before, main left-nav-panel.report12 #fixedNav:before {
    -webkit-transform: translateY(330px);
        -ms-transform: translateY(330px);
            transform: translateY(330px); }
  #onpageNav.report13 #fixedNav:before, main left-nav-panel.report13 #fixedNav:before {
    -webkit-transform: translateY(360px);
        -ms-transform: translateY(360px);
            transform: translateY(360px); }
  #onpageNav.report14 #fixedNav:before, main left-nav-panel.report14 #fixedNav:before {
    -webkit-transform: translateY(390px);
        -ms-transform: translateY(390px);
            transform: translateY(390px); }
  #onpageNav #fixedNav.fix, main left-nav-panel #fixedNav.fix {
    position: fixed;
    top: 100px;
    left: 20px; }

body.scrolled #appNav {
  position: fixed;
  top: 10px;
  min-width: 100%;
  max-width: 100%; }
body.exploring #appNav {
  top: 200px; }

#appnav-placeholder {
  width: 100%;
  min-width: 1024px;
  height: 50px;
  background: #1c232c; }
  @media only screen and (max-width: 800px) {
    #appnav-placeholder {
      height: 76px;
      min-width: 0; } }

/*
	Quantcast Chart Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: These are chart styles abstracted our from
	their respective cards or sheets for portability.

*/
.chart {
  display: block; }

.data {
  position: relative; }
  .data .col {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
            flex: 0 1 50%;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: column nowrap;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap; }
    .data .col:nth-child(1) {
      margin-right: 25px; }
    .data .col:nth-child(2) {
      margin-left: 25px; }
    .data .col > * {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto; }
    @media only screen and (max-width: 800px) {
      .data .col {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%; }
        .data .col:nth-child(1), .data .col:nth-child(2) {
          margin: 0; } }

.bar-chart-container, bar-chart {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  position: relative; }

.bar-chart {
  display: block;
  margin: 0;
  padding: 0; }
  .bar-chart li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    /*height: $bar-chart-height;*/
    color: #212934; }
    .bar-chart li label {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto;
      width: 110px;
      /* ie fix */
      text-align: right;
      padding-right: 10px;
      line-height: 20px; }
    .bar-chart li .bar {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto; }
      .bar-chart li .bar div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto; }
      .bar-chart li .bar span {
        display: block;
        height: 20px;
        width: 100%;
        background: #1fc1f1; }
        .bar-chart li .bar span.series0 {
          background: #1ebff0; }
        .bar-chart li .bar span.series1 {
          background: #f9a90c !important; }
        .bar-chart li .bar span.series2 {
          background: #e85b86; }
        .bar-chart li .bar span.series3 {
          background: #2ba52b; }
        .bar-chart li .bar span.series4 {
          background: #e7323a; }
        .bar-chart li .bar span.series5 {
          background: #ff7262; }
      .bar-chart li .bar.has-avg {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: column nowrap;
            -ms-flex-flow: column nowrap;
                flex-flow: column nowrap;
        height: 20px; }
        .bar-chart li .bar.has-avg span {
          -webkit-box-flex: 1;
          -webkit-flex: 1 1 auto;
              -ms-flex: 1 1 auto;
                  flex: 1 1 auto; }
          .bar-chart li .bar.has-avg span:nth-child(2) {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 20%;
                -ms-flex: 0 0 20%;
                    flex: 0 0 20%;
            background: #264773; }
      .bar-chart li .bar.o4, .bar-chart li .bar .o4 {
        opacity: 0.4; }
      .bar-chart li .bar.o5, .bar-chart li .bar .o5 {
        opacity: 0.5; }
      .bar-chart li .bar.o6, .bar-chart li .bar .o6 {
        opacity: 0.6; }
      .bar-chart li .bar.o7, .bar-chart li .bar .o7 {
        opacity: 0.7; }
      .bar-chart li .bar.o8, .bar-chart li .bar .o8 {
        opacity: 0.8; }
      .bar-chart li .bar.o9, .bar-chart li .bar .o9 {
        opacity: 0.9; }
      .bar-chart li .bar.o0, .bar-chart li .bar .o0 {
        opacity: 1; }
    .bar-chart li data {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto;
      width: 50px;
      /* ie fix */
      text-align: right;
      line-height: 20px; }
    .bar-chart li.main label {
      font-weight: 600; }
    .bar-chart li.main data {
      font-weight: 600; }
    .bar-chart li.over-index .bar span {
      background: -webkit-linear-gradient(left, #1fc1f1, rgba(31, 193, 241, 0.5));
      background: linear-gradient(to right, #1fc1f1, rgba(31, 193, 241, 0.5)); }
    .bar-chart li.over-index data {
      background: -webkit-linear-gradient(left, rgba(31, 193, 241, 0.5), #fff);
      background: linear-gradient(to right, rgba(31, 193, 241, 0.5), #fff);
      height: 20px; }
  .bar-chart.index li .bar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap; }
    .bar-chart.index li .bar span.pre {
      background: #d8d8d8;
      -webkit-box-flex: 0;
      -webkit-flex: 0 1 auto;
          -ms-flex: 0 1 auto;
              flex: 0 1 auto; }
    .bar-chart.index li .bar span.post {
      -webkit-box-flex: 0;
      -webkit-flex: 0 1 auto;
          -ms-flex: 0 1 auto;
              flex: 0 1 auto; }
  .bar-chart.bar-chart-narrow .bar-chart-header-narrow {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; }
    @media only screen and (max-width: 800px) {
      .bar-chart.bar-chart-narrow .bar-chart-header-narrow {
        margin-bottom: 10px; } }
    .bar-chart.bar-chart-narrow .bar-chart-header-narrow h5 {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 45%;
          -ms-flex: 1 1 45%;
              flex: 1 1 45%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis; }
    .bar-chart.bar-chart-narrow .bar-chart-header-narrow h5:first-child {
      -webkit-box-flex: 1;
      -webkit-flex: 1 0 auto;
          -ms-flex: 1 0 auto;
              flex: 1 0 auto;
      width: calc(55% + 50px);
      /* ie fix */
      padding-right: 10px;
      margin-left: 0; }
  .bar-chart.bar-chart-narrow .bar-chart-narrow-bar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 45%;
        -ms-flex: 1 1 45%;
            flex: 1 1 45%; }
  .bar-chart.bar-chart-narrow .bar-chart-narrow-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 55%;
        -ms-flex: 1 1 55%;
            flex: 1 1 55%; }
  .bar-chart.bar-chart-narrow img {
    margin-right: 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 20px;
        -ms-flex: 0 0 20px;
            flex: 0 0 20px; }
  .bar-chart.bar-chart-narrow li label {
    text-align: left;
    color: black;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 20px;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%; }
  .bar-chart.bar-chart-narrow li data {
    text-align: right;
    padding-right: 10px; }

.legend {
  padding-left: 120px; }
  .legend h5 {
    opacity: 1;
    color: rgba(33, 41, 52, 0.45); }
  .legend h5:before {
    content: "";
    display: inline-block;
    margin-right: 6px;
    width: 10px;
    height: 10px;
    background: #264773; }

.has-index .index-container {
  position: relative;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column nowrap;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap; }
  .has-index .index-container > * {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto; }
.has-index .index-label {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  margin: -30px 0 0 0; }
  @media only screen and (max-width: 800px) {
    .has-index .index-label {
      margin: -10px 0 0 0; } }
  .has-index .index-label h5 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    text-align: center;
    height: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: column nowrap;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap; }
    .has-index .index-label h5:before {
      content: "";
      display: block;
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto; }
    .has-index .index-label h5 span {
      display: block;
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto; }
  .has-index .index-label:before {
    content: "";
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 120px;
        -ms-flex: 0 0 120px;
            flex: 0 0 120px; }
  .has-index .index-label:after {
    content: "";
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 40px;
        -ms-flex: 0 0 40px;
            flex: 0 0 40px; }
.has-index .index-line {
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
      -ms-flex-order: -1;
          order: -1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1; }
  .has-index .index-line:before {
    content: "";
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 110px;
        -ms-flex: 0 0 110px;
            flex: 0 0 110px; }
  .has-index .index-line span {
    display: block;
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto; }
    .has-index .index-line span:before {
      content: "";
      display: block;
      position: absolute;
      left: 50%;
      bottom: 30px;
      height: calc(100% - 0px);
      width: 0;
      border-left: 1px dotted rgba(0, 0, 0, 0.3); }
  .has-index .index-line:after {
    content: "";
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50px;
        -ms-flex: 0 0 50px;
            flex: 0 0 50px; }

.active-point {
  width: 30px;
  height: 30px;
  border: 1px dashed #212934;
  border-radius: 100%;
  position: relative; }
  .active-point:after {
    content: "";
    width: 18px;
    height: 18px;
    background: #212934;
    border-radius: 100%;
    position: absolute;
    left: 5px;
    top: 5px; }
  .active-point.small {
    position: absolute;
    margin-left: -7px;
    margin-top: -7px;
    width: 14px;
    height: 14px; }
    .active-point.small:after {
      border: solid 1px #fff;
      width: 10px;
      height: 10px;
      left: 0;
      top: 0; }

.active-line {
  position: absolute;
  top: 0;
  width: 0;
  height: 100%;
  border-left: 1px dashed #212934; }

.large-chart {
  position: relative;
  margin-bottom: 30px;
  width: 100%; }

.small-chart {
  position: relative;
  margin-bottom: 30px;
  width: 100%; }

.two-axis.chart {
  margin: 15px 0 5px 0;
  position: relative; }
  .two-axis.chart:after {
    content: "";
    background: url(../images/quantcast-logo.svg) no-repeat;
    width: 100px;
    height: 19px;
    display: block;
    position: absolute;
    right: 10px;
    bottom: 45px; }
  .two-axis.chart .main-axis {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap; }
  .two-axis.chart .chart-object {
    position: relative;
    margin-bottom: 4px;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2; }
  .two-axis.chart .y-axis li, .two-axis.chart .x-axis li {
    color: rgba(33, 41, 52, 0.45); }
  .two-axis.chart .y-axis {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 40px;
        -ms-flex: 0 0 40px;
            flex: 0 0 40px;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: column nowrap;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
    margin: 0;
    padding: 0;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between; }
    .two-axis.chart .y-axis li {
      list-style: none;
      padding-right: 4px;
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto;
      text-align: right; }
  .two-axis.chart .x-axis {
    margin: 0;
    padding: 0 0 0 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap; }
    .two-axis.chart .x-axis li {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto;
      position: relative;
      top: -4px;
      padding: 4px 0 0 4px;
      list-style: none;
      border-left: solid 1px #d8d8d8; }

/* REMOVE / BLAME */
/* This code is only here for the temporary chart objects because Firefox is an idiot. */
.large-chart img, .small-chart img, .chart-object img {
  width: 100%; }

/* REMOVE / BLAME */
.chart-options {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 0 0 30px; }
  .chart-options .control-list {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; }
    .chart-options .control-list h5 {
      margin-right: 12px; }
    .chart-options .control-list a {
      height: 20px;
      line-height: 20px;
      text-transform: uppercase;
      font-weight: 600;
      color: #0096c8;
      margin-right: 12px;
      opacity: 0.3;
      -webkit-transition: 0.15s all linear;
              transition: 0.15s all linear; }
      .chart-options .control-list a.active, .chart-options .control-list a:hover {
        opacity: 1; }
  .chart-options legend {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; }
    .chart-options legend label {
      margin-left: 20px;
      font-weight: 600;
      line-height: 20px;
      color: rgba(33, 41, 52, 0.3); }
      .chart-options legend label:before {
        content: "";
        display: inline-block;
        position: relative;
        top: 3px;
        width: 16px;
        height: 16px;
        margin-right: 8px; }

.chart-table {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }
  .chart-table .active {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30px;
        -ms-flex: 0 0 30px;
            flex: 0 0 30px;
    margin-right: 10px; }
  .chart-table .chart-data {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto; }
    .chart-table .chart-data table {
      width: 100%; }
      .chart-table .chart-data table thead td {
        line-height: 1;
        text-align: right; }
        .chart-table .chart-data table thead td data {
          font-size: 24px;
          font-weight: 800;
          line-height: 1;
          display: block;
          font-family: "proxima-nova", "Helvetica Neue", Arial, Verdana, sans-serif; }
          .chart-table .chart-data table thead td data + h5 {
            margin-top: -1px; }
      .chart-table .chart-data table thead h4 {
        font-weight: 700;
        margin: 0; }
      .chart-table .chart-data table tr {
        height: 30px; }
        .chart-table .chart-data table tr td:first-child {
          text-align: left;
          text-overflow: ellipsis;
          -webkit-flex-wrap: nowrap;
              -ms-flex-wrap: nowrap;
                  flex-wrap: nowrap; }
      .chart-table .chart-data table td {
        height: 30px;
        line-height: 30px;
        text-align: right;
        font-weight: 600;
        position: relative; }
        .chart-table .chart-data table td h5 {
          display: inline; }
      .chart-table .chart-data table legend {
        white-space: nowrap;
        overflow: hidden;
        width: 100%;
        text-overflow: ellipsis; }
        .chart-table .chart-data table legend:before {
          content: "";
          display: inline-block;
          width: 16px;
          height: 16px;
          position: relative;
          top: 3px;
          margin-right: 8px;
          margin-left: 16px;
          background: #1fc1f1; }
        .chart-table .chart-data table legend.primary:before, .chart-table .chart-data table #trafficCard legend.sky:before, #trafficCard .chart-table .chart-data table legend.sky:before {
          background: #1fc1f1; }
        .chart-table .chart-data table legend.secondary:before {
          background: rgba(33, 41, 52, 0.2); }
        .chart-table .chart-data table legend.tertiary:before {
          background: rgba(31, 193, 241, 0.25); }
        .chart-table .chart-data table legend.quaternary:before {
          background: #faaa0b; }
        .chart-table .chart-data table legend.quinary:before {
          background: #D28300; }
        .chart-table .chart-data table legend.no-color:before {
          background: rgba(255, 255, 255, 0.1); }
        .chart-table .chart-data table legend.gray:before {
          background: rgba(33, 41, 52, 0.2); }
        .chart-table .chart-data table legend.space:before {
          background: rgba(255, 255, 255, 0.1); }
        .chart-table .chart-data table legend.series0:before {
          background: #1ebff0; }
        .chart-table .chart-data table legend.series1:before {
          background: #f9a90c; }
        .chart-table .chart-data table legend.series2:before {
          background: #e85b86; }
        .chart-table .chart-data table legend.series3:before {
          background: #2ba52b; }
      .chart-table .chart-data table td a.expand {
        position: absolute;
        left: -12px;
        top: 9px;
        text-indent: -9999px;
        height: 0;
        width: 0;
        border-left: 5px solid #212934;
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent; }
        .chart-table .chart-data table td a.expand.open {
          -webkit-transform: rotate(90deg);
              -ms-transform: rotate(90deg);
                  transform: rotate(90deg); }
      .chart-table .chart-data table tr.sub {
        display: none; }
        .chart-table .chart-data table tr.sub.showing {
          display: table-row; }
        .chart-table .chart-data table tr.sub td {
          color: rgba(33, 41, 52, 0.45); }
          .chart-table .chart-data table tr.sub td:first-child {
            padding-left: 24px; }

.qc-tooltip {
  position: absolute;
  width: 150px;
  padding: 10px;
  opacity: 1;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 2px;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
  z-index: 3; }
  .qc-tooltip h4, .qc-tooltip h5, .qc-tooltip p {
    padding: 0;
    margin: 0 0 6px; }
    .qc-tooltip h4:last-child, .qc-tooltip h5:last-child, .qc-tooltip p:last-child {
      margin-bottom: 0; }

.qc-tooltip.ng-hide-add, .qc-tooltip.ng-hide-remove {
  -webkit-transition: 0.15s linear all;
          transition: 0.15s linear all; }

.qc-tooltip.ng-hide {
  opacity: 0; }

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }
[data-qc-chart='time'] svg {
  padding-top: 10px; }
  [data-qc-chart='time'] svg .qc-axis {
    fill: none; }
    [data-qc-chart='time'] svg .qc-axis .tick {
      fill: rgba(33, 41, 52, 0.3); }
      [data-qc-chart='time'] svg .qc-axis .tick line {
        stroke: rgba(33, 41, 52, 0.3);
        stroke-width: 0.25px; }
  [data-qc-chart='time'] svg .qc-d3-line {
    fill: none;
    stroke-width: 3px;
    stroke-opacity: .7; }
    [data-qc-chart='time'] svg .qc-d3-line.series0 {
      stroke: #1ebff0; }
    [data-qc-chart='time'] svg .qc-d3-line.series1 {
      stroke: #f9a90c; }
    [data-qc-chart='time'] svg .qc-d3-line.series2 {
      stroke: #e85b86; }
    [data-qc-chart='time'] svg .qc-d3-line.series3 {
      stroke: #2ba52b; }
    [data-qc-chart='time'] svg .qc-d3-line.series4 {
      stroke: #e7323a; }
    [data-qc-chart='time'] svg .qc-d3-line.series5 {
      stroke: #ff7262; }
  [data-qc-chart='time'] svg .qc-d3-area.series0 {
    fill: #1ebff0; }
  [data-qc-chart='time'] svg .qc-d3-area.series1 {
    fill: #f9a90c; }
  [data-qc-chart='time'] svg .qc-d3-area.series2 {
    fill: #e85b86; }
  [data-qc-chart='time'] svg .qc-d3-area.series3 {
    fill: #2ba52b; }
  [data-qc-chart='time'] svg .qc-d3-area.series4 {
    fill: #e7323a; }
  [data-qc-chart='time'] svg .qc-d3-area.series5 {
    fill: #ff7262; }
  [data-qc-chart='time'] svg .qc-wordmark {
    opacity: 0.5; }

/*
	Quantcast Page Header Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the
	profile header element (property title, badges, etc)

*/
header.qc-header {
  width: 100%;
  min-width: 1024px;
  margin: 0;
  padding: 20px;
  min-height: 200px;
  color: #fff;
  background-color: #212934; }
  header.qc-header.profile {
    background: url(../images/header-background.jpg) no-repeat #212934;
    background-size: cover; }
    header.qc-header.profile h1, header.qc-header.profile h3 {
      text-align: left; }
  header.qc-header h1, header.qc-header h3 {
    color: #fff;
    text-align: center; }
  header.qc-header h2 {
    color: #fff;
    text-transform: none;
    font-weight: 600; }
  header.qc-header h3 {
    color: rgba(255, 255, 255, 0.6); }
  header.qc-header label {
    cursor: default;
    color: #fff; }
  header.qc-header data {
    font-family: "proxima-nova", "Helvetica Neue", Arial, Verdana, sans-serif;
    padding-top: 0; }
  header.qc-header .container {
    margin: 0 auto;
    width: 100%;
    min-width: 984px;
    min-height: 160px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between; }
    header.qc-header .container.centered {
      -webkit-flex-flow: column nowrap;
          -ms-flex-flow: column nowrap;
              flex-flow: column nowrap;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
          -ms-flex-pack: center;
              justify-content: center; }
  header.qc-header .name {
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 500px;
        -ms-flex: 1 0 500px;
            flex: 1 0 500px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap; }
    header.qc-header .name .site-avatar {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 60px;
          -ms-flex: 0 0 60px;
              flex: 0 0 60px;
      height: 60px;
      margin-right: 10px;
      margin-bottom: 20px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
          -ms-flex-pack: center;
              justify-content: center;
      background: #fff;
      border-radius: 2px; }
    header.qc-header .name .quantified {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 30px;
          -ms-flex: 0 0 30px;
              flex: 0 0 30px;
      height: 25px;
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjE0MHB4IiBoZWlnaHQ9IjExNXB4IiB2aWV3Qm94PSIwIDAgMTQwIDExNSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxuczpza2V0Y2g9Imh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaC9ucyI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDMuMy4yICgxMjA0MykgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+SW1wb3J0ZWQgTGF5ZXJzPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+CiAgICAgICAgPGcgaWQ9IlJhbmtpbmdzIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNTAuMDAwMDAwLCAtMjgzLjAwMDAwMCkiIGZpbGw9IiNGRkZGRkYiPgogICAgICAgICAgICA8cGF0aCBkPSJNMTQzLjk3NSwzODIuODg1IEMxNTUuMzAzLDM3My42MjYgMTYzLjA4NSwzNTkuMjQ0IDE2My4wODUsMzQwLjAzNSBDMTYzLjA4NSwzMDkuMTA0IDEzNy4yNzYsMjgzIDEwNi40NDQsMjgzIEM3NS41MTMsMjgzIDUwLDMwOS4xMDQgNTAsMzQwLjAzNSBDNTAsMzcxLjY1NSA3NC45MjIsMzk3LjU2MiAxMDYuNDQ0LDM5Ny41NjIgTDE4OS4zODYsMzk3LjU2MiBMMTg5LjM4NiwzODIuODg1IEwxNDMuOTc1LDM4Mi44ODUgTDE0My45NzUsMzgyLjg4NSBaIE03OS41NTIsMzQ1LjE1NyBMODcuMTM3LDMzNy4yNzcgTDk5Ljg0NCwzNTAuMTgxIEwxMzAuMzgxLDMxNC42MiBMMTM4LjU1NywzMjEuNTE2IEwxMDMuNDg5LDM2Mi41OTMgTDk2Ljc5LDM2Mi41OTMgTDc5LjU1MiwzNDUuMTU3IEw3OS41NTIsMzQ1LjE1NyBaIiBpZD0iSW1wb3J0ZWQtTGF5ZXJzIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj48L3BhdGg+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain; }
    header.qc-header .name .unquantified {
      padding: 0 10px;
      color: #fff;
      background: rgba(255, 255, 255, 0.2);
      letter-spacing: 2px;
      height: 30px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: center;
      -webkit-justify-content: center;
      text-transform: uppercase; }
    header.qc-header .name h1 {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 100%;
          -ms-flex: 0 0 100%;
              flex: 0 0 100%;
      color: #fff;
      padding-right: 20px; }
      header.qc-header .name h1 small {
        display: block;
        font-size: 15px;
        font-weight: normal;
        color: #fff;
        margin-top: 5px; }
        header.qc-header .name h1 small a {
          color: #fff; }
    header.qc-header .name p {
      font-size: 15px;
      color: #fff;
      margin: 0;
      max-width: 550px;
      max-height: 2.4em;
      overflow-y: hidden;
      word-wrap: break-word; }
  header.qc-header.standalone {
    min-height: 100px;
    min-width: 0;
    background: #fff;
    position: relative;
    color: #212934;
    z-index: 51;
    box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); }
    header.qc-header.standalone.demo {
      z-index: 50; }
    header.qc-header.standalone .container {
      min-height: 0;
      min-width: 0;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between; }
    header.qc-header.standalone .name {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto; }
    header.qc-header.standalone .move {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
          -ms-flex-direction: row-reverse;
              flex-direction: row-reverse;
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto; }
      header.qc-header.standalone .move .button {
        margin-left: 20px; }
    header.qc-header.standalone .process {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-flex: 1;
      -webkit-flex: 1 2 auto;
          -ms-flex: 1 2 auto;
              flex: 1 2 auto; }
    header.qc-header.standalone .process ul {
      margin: 0 auto; }
    header.qc-header.standalone .process ul li {
      list-style-type: none;
      display: inline-block;
      position: relative;
      padding: 0 16px 0;
      border-right: 1px solid rgba(0, 0, 0, 0.1); }
      header.qc-header.standalone .process ul li:last-child {
        border: none; }
    header.qc-header.standalone .process li a {
      color: rgba(0, 0, 0, 0.4);
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      max-width: 100px; }
      header.qc-header.standalone .process li a .step-number {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 30px;
            -ms-flex: 0 0 30px;
                flex: 0 0 30px;
        height: 30px;
        display: inline-block;
        background: rgba(33, 41, 52, 0.3);
        border-radius: 2px;
        margin-right: 8px;
        color: #fff;
        font-weight: 600;
        text-align: center;
        padding: 8px 0 0 0; }
      header.qc-header.standalone .process li a .step-name {
        display: inline-block; }
    header.qc-header.standalone .process li.visited .step-number {
      background: rgba(33, 41, 52, 0.6); }
    header.qc-header.standalone .process li.visited .step-name {
      color: rgba(0, 0, 0, 0.4); }
    header.qc-header.standalone .process li.current .step-number {
      background: #1EBFF0; }
    header.qc-header.standalone .process li.current .step-name {
      color: #212934; }
    header.qc-header.standalone h1, header.qc-header.standalone h2, header.qc-header.standalone h3 {
      color: #212934;
      padding-bottom: 0;
      text-align: left; }
      header.qc-header.standalone h1 small, header.qc-header.standalone h2 small, header.qc-header.standalone h3 small {
        color: #212934;
        font-weight: 600;
        margin-top: 8px; }
    header.qc-header.standalone h1 {
      font-weight: 200; }
  header.qc-header .stats {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 420px;
        -ms-flex: 0 0 420px;
            flex: 0 0 420px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: column nowrap;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end; }
    header.qc-header .stats .badges, header.qc-header .stats .metrics, header.qc-header .stats .summary {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 50px;
          -ms-flex: 0 0 50px;
              flex: 0 0 50px; }
    header.qc-header .stats .badges {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: row-reverse nowrap;
          -ms-flex-flow: row-reverse nowrap;
              flex-flow: row-reverse nowrap;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      margin-bottom: 10px; }
      header.qc-header .stats .badges .badge {
        -webkit-box-flex: 0;
        -webkit-flex: 0 1 200px;
            -ms-flex: 0 1 200px;
                flex: 0 1 200px;
        background: #fff;
        color: #fff;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: row nowrap;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
        border-radius: 2px;
        overflow: hidden; }
        header.qc-header .stats .badges .badge > label {
          -webkit-box-flex: 1;
          -webkit-flex: 1 0 50px;
              -ms-flex: 1 0 50px;
                  flex: 1 0 50px;
          margin: 0;
          background: #1fc1f1;
          display: -webkit-box;
          display: -webkit-flex;
          display: -ms-flexbox;
          display: flex;
          -webkit-flex-flow: column nowrap;
              -ms-flex-flow: column nowrap;
                  flex-flow: column nowrap;
          -webkit-box-pack: center;
          -webkit-justify-content: center;
              -ms-flex-pack: center;
                  justify-content: center;
          -webkit-align-content: center;
              -ms-flex-line-pack: center;
                  align-content: center; }
          header.qc-header .stats .badges .badge > label span {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 auto;
                -ms-flex: 0 0 auto;
                    flex: 0 0 auto;
            line-height: 1;
            display: block;
            font-size: 24px;
            font-weight: bold;
            text-align: center;
            letter-spacing: 2px; }
          header.qc-header .stats .badges .badge > label small {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 auto;
                -ms-flex: 0 0 auto;
                    flex: 0 0 auto;
            line-height: 1;
            display: block;
            font-size: 15px;
            text-transform: uppercase;
            font-weight: 300;
            text-align: center; }
        header.qc-header .stats .badges .badge.unquantified > label {
          background: #999; }
        header.qc-header .stats .badges .badge.unquantified > span {
          color: #999; }
        header.qc-header .stats .badges .badge > span {
          -webkit-box-flex: 1;
          -webkit-flex: 1 1 auto;
              -ms-flex: 1 1 auto;
                  flex: 1 1 auto;
          color: #1fc1f1;
          line-height: 50px;
          text-align: center;
          font-weight: 600;
          text-transform: uppercase;
          letter-spacing: 2px; }
    header.qc-header .stats .metrics {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: row nowrap;
          -ms-flex-flow: row nowrap;
              flex-flow: row nowrap;
      -webkit-box-pack: end;
      -webkit-justify-content: flex-end;
          -ms-flex-pack: end;
              justify-content: flex-end; }
      header.qc-header .stats .metrics .metric {
        -webkit-box-flex: 0;
        -webkit-flex: 0 1 200px;
            -ms-flex: 0 1 200px;
                flex: 0 1 200px;
        line-height: 50px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: row nowrap;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
            -ms-flex-align: center;
                align-items: center; }
        header.qc-header .stats .metrics .metric data {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          padding-right: 20px;
          font-size: 24px;
          font-weight: bold; }
        header.qc-header .stats .metrics .metric label {
          opacity: 0.5;
          line-height: 1.1;
          padding-right: 10px;
          margin: 0; }
        header.qc-header .stats .metrics .metric.unavailable {
          display: none; }
    header.qc-header .stats .summary {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-flow: row nowrap;
          -ms-flex-flow: row nowrap;
              flex-flow: row nowrap;
      background: rgba(255, 255, 255, 0.2);
      border-radius: 2px;
      margin-top: 10px; }
      header.qc-header .stats .summary data {
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        text-align: center;
        line-height: 50px;
        border-right: 1px solid rgba(255, 255, 255, 0.2);
        text-transform: uppercase;
        font-weight: 600;
        letter-spacing: 2px; }
        header.qc-header .stats .summary data:last-child {
          border-right: none; }
  header.qc-header.minimal {
    height: auto;
    min-height: 0; }
    header.qc-header.minimal .container {
      min-height: 0;
      -webkit-flex-flow: column nowrap;
          -ms-flex-flow: column nowrap;
              flex-flow: column nowrap; }
    header.qc-header.minimal .name {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto; }
      header.qc-header.minimal .name h1 {
        padding-bottom: 0; }
    header.qc-header.minimal .stats {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto; }
      header.qc-header.minimal .stats .metrics {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
                justify-content: flex-start; }
        header.qc-header.minimal .stats .metrics .metric {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          -webkit-flex-flow: column nowrap;
              -ms-flex-flow: column nowrap;
                  flex-flow: column nowrap;
          -webkit-box-align: start;
          -webkit-align-items: flex-start;
              -ms-flex-align: start;
                  align-items: flex-start;
          margin: 0;
          padding: 0 30px 0 0; }
          header.qc-header.minimal .stats .metrics .metric label {
            margin: 0 0 8px;
            padding: 0; }
          header.qc-header.minimal .stats .metrics .metric data {
            font-size: 15px;
            margin: 0;
            padding: 0;
            line-height: 1; }
  @media only screen and (max-width: 800px) {
    header.qc-header {
      min-width: 0;
      height: auto; }
      header.qc-header .container {
        min-width: 0;
        min-height: auto;
        -webkit-flex-flow: column nowrap;
            -ms-flex-flow: column nowrap;
                flex-flow: column nowrap; }
        header.qc-header .container .name {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          margin-bottom: 30px; }
        header.qc-header .container .stats {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 auto;
              -ms-flex: 0 0 auto;
                  flex: 0 0 auto;
          -webkit-flex-flow: column-reverse nowrap;
              -ms-flex-flow: column-reverse nowrap;
                  flex-flow: column-reverse nowrap; }
          header.qc-header .container .stats .summary {
            margin-bottom: 10px; }
            header.qc-header .container .stats .summary data:nth-child(3) {
              border-right: none; }
            header.qc-header .container .stats .summary data:nth-child(4) {
              display: none; }
          header.qc-header .container .stats .badges {
            margin-bottom: 10px; }
            header.qc-header .container .stats .badges .badge {
              -webkit-box-flex: 0;
              -webkit-flex: 0 1 50%;
                  -ms-flex: 0 1 50%;
                      flex: 0 1 50%;
              margin: 0 10px; }
              header.qc-header .container .stats .badges .badge:first-child {
                margin-right: 0; }
              header.qc-header .container .stats .badges .badge:last-child {
                margin-left: 0; } }

body.scrolled .standalone {
  position: fixed;
  top: 60px; }
  body.scrolled .standalone.demo {
    position: relative;
    top: 0;
    z-index: 50; }

/*
	Quantcast Panel Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the
	panels throughout our apps. Panels are dialogs which
	come down from the App nav (secondary nav) and are
	modal – they must be acted on or dismissed to allow
	interaction with the rest of the page.

	Dependency: Panels are attached to the secondary nav
	and must be embedded within that object.

*/
.panels {
  position: fixed;
  left: 0;
  width: 100%;
  height: 0;
  overflow: hidden;
  z-index: 52;
  -webkit-transition: -webkit-transform 0.25s ease-out;
          transition: transform 0.25s ease-out;
  background: transparent;
  will-change: transform;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px); }
  .panels.showing-panel {
    height: auto;
    max-height: calc(100vh - 80px - 50px - 70px);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15); }
    .panels.showing-panel:after {
      height: 100vh;
      background: rgba(0, 0, 0, 0.5); }
    .panels.showing-panel .panel {
      background: rgba(255, 255, 255, 0.95);
      min-height: 350px;
      max-height: calc(100vh - 80px - 50px - 70px);
      overflow-y: auto; }
      .panels.showing-panel .panel.active {
        -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
                transform: translateY(0);
        position: relative; }
      .panels.showing-panel .panel .link-list a:hover:not(.current) {
        text-decoration: underline; }
      .panels.showing-panel .panel a.current {
        font-weight: 600;
        color: #212934; }

body.scrolled .panels {
  -webkit-transform: translateY(-70px);
      -ms-transform: translateY(-70px);
          transform: translateY(-70px); }
  body.scrolled .panels.showing-panel {
    max-height: calc(100vh - 50px - 70px); }
    body.scrolled .panels.showing-panel .panel {
      max-height: calc(100vh - 50px - 70px); }

.panel {
  display: block;
  position: absolute;
  z-index: 52;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  padding: 20px;
  border: none;
  -webkit-transition: all 0.25s ease-out;
          transition: all 0.25s ease-out;
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%); }
  .panel a.close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 12px;
    height: 12px;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjEycHgiIGhlaWdodD0iMTJweCIgdmlld0JveD0iMCAwIDEyIDEyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjMgKDEyMDcyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5jcm9zcy1jaXJjbGU8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iRmxpZ2h0LUFzc2lnbm1lbnQiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPgogICAgICAgIDxnIGlkPSJSZWFkeS1Uby1MYXVuY2gtUGFuZWwiIHNrZXRjaDp0eXBlPSJNU0FydGJvYXJkR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMTY4LjAwMDAwMCwgLTE1MC4wMDAwMDApIiBmaWxsPSIjMjEyOTM0Ij4KICAgICAgICAgICAgPGcgaWQ9IlBhbmVsLUNvcHkiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMDAwLCAxMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTE3OS43MDUwNywyMC4yOTI2ODI5IEMxMTc5LjMxMDgyLDE5LjkwMjQzOSAxMTc4LjY3MzQyLDE5LjkwMjQzOSAxMTc4LjI3OTE3LDIwLjI5MjY4MjkgTDExNzMuOTc4NDksMjQuNTk1MzcyMSBMMTE2OS43Mzk4NCwyMC4zNTI3MjA1IEMxMTY5LjM0ODU5LDE5Ljk2MjQ3NjUgMTE2OC43MTQyLDE5Ljk2MjQ3NjUgMTE2OC4zMjQ5NSwyMC4zNTI3MjA1IEMxMTY3LjkzMzcxLDIwLjc0Mjk2NDQgMTE2Ny45MzM3MSwyMS4zODMzNjQ2IDExNjguMzI0OTUsMjEuNzczNjA4NSBMMTE3Mi41NjM2LDI2LjAwNjI1MzkgTDExNjguMjk0OTMsMzAuMjc4OTI0MyBDMTE2Ny45MDE2OSwzMC42NjkxNjgyIDExNjcuOTAxNjksMzEuMzA5NTY4NSAxMTY4LjI5NDkzLDMxLjcwOTgxODYgQzExNjguNjg5MTgsMzIuMTAwMDYyNSAxMTY5LjMyNzU4LDMyLjEwMDA2MjUgMTE2OS43MjE4MywzMS43MDk4MTg2IEwxMTczLjk5MDQ5LDI3LjQzNzE0ODIgTDExNzguMjI5MTQsMzEuNjc5Nzk5OSBDMTE3OC42MjAzOSwzMi4wNzAwNDM4IDExNzkuMjU0NzgsMzIuMDcwMDQzOCAxMTc5LjY0NTAzLDMxLjY3OTc5OTkgQzExODAuMDM2MjcsMzEuMjg5NTU2IDExODAuMDM2MjcsMzAuNjQ5MTU1NyAxMTc5LjY0NTAzLDMwLjI1ODkxMTggTDExNzUuNDA1MzgsMjYuMDI2MjY2NCBMMTE3OS43MDUwNywyMS43MjM1NzcyIEMxMTgwLjA5ODMxLDIxLjMyMzMyNzEgMTE4MC4wOTgzMSwyMC42OTI5MzMxIDExNzkuNzA1MDcsMjAuMjkyNjgyOSBMMTE3OS43MDUwNywyMC4yOTI2ODI5IEwxMTc5LjcwNTA3LDIwLjI5MjY4MjkgWiIgaWQ9ImNyb3NzLWNpcmNsZSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+PC9wYXRoPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
    opacity: 0.2;
    -webkit-transition: all 0.2s ease;
            transition: all 0.2s ease; }
    .panel a.close:hover {
      opacity: 1; }

@media only screen and (max-width: 768px) {
  .panels .tabs > * {
    padding: 0 15px 0 0; }
  .panels .link-list section.labels > * {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 110px;
        -ms-flex: 1 1 110px;
            flex: 1 1 110px; }
  .panels .link-list ul li .title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 0px; }
  .panels .link-list ul li span {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 110px;
        -ms-flex: 0 0 110px;
            flex: 0 0 110px; } }
/*
	Quantcast Modal Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for block modal
	dialog boxes, spawned from buttons in most cases. There are
	considerations for modals that are spawned from the parent page.

	Dependency note: This requires qc.modals.js as well as
	_buttons.scss (or the general Callahan styles which 
	includes that file).

*/
body.open-modal {
  overflow: hidden; }
  body.open-modal #modalContainer {
    visibility: visible;
    opacity: 1; }

#modalContainer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  visibility: hidden;
  opacity: 0;
  z-index: 100;
  will-change: visibility, opacity;
  background: rgba(33, 41, 52, 0.85);
  -webkit-transition: opacity 0.15s ease;
          transition: opacity 0.15s ease; }

.modal {
  width: 460px;
  padding: 30px;
  background: white;
  border-radius: 2px;
  box-shadow: 0px 1px 3px rgba(33, 41, 52, 0.75);
  will-change: transform, opacity;
  -webkit-transform: scale(1.5);
      -ms-transform: scale(1.5);
          transform: scale(1.5);
  opacity: 0; }
  .modal.open {
    -webkit-animation: fall-in ease;
            animation: fall-in ease;
    -webkit-animation-delay: 0;
            animation-delay: 0;
    -webkit-animation-duration: 0.25s;
            animation-duration: 0.25s;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards; }
  .modal.close {
    -webkit-animation: fall-out ease;
            animation: fall-out ease;
    -webkit-animation-delay: 0;
            animation-delay: 0;
    -webkit-animation-duration: 0.25s;
            animation-duration: 0.25s;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards; }
  .modal h2, .modal p {
    text-align: center; }
  .modal h2 {
    margin-bottom: 10px; }
  .modal .button-group {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center; }

@-webkit-keyframes fall-in {
  0% {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
    opacity: 0; }
  60% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    opacity: 1; }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; } }

@keyframes fall-in {
  0% {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
    opacity: 0; }
  60% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    opacity: 1; }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; } }
@-webkit-keyframes fall-out {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: scale(0.75);
            transform: scale(0.75);
    opacity: 0; } }
@keyframes fall-out {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: scale(0.75);
            transform: scale(0.75);
    opacity: 0; } }
/*
	Quantcast Side Panel Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: Styles for panels that come in 
	from the right hand side, like tours or help.

*/
/* Variables */
/* Styles */
.side-panel {
  position: fixed;
  right: 0;
  top: 130px;
  z-index: 73;
  -webkit-transform: translateX(300px);
      -ms-transform: translateX(300px);
          transform: translateX(300px);
  -webkit-transition: all 0.15s ease;
          transition: all 0.15s ease;
  width: 300px;
  height: calc(100vh - 80px - 50px);
  background: rgba(255, 255, 255, 0.95);
  padding: 30px 0 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column nowrap;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); }
  .side-panel.showing {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
  .side-panel .side-panel-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    overflow-y: scroll;
    padding: 0 30px; }
  .side-panel .side-panel-close {
    position: relative;
    z-index: 2;
    padding: 20px 30px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    background: #fff;
    border-top: 1px solid rgba(33, 41, 52, 0.1); }

body.scrolled .side-panel {
  top: 60px;
  height: calc(100vh - 50px - 10px); }

/*
	Quantcast Card Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for all of the
	reports on the Measure 2.0 profile. Each section
	is denoted by an ID except initial global styles.

*/
#trafficCard .axis path, #trafficCard .axis line {
  fill: none;
  stroke: rgba(33, 41, 52, 0.5);
  shape-rendering: crispEdges; }
#trafficCard .axis text {
  font-size: 13px;
  fill: rgba(33, 41, 52, 0.5); }
#trafficCard .y-axis path, #trafficCard .y-axis line, #trafficCard .grid path {
  stroke: none; }
#trafficCard .grid path, #trafficCard .grid line {
  fill: none;
  stroke: rgba(33, 41, 52, 0.1);
  shape-rendering: crispEdges; }
#trafficCard .tick {
  font: 10px sans-serif; }
#trafficCard .cursor text {
  font-size: 13px;
  font-weight: 600;
  fill: #212934; }
#trafficCard .focus line {
  fill: none;
  stroke: rgba(33, 41, 52, 0.5);
  shape-rendering: crispEdges;
  stroke-dasharray: 3,2; }
#trafficCard g.focus.secondary {
  opacity: 0.5; }
#trafficCard .brush .extent {
  stroke: none;
  fill: rgba(102, 102, 102, 0.05); }
#trafficCard .brush .unselected {
  stroke: none;
  fill: white;
  fill-opacity: 0.7; }
#trafficCard .brush .resize rect {
  stroke: none;
  fill: #d8d8d8; }
#trafficCard .label path {
  fill: rgba(250, 170, 11, 0.9);
  stroke: none; }
#trafficCard .data-point-inside {
  fill: #1EBFF0;
  stroke: #fff;
  stroke-width: 1; }
#trafficCard .data-point-outside {
  stroke: #212934;
  stroke-width: 1;
  fill: none; }
#trafficCard .data-point-active-inside {
  fill: #212934;
  stroke: #fff;
  stroke-width: 1; }
#trafficCard .data-point-active-outside {
  fill: transparent;
  stroke: #212934;
  stroke-width: 1; }
#trafficCard .brush-data-area {
  fill: #1EBFF0;
  fill-opacity: 1.0;
  stroke: none; }
#trafficCard .primary .data-line, #trafficCard .sky .data-line {
  fill: none;
  stroke: #1EBFF0;
  stroke-width: 2; }
#trafficCard .primary .data-area, #trafficCard .sky .data-area {
  fill: #1EBFF0;
  stroke: none; }
#trafficCard .gray .data-line {
  fill: none;
  stroke: rgba(33, 41, 52, 0.2);
  stroke-width: 2; }
#trafficCard .gray .data-area, #trafficCard .gray .brush-data-area {
  fill: rgba(33, 41, 52, 0.2);
  stroke: none; }
@media only screen and (max-width: 800px) {
  #trafficCard .data traffic-summary-table .chart-table:first-child {
    padding-top: 60px; } }
@media only screen and (max-width: 800px) {
  #trafficCard .data traffic-summary-table .chart-table:first-child .chart-data table tr td:first-child {
    position: absolute;
    top: 0; } }

#demographicsCard .data section, #politicalCard .data section {
  width: 100%;
  margin: 0 0 40px;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }
  #demographicsCard .data section:last-child, #politicalCard .data section:last-child {
    margin-bottom: 0; }
    @media only screen and (max-width: 800px) {
      #demographicsCard .data section:last-child, #politicalCard .data section:last-child {
        margin: 0 0 20px; } }
  #demographicsCard .data section .dem-icon, #politicalCard .data section .dem-icon {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    height: 50px;
    width: 60px;
    /* ie fix */
    padding-right: 10px;
    -webkit-align-self: flex-start;
        -ms-flex-item-align: start;
            align-self: flex-start; }
    #demographicsCard .data section .dem-icon img, #politicalCard .data section .dem-icon img {
      width: 100%; }
    @media only screen and (max-width: 800px) {
      #demographicsCard .data section .dem-icon, #politicalCard .data section .dem-icon {
        display: none; } }
  @media only screen and (max-width: 800px) {
    #demographicsCard .data section, #politicalCard .data section {
      margin: 0 0 20px; } }
#demographicsCard .has-index .index-line:before, #demographicsCard .has-index .index-label:before, #politicalCard .has-index .index-line:before, #politicalCard .has-index .index-label:before {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 170px;
      -ms-flex: 0 0 170px;
          flex: 0 0 170px; }
  @media only screen and (max-width: 800px) {
    #demographicsCard .has-index .index-line:before, #demographicsCard .has-index .index-label:before, #politicalCard .has-index .index-line:before, #politicalCard .has-index .index-label:before {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto;
      width: 110px; } }
#demographicsCard .has-index .index-line span:before, #politicalCard .has-index .index-line span:before {
  height: calc(100% - 53px); }
#demographicsCard .chart-title-labels, #politicalCard .chart-title-labels {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 100%;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
  width: 100%;
  z-index: 2; }
  #demographicsCard .chart-title-labels .chart-title, #politicalCard .chart-title-labels .chart-title {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: 170px;
    /* ie fix */
    padding-right: 10px;
    text-align: right; }
    @media only screen and (max-width: 800px) {
      #demographicsCard .chart-title-labels .chart-title, #politicalCard .chart-title-labels .chart-title {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
        width: 110px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis; } }
  #demographicsCard .chart-title-labels .chart-label-name, #politicalCard .chart-title-labels .chart-label-name {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis; }

#trafficCard #trafficRollingPeriod:before {
  background: rgba(31, 193, 241, 0.1); }
#trafficCard #trafficTrend:before {
  height: 0;
  border-top: 1px dashed #212934;
  position: relative;
  top: -4px; }
#trafficCard .chart-options {
  padding-left: 40px; }
#trafficCard .small-chart {
  padding-left: 40px; }
#trafficCard .range-toggle {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center; }
  #trafficCard .range-toggle div {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    padding: 0 15px; }
    #trafficCard .range-toggle div.toggle {
      -webkit-box-flex: 0;
      -webkit-flex: 0 1 10px;
          -ms-flex: 0 1 10px;
              flex: 0 1 10px; }
      #trafficCard .range-toggle div.toggle a {
        color: #212934; }
#trafficCard .inactive {
  opacity: .5; }
#trafficCard .disabled {
  opacity: .15;
  pointer-events: none; }
#trafficCard .date-picker {
  border-top: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  padding: 10px 0;
  margin-bottom: 20px; }

#crossplatformCard .chart-options {
  padding-left: 40px; }
#crossplatformCard .small-chart {
  padding-left: 40px; }

.interests .report .data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }
  .interests .report .data section {
    margin: 0 40px 50px 0;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    width: calc(50% - 40px); }
    .interests .report .data section:nth-child(even) {
      margin: 0 0 50px 40px; }
.interests .action-dropdown {
  min-width: 200px; }
@media only screen and (max-width: 800px) {
  .interests .report .data section {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    margin: 10px 0; }
    .interests .report .data section:nth-child(even) {
      margin: 10px 0 20px 0px; } }
.interests .audience-grid-link {
  width: 300px;
  margin-top: -60px;
  margin-bottom: 20px; }
  @media only screen and (max-width: 800px) {
    .interests .audience-grid-link {
      margin-top: 0; } }

/*
	Quantcast Sheet Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the
	panels throughout our apps. Panels are dialogs which
	come down from the App nav (secondary nav) and are
	modal – they must be acted on or dismissed to allow
	interaction with the rest of the page.

*/
.sheets {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  z-index: 71; }
  .sheets.showing-sheet .sheet {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0); }

.sheet {
  visibility: hidden;
  position: fixed;
  z-index: 71;
  bottom: 0;
  left: 0;
  width: 100%;
  height: calc(100vh - 80px - 50px - 30px);
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.15);
  -webkit-transition: all 0.25s ease-out;
          transition: all 0.25s ease-out;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
  will-change: transform; }
  .sheet.current {
    visibility: visible; }
  .sheet .filter-bar {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 71;
    margin-bottom: 0;
    padding-right: 200px; }
  .sheet .sheet-wrapper {
    height: calc(100vh - 50px - 90px);
    width: 100%;
    overflow-y: auto;
    margin-top: 50px; }
  .sheet .sheet-content {
    width: auto;
    max-width: 1200px;
    padding: 30px;
    margin: 30px auto;
    background-color: #fff;
    border: 1px solid rgba(33, 41, 52, 0.075);
    border-radius: 3px; }
    .sheet .sheet-content.unavailable {
      position: relative; }
      .sheet .sheet-content.unavailable section {
        display: none; }
  .sheet .close-sheet {
    position: absolute;
    top: 7px;
    right: 20px;
    z-index: 72; }
  .sheet .report {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap; }
    .sheet .report .data {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 auto;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto;
      padding: 0; }
  .sheet > section {
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(33, 41, 52, 0.1);
    margin-bottom: 40px; }
    .sheet > section:last-child {
      margin-bottom: 0;
      border-bottom: none; }
  .sheet.loading .sheet-content {
    display: none; }

body.scrolled .sheet {
  height: calc(100vh - 50px - 40px); }

.dem-details {
  margin-bottom: 60px; }
  .dem-details h2 {
    padding-left: 60px; }

.dem-details-layout {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  margin-left: 60px; }
  .dem-details-layout .composition {
    padding-right: 30px;
    margin-right: 30px;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 55%;
        -ms-flex: 1 0 55%;
            flex: 1 0 55%;
    border-right: 1px solid rgba(33, 41, 52, 0.1); }
    @media only screen and (max-width: 800px) {
      .dem-details-layout .composition {
        border: none;
        margin-bottom: 50px;
        margin-right: 0;
        -webkit-flex-basis: 100%;
            -ms-flex-preferred-size: 100%;
                flex-basis: 100%;
        padding-right: 0; } }
  .dem-details-layout .index {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 45%;
        -ms-flex: 1 1 45%;
            flex: 1 1 45%; }
  @media only screen and (max-width: 800px) {
    .dem-details-layout {
      -webkit-flex-flow: row wrap;
          -ms-flex-flow: row wrap;
              flex-flow: row wrap; } }

.chart-pair {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap; }
  .chart-pair .pie-chart, .chart-pair pie-chart {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 35%;
        -ms-flex: 0 0 35%;
            flex: 0 0 35%; }
    .chart-pair .pie-chart img, .chart-pair .pie-chart svg, .chart-pair pie-chart img, .chart-pair pie-chart svg {
      width: 100%; }
    .chart-pair .pie-chart .pie-chart-container, .chart-pair pie-chart .pie-chart-container {
      display: inline-block;
      position: relative;
      width: 100%;
      padding-bottom: 100%;
      vertical-align: middle; }
      .chart-pair .pie-chart .pie-chart-container .pie-chart-content, .chart-pair pie-chart .pie-chart-container .pie-chart-content {
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0; }
        .chart-pair .pie-chart .pie-chart-container .pie-chart-content text, .chart-pair pie-chart .pie-chart-container .pie-chart-content text {
          font-size: 12px;
          font-weight: bold; }
      .chart-pair .pie-chart .pie-chart-container span, .chart-pair pie-chart .pie-chart-container span {
        position: absolute;
        top: 75%;
        width: 100%;
        text-align: center;
        display: inline-block;
        color: #fff; }
  .chart-pair .bar-chart {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 65%;
        -ms-flex: 0 0 65%;
            flex: 0 0 65%; }

#demographicsDetailSheet .data section, #politicalDetailSheet .data section {
  width: 100%;
  margin: 0 0 40px;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }
  #demographicsDetailSheet .data section:last-child, #politicalDetailSheet .data section:last-child {
    margin-bottom: 0; }
  #demographicsDetailSheet .data section h5, #politicalDetailSheet .data section h5 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    padding: 0 0 0 190px; }

#demographicsGender {
  background: url(../images/icons/demographics/gender.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#demographicsAge {
  background: url(../images/icons/demographics/age.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#demographicsChildren {
  background: url(../images/icons/demographics/children.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#demographicsEducation {
  background: url(../images/icons/demographics/education.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#demographicsEthnicity {
  background: url(../images/icons/demographics/ethnicity.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#demographicsIncome {
  background: url(../images/icons/demographics/income.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#politicalAffiliation, #politicalPolitics {
  background: url(../images/icons/demographics/political_affiliation.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

#politicalEngagement, #politicalCivic {
  background: url(../images/icons/demographics/political_engagement.svg) 0 0 no-repeat;
  background-size: 40px 40px; }

.mini-sheet {
  position: absolute;
  z-index: 40;
  width: 370px;
  padding: 20px;
  background: #fff;
  border-radius: 2px;
  box-shadow: 0px 2px 4px rgba(33, 41, 52, 0.2); }
  .mini-sheet a.close {
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 20px;
    right: 20px;
    text-indent: -9999px;
    border: 1px solid rgba(0, 150, 200, 0.4);
    -webkit-transition: background-color 0.15s ease;
            transition: background-color 0.15s ease;
    border-radius: 2px;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA4MDAgODAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4MDAgODAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBpZD0iX3g0MF9feDNDX1BhdGhfeDNFX185XyIgZmlsbD0iIzAwOTZDOCIgZD0iTTc0MS4yLDEwLjFMNDAwLDM1MS4yTDU4LjgsMTAuMUM0NS4zLTMuNCwyMy41LTMuNCwxMCwxMC4xcy0xMy41LDM1LjMsMCw0OC44TDM1MS4yLDQwMEwxMC4xLDc0MS4yYy0xMy41LDEzLjUtMTMuNSwzNS4zLDAsNDguOGMxMy41LDEzLjUsMzUuMywxMy41LDQ4LjgsMEw0MDAsNDQ4LjhMNzQxLjIsNzkwYzEzLjUsMTMuNSwzNS4zLDEzLjUsNDguOCwwYzEzLjUtMTMuNSwxMy41LTM1LjMsMC00OC44TDQ0OC44LDQwMEw3OTAsNTguOGMxMy41LTEzLjUsMTMuNS0zNS4zLDAtNDguOFM3NTQuNy0zLjQsNzQxLjIsMTAuMXoiLz48L3N2Zz4=);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 15px 15px; }
    .mini-sheet a.close:hover {
      background-color: rgba(0, 150, 200, 0.1); }
  .mini-sheet:after {
    content: "";
    position: absolute;
    width: 0;
    height: 0; }
  .mini-sheet.top {
    bottom: calc(100% + 20px);
    left: 50%;
    margin-left: -185px; }
    .mini-sheet.top:after {
      border-top: 8px solid #fff;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      bottom: -8px;
      left: 50%;
      margin-left: -6px;
      -webkit-filter: drop-shadow(0px 3px 3px rgba(33, 41, 52, 0.2));
              filter: drop-shadow(0px 3px 3px rgba(33, 41, 52, 0.2)); }
  .mini-sheet.bottom {
    top: calc(100% + 20px);
    left: 50%;
    margin-left: -185px; }
    .mini-sheet.bottom:after {
      border-bottom: 8px solid #fff;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      top: -8px;
      left: 50%;
      margin-left: -6px;
      -webkit-filter: drop-shadow(0px -1px 1px rgba(33, 41, 52, 0.1));
              filter: drop-shadow(0px -1px 1px rgba(33, 41, 52, 0.1)); }
  .mini-sheet.left {
    right: calc(100% + 20px);
    top: 0; }
    .mini-sheet.left:after {
      border-left: 8px solid #fff;
      border-top: 6px solid transparent;
      border-bottom: 6px solid transparent;
      top: 10px;
      right: -8px;
      -webkit-filter: drop-shadow(3px 3px 3px rgba(33, 41, 52, 0.2));
              filter: drop-shadow(3px 3px 3px rgba(33, 41, 52, 0.2)); }
  .mini-sheet.right {
    left: calc(100% + 20px);
    top: 0; }
    .mini-sheet.right:after {
      border-right: 8px solid #fff;
      border-top: 6px solid transparent;
      border-bottom: 6px solid transparent;
      top: 10px;
      left: -8px;
      -webkit-filter: drop-shadow(-3px 3px 3px rgba(33, 41, 52, 0.2));
              filter: drop-shadow(-3px 3px 3px rgba(33, 41, 52, 0.2)); }
  .mini-sheet > *:last-child {
    margin-bottom: 0 !important; }

.sheet-with-alert .sheet-wrapper {
  margin-top: 0; }

@-webkit-keyframes expand-open {
  0% {
    margin-top: 0;
    opacity: 0; }
  0% {
    margin-top: 10px;
    opacity: 1; } }

@keyframes expand-open {
  0% {
    margin-top: 0;
    opacity: 0; }
  0% {
    margin-top: 10px;
    opacity: 1; } }
.bar-chart-categories {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 0; }
  .bar-chart-categories li {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative; }
    .bar-chart-categories li h3 {
      padding: 0; }
    .bar-chart-categories li.showing .action-dropdown {
      display: block; }
    .bar-chart-categories li.has-dropdown h3 {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
          -ms-flex-pack: start;
              justify-content: flex-start; }
      .bar-chart-categories li.has-dropdown h3 a {
        padding-right: 28px; }
        .bar-chart-categories li.has-dropdown h3 a:after {
          content: "";
          display: block;
          width: 0;
          height: 0;
          margin-top: 2px;
          margin-left: 10px;
          border-top: 6px solid #0096C8;
          border-left: 4px solid transparent;
          border-right: 4px solid transparent; }
      .bar-chart-categories li.has-dropdown h3:after {
        content: "/";
        display: block;
        margin: -7px 12px 0 -14px;
        color: rgba(33, 41, 52, 0.3);
        font-size: 27px;
        font-weight: 100; }
    .bar-chart-categories li:first-child .action-dropdown {
      margin-left: 0; }
    .bar-chart-categories li:last-child h3:after {
      display: none; }
  .bar-chart-categories a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start; }
  .bar-chart-categories div.action-dropdown {
    display: none;
    position: absolute;
    right: 0px;
    -webkit-flex-flow: row nowrap;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
    padding: 0 10px 0px 10px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 2px;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
    margin: 10px 0 0 -20px;
    z-index: 1;
    min-width: 180px;
    overflow: visible; }
    .bar-chart-categories div.action-dropdown .action-dropdown-menu {
      padding-left: 0;
      margin-bottom: 0;
      overflow-y: auto;
      max-height: 210px; }
      .bar-chart-categories div.action-dropdown .action-dropdown-menu li {
        color: #212934;
        cursor: pointer;
        padding: 2px 0;
        margin-bottom: 5px; }
        .bar-chart-categories div.action-dropdown .action-dropdown-menu li:last-child {
          margin-bottom: 10px; }
        .bar-chart-categories div.action-dropdown .action-dropdown-menu li.active {
          font-weight: bold; }
        .bar-chart-categories div.action-dropdown .action-dropdown-menu li.disabled {
          color: rgba(33, 41, 52, 0.5);
          cursor: default; }
    .bar-chart-categories div.action-dropdown form {
      padding-bottom: 0; }
      .bar-chart-categories div.action-dropdown form input {
        margin-bottom: 10px;
        padding: 5px;
        min-width: 180px; }
    .bar-chart-categories div.action-dropdown:before {
      content: "";
      display: block;
      width: 10px;
      height: 10px;
      position: relative;
      top: -3px;
      left: calc(100% - 31px);
      margin-left: -4px;
      box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.15);
      -webkit-transform: rotate(225deg);
          -ms-transform: rotate(225deg);
              transform: rotate(225deg);
      background-color: rgba(255, 255, 255, 0.95); }
  @media only screen and (max-width: 800px) {
    .bar-chart-categories div.action-dropdown {
      left: 0px; }
      .bar-chart-categories div.action-dropdown:before {
        left: initial;
        right: -106px; } }

.bar-chart-controls {
  border-bottom: 1px solid rgba(33, 41, 52, 0.1);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-top: 35px; }
  .bar-chart-controls form {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 250px;
        -ms-flex: 0 0 250px;
            flex: 0 0 250px;
    margin-top: -10px; }
    .bar-chart-controls form input {
      padding: 5px;
      width: 100%; }
    @media only screen and (max-width: 800px) {
      .bar-chart-controls form {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100px;
            -ms-flex: 0 0 100px;
                flex: 0 0 100px; } }
    @media only screen and (max-width: 500px) {
      .bar-chart-controls form {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%;
        margin: 10px 0; } }
  .bar-chart-controls .bar-chart-controls-header-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    margin-bottom: 10px; }
    .bar-chart-controls .bar-chart-controls-header-group:nth-child(2) {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 500px;
          -ms-flex: 0 0 500px;
              flex: 0 0 500px; }
      @media only screen and (max-width: 1024px) {
        .bar-chart-controls .bar-chart-controls-header-group:nth-child(2) {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 330px;
              -ms-flex: 0 0 330px;
                  flex: 0 0 330px; } }
      @media only screen and (max-width: 800px) {
        .bar-chart-controls .bar-chart-controls-header-group:nth-child(2) {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 180px;
              -ms-flex: 0 0 180px;
                  flex: 0 0 180px; } }
      @media only screen and (max-width: 500px) {
        .bar-chart-controls .bar-chart-controls-header-group:nth-child(2) {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 100px;
              -ms-flex: 0 0 100px;
                  flex: 0 0 100px; } }
    .bar-chart-controls .bar-chart-controls-header-group.disabled li a, .bar-chart-controls .bar-chart-controls-header-group.disabled li a.active {
      color: rgba(33, 41, 52, 0.5);
      cursor: text; }
    .bar-chart-controls .bar-chart-controls-header-group li {
      list-style: none;
      margin-right: 10px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex; }
      .bar-chart-controls .bar-chart-controls-header-group li a {
        color: rgba(33, 41, 52, 0.5);
        cursor: pointer; }
        .bar-chart-controls .bar-chart-controls-header-group li a.active {
          color: #0096c8; }
      .bar-chart-controls .bar-chart-controls-header-group li:before {
        content: "";
        width: 0;
        height: 0;
        margin-top: 5px;
        margin-right: 5px;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        display: none; }
      .bar-chart-controls .bar-chart-controls-header-group li.bar-chart-controls-order-descending:before {
        border-top: 6px solid rgba(33, 41, 52, 0.5);
        display: block; }
      .bar-chart-controls .bar-chart-controls-header-group li.bar-chart-controls-order-ascending:before {
        border-bottom: 6px solid rgba(33, 41, 52, 0.5);
        display: block; }
  .bar-chart-controls.has-filter .bar-chart-controls-header-group:nth-child(2) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 250px;
        -ms-flex: 0 0 250px;
            flex: 0 0 250px; }
    @media only screen and (max-width: 1024px) {
      .bar-chart-controls.has-filter .bar-chart-controls-header-group:nth-child(2) {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 80px;
            -ms-flex: 0 0 80px;
                flex: 0 0 80px; } }
    @media only screen and (max-width: 500px) {
      .bar-chart-controls.has-filter .bar-chart-controls-header-group:nth-child(2) {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100px;
            -ms-flex: 0 0 100px;
                flex: 0 0 100px; } }

.sheet .bar-chart {
  margin-top: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .sheet .bar-chart li {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin: 0 0 10px; }
    .sheet .bar-chart li:last-child {
      margin-bottom: 0; }
    .sheet .bar-chart li .bar-container {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 100%;
          -ms-flex: 0 0 100%;
              flex: 0 0 100%;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      height: 20px; }
      .sheet .bar-chart li .bar-container .bar-chart-list-number {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 10px;
            -ms-flex: 0 0 10px;
                flex: 0 0 10px;
        margin-right: 10px;
        line-height: 20px;
        color: rgba(33, 41, 52, 0.5); }
        @media only screen and (max-width: 1024px) {
          .sheet .bar-chart li .bar-container .bar-chart-list-number {
            display: none; } }
      .sheet .bar-chart li .bar-container label {
        color: #212934;
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        text-align: left;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 358px;
        margin: 0;
        cursor: initial; }
        .sheet .bar-chart li .bar-container label:before {
          content: "";
          width: 13px;
          min-width: 13px; }
        .sheet .bar-chart li .bar-container label.has-child {
          cursor: pointer; }
          .sheet .bar-chart li .bar-container label.has-child:before {
            content: "";
            display: block;
            width: 0;
            height: 0;
            margin-top: 6px;
            margin-right: 5px;
            border-top: 6px solid #212934;
            border-left: 4px solid transparent;
            border-right: 4px solid transparent;
            -webkit-transform: rotate(-90deg);
                -ms-transform: rotate(-90deg);
                    transform: rotate(-90deg);
            -webkit-transition: all 0.25s ease-out;
                    transition: all 0.25s ease-out;
            min-width: 0px; }
        .sheet .bar-chart li .bar-container label span {
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis; }
      .sheet .bar-chart li .bar-container data {
        color: #212934;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 40px;
            -ms-flex: 0 0 40px;
                flex: 0 0 40px;
        margin: 0 10px 0 15px;
        font-family: "Liberation Mono"; }
      .sheet .bar-chart li .bar-container .bar {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 500px;
            -ms-flex: 0 0 500px;
                flex: 0 0 500px; }
        @media only screen and (max-width: 1024px) {
          .sheet .bar-chart li .bar-container .bar {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 330px;
                -ms-flex: 0 0 330px;
                    flex: 0 0 330px; } }
        @media only screen and (max-width: 800px) {
          .sheet .bar-chart li .bar-container .bar {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 180px;
                -ms-flex: 0 0 180px;
                    flex: 0 0 180px; } }
        @media only screen and (max-width: 500px) {
          .sheet .bar-chart li .bar-container .bar {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 100px;
                -ms-flex: 0 0 100px;
                    flex: 0 0 100px; } }
        .sheet .bar-chart li .bar-container .bar span {
          background-color: #1fc1f1; }
      .sheet .bar-chart li .bar-container.open {
        height: auto; }
        .sheet .bar-chart li .bar-container.open > label.has-child:before {
          -webkit-transform: rotate(0deg);
              -ms-transform: rotate(0deg);
                  transform: rotate(0deg); }
    .sheet .bar-chart li .bar-chart-nested {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 calc(100% - 50px);
          -ms-flex: 0 0 calc(100% - 50px);
              flex: 0 0 calc(100% - 50px);
      margin-left: 50px;
      display: none;
      height: 0;
      margin-top: 0;
      opacity: 0; }
      @media only screen and (max-width: 800px) {
        .sheet .bar-chart li .bar-chart-nested {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 calc(100% - 30px);
              -ms-flex: 0 0 calc(100% - 30px);
                  flex: 0 0 calc(100% - 30px);
          margin-left: 30px; } }
      @media only screen and (max-width: 500px) {
        .sheet .bar-chart li .bar-chart-nested {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 calc(100% - 10px);
              -ms-flex: 0 0 calc(100% - 10px);
                  flex: 0 0 calc(100% - 10px);
          margin-left: 10px; } }
      .sheet .bar-chart li .bar-chart-nested label {
        color: rgba(33, 41, 52, 0.5); }
        .sheet .bar-chart li .bar-chart-nested label.has-child:before {
          border-top: 6px solid rgba(33, 41, 52, 0.5); }
      .sheet .bar-chart li .bar-chart-nested data {
        color: rgba(33, 41, 52, 0.5); }
      .sheet .bar-chart li .bar-chart-nested.open {
        -webkit-transition: expand-open 0.25s ease-out;
                transition: expand-open 0.25s ease-out;
        margin-top: 10px;
        height: auto;
        opacity: 1;
        display: block; }
      .sheet .bar-chart li .bar-chart-nested .bar span {
        background-color: rgba(31, 193, 241, 0.5); }
@media only screen and (max-width: 800px) {
  .sheet .card-controls .card-controls-section {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    padding-top: 15px;
    border-top: 1px solid rgba(33, 41, 52, 0.1); } }
@media only screen and (max-width: 800px) {
  .sheet .card-controls {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; } }

/*
	Quantcast Filter Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for the
	filter sidebar that slides in, as well as the
	secondary sidebars that can come in with more
	detail.

*/
.filters {
  position: fixed;
  top: 130px;
  right: 0;
  overflow: hidden;
  width: 382px;
  height: calc(100vh - 80px - 50px);
  z-index: 51;
  -webkit-transition: all 0.15s ease-out;
          transition: all 0.15s ease-out;
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%); }
  .filters.showing-filters {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }

#mainFilters {
  position: absolute;
  z-index: 51;
  top: 0;
  right: 0;
  width: 362px;
  height: calc(100vh - 80px - 50px);
  overflow-y: scroll;
  padding: 10px 20px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.15);
  -webkit-transition: all 0.15s ease-out;
          transition: all 0.15s ease-out; }

body.scrolled .filters {
  top: calc(50px + 10px);
  height: calc(100vh - 10px - 50px); }
  body.scrolled .filters #mainFilters {
    height: calc(100vh - 10px - 50px); }

/*
	Quantcast Page Table Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This table contains styles for a generic table in the callahan UI.

*/
table.data-table {
  text-align: left;
  border: 1px solid rgba(33, 41, 52, 0.1);
  border-radius: 4px;
  width: 100%;
  margin: 10px 0 30px; }
  table.data-table th {
    background: #212934;
    color: white;
    padding: 17px 10px; }
    table.data-table th:first-child {
      padding-left: 30px; }
    table.data-table th:last-child {
      padding-right: 30px; }
  table.data-table td {
    padding: 17px 10px;
    border-bottom: 1px solid rgba(33, 41, 52, 0.1); }
    table.data-table td:first-child {
      padding-left: 30px; }
    table.data-table td:last-child {
      padding-right: 30px; }

/*
	Quantcast Tooltip Styles

	Author: Quantcast UX / Jonathan Smiley
	Email: jsmiley@quantcast.com

	Description: This file contains styles for tooltips, which
	are viewed by hovering on tooltip active areas. This includes
	base styles and overrides for specific components.

*/
.visible [data-qc-tooltip] {
  border-bottom: 1px dotted #0096C8;
  -webkit-animation: tooltip-cue 20s 1;
          animation: tooltip-cue 20s 1;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards; }

#activeTooltip, #data-tooltip {
  font-size: 13px;
  color: #212934;
  text-transform: none;
  letter-spacing: 0;
  font-weight: normal;
  opacity: 1;
  width: 260px;
  padding: 10px;
  position: absolute;
  left: 100%;
  top: 100%;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
  border-radius: 3px;
  z-index: 50; }

.active-point {
  -webkit-transition: opacity .1s linear;
          transition: opacity .1s linear; }

#data-tooltip {
  width: auto;
  min-width: 200px;
  margin-left: 5px;
  position: absolute; }
  #data-tooltip table tr, #data-tooltip table td {
    height: 20px;
    line-height: 20px; }
  #data-tooltip legend {
    max-width: 150px; }
    #data-tooltip legend:before {
      margin-left: 0; }

@-webkit-keyframes tooltip-cue {
  0% {
    border-bottom: 1px dotted #0096C8; }
  95% {
    border-bottom: 1px dotted #0096C8; }
  100% {
    border-bottom: 1px dotted transparent; } }

@keyframes tooltip-cue {
  0% {
    border-bottom: 1px dotted #0096C8; }
  95% {
    border-bottom: 1px dotted #0096C8; }
  100% {
    border-bottom: 1px dotted transparent; } }
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-resource {
  display: none !important; }

#start_button {
  display: block;
  position: fixed;
  bottom: 10px;
  right: 10px;
  -webkit-transition: all 0.2s ease-out;
          transition: all 0.2s ease-out;
  z-index: 10000000000;
  /*a {
          background: map-get($qc-color, midnight);
          color: #fff;
          border: 0
      }
      img {
          top: 47px;
          left: -70px;
          width: 150px;
          position: relative;
      }*/ }
  #start_button.hide {
    bottom: -280px; }
  #start_button .onboarding-button-container {
    text-align: left; }

.onboarding-popover {
  position: absolute;
  z-index: 100001;
  padding: 1px;
  text-align: left;
  white-space: normal;
  background-color: #ffffff;
  border-radius: 4px;
  background-clip: padding-box;
  max-width: 800px;
  max-height: 800px;
  min-width: 300px;
  min-height: 50px; }

.onboarding-popover.onboarding-top {
  margin-top: -10px; }

.onboarding-popover.onboarding-right {
  margin-left: 10px; }

.onboarding-popover.onboarding-bottom {
  margin-top: 10px; }

.onboarding-popover.onboarding-left {
  margin-left: -10px; }

.onboarding-popover.onboarding-centered {
  top: 50vh;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }

.onboarding-arrow,
.onboarding-arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.onboarding-arrow {
  border-width: 11px; }

.onboarding-arrow:after {
  border-width: 10px;
  content: ""; }

.onboarding-popover.onboarding-bottom .onboarding-arrow {
  top: -11px;
  left: 10%;
  margin-left: -11px;
  border-bottom-color: #cccccc;
  border-top-width: 0; }

.onboarding-popover.onboarding-bottom .onboarding-arrow:after {
  content: " ";
  top: 1px;
  margin-left: -10px;
  border-top-width: 0;
  border-bottom-color: #ffffff; }

.onboarding-popover.onboarding-top .onboarding-arrow {
  bottom: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-color: #cccccc;
  border-bottom-width: 0; }

.onboarding-popover.onboarding-top .onboarding-arrow:after {
  content: " ";
  bottom: 1px;
  margin-left: -10px;
  border-bottom-width: 0;
  border-top-color: #ffffff; }

.onboarding-popover.onboarding-left .onboarding-arrow {
  top: 10%;
  right: -11px;
  margin-top: -11px;
  border-left-color: #cccccc;
  border-right-width: 0; }

.onboarding-popover.onboarding-left .onboarding-arrow:after {
  content: " ";
  right: 1px;
  border-right-width: 0;
  border-left-color: #ffffff;
  bottom: -10px; }

.onboarding-popover.onboarding-right .onboarding-arrow {
  top: 10%;
  left: -11px;
  margin-top: -11px;
  border-right-color: #cccccc;
  border-left-width: 0; }

.onboarding-popover.onboarding-right .onboarding-arrow:after {
  content: " ";
  left: 1px;
  bottom: -10px;
  border-left-width: 0;
  border-right-color: #ffffff; }

.onboarding-popover-title {
  position: relative;
  padding: 15px;
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0px;
  line-height: 15px;
  text-transform: none;
  background-color: #ffffff;
  border-radius: 5px 5px 0 0; }

.onboarding-close-button {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 12px;
  height: 12px;
  display: inline-block;
  font-size: 110%;
  color: transparent;
  background: url(../images/buttons/close.svg) center center no-repeat;
  opacity: .4;
  font-family: Arial, sans-serif;
  -webkit-transition: all 0.15s ease-in-out;
          transition: all 0.15s ease-in-out; }

.onboarding-close-button:hover {
  opacity: .6; }

.onboarding-popover-content {
  padding: 5px 15px; }
  .onboarding-popover-content p {
    line-height: 1.4; }

.onboarding-button-container {
  text-align: right;
  padding: 10px 15px 15px 15px;
  display: block; }

.onboarding-overlay {
  position: absolute;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  -webkit-transition: 1s all;
          transition: 1s all; }

.onboarding-focus {
  z-index: 100000;
  border-radius: 4px; }
  .onboarding-focus#fixedNav, .onboarding-focus#trafficCard {
    padding: 10px 0 0 10px;
    background: #fff; }
  .onboarding-focus#onpageNav, main left-nav-panel.onboarding-focus, .onboarding-focus#fixedNav::before {
    top: 47px; }
  .onboarding-focus#appNav {
    z-index: 100000; }

.onboarding-step-info {
  float: left;
  text-align: left;
  display: inline-block;
  margin-top: 12px; }

.tour {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 10px 0 0 0; }

.tour li {
  margin: auto;
  padding: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 150px;
      -ms-flex: 1 1 150px;
          flex: 1 1 150px; }

.tour img {
  border: 1px solid #212934;
  border-radius: 100%; }

#tour-point {
  display: block;
  right: calc(50% + 25px);
  position: absolute;
  top: -25px;
  -webkit-transition: all 0.2s ease-out;
          transition: all 0.2s ease-out; }
  .onboarding-left #tour-point {
    left: 20px;
    display: block; }
  .onboarding-bottom #tour-point {
    top: -20px;
    display: block; }
  .onboarding-right #tour-point {
    left: -20px;
    display: block; }
  .onboarding-top #tour-point {
    top: 20px;
    display: block; }
  #tour-point.hidden {
    display: none; }

.pulse {
  width: 10px;
  height: 10px;
  border: 5px solid #1fc1f1;
  border-radius: 30px;
  background-color: #716f42;
  z-index: 10;
  position: absolute;
  left: 20px;
  top: 20px; }

.dot {
  border: 10px solid #1fc1f1;
  background: transparent;
  border-radius: 60px;
  height: 100px;
  width: 100px;
  -webkit-animation: pulse 3s ease-out;
          animation: pulse 3s ease-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  position: absolute;
  left: -25px;
  top: -25px;
  z-index: 1;
  opacity: 0; }

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0.1);
            transform: scale(0.1);
    opacity: 0.1; }
  25% {
    -webkit-transform: scale(0.3);
            transform: scale(0.3);
    opacity: 0.3; }
  50% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    opacity: 0.3; }
  75% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    opacity: 0.5; }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0.0; } }

@keyframes pulse {
  0% {
    -webkit-transform: scale(0.1);
            transform: scale(0.1);
    opacity: 0.1; }
  25% {
    -webkit-transform: scale(0.3);
            transform: scale(0.3);
    opacity: 0.3; }
  50% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    opacity: 0.3; }
  75% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    opacity: 0.5; }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0.0; } }
/** INCLUDES WEEK

#date-picker, .week, .day {
  display: flex;
}

.week:first-of-type .day:first-of-type {
  margin-left: 42.85714%;
}

.week:last-of-type .day:last-of-type {
  margin-right: 14.285%;
}

#date-picker {
  max-width: 600px;
  flex-flow: row wrap;
  background: #fff;
  justify-content: space-around;
}

.month {
  flex: 1 1 auto;
}

.week {
  height: 40px;
}

.day {
  color: map-get($qc-color, midnight);
  padding: 5px;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
}
*/
.date-picker > div {
  position: relative; }

.kalendae {
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  background: #fff;
  -webkit-box-pack: start;
  -webkit-justify-content: start;
      -ms-flex-pack: start;
          justify-content: start;
  font-size: 13px;
  min-width: 280px;
  color: #212934;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 10;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25); }

.kalendae, .k-days, .k-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }

.kalendae.hidden {
  display: none; }

.k-calendar {
  margin: 10px; }

/** Kalendae.Input's popup close button **/
.kalendae .k-btn-close {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 16px;
  height: 16px;
  background: white;
  border: 2px solid #ccc;
  color: #212934;
  line-height: 17px;
  text-align: center;
  font-size: 13px;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.75);
  cursor: pointer;
  text-decoration: none; }

.kalendae .k-btn-close:after {
  content: "\2716"; }

.kalendae .k-btn-close:hover {
  color: #7EA0E2;
  background: white;
  border-color: #7EA0E2; }

/** Month Title Row **/
.k-title {
  text-align: center;
  white-space: nowrap;
  position: relative;
  height: 18px;
  margin: 10px; }

.k-caption {
  font-weight: 600; }

/** Month and Year Buttons **/
.kalendae .k-btn-previous-month,
.kalendae .k-btn-next-month,
.kalendae .k-btn-previous-year,
.kalendae .k-btn-next-year {
  width: 16px;
  height: 16px;
  cursor: pointer;
  position: absolute;
  top: -3px;
  color: rgba(33, 41, 52, 0.5);
  font-size: 26px;
  line-height: 18px;
  text-decoration: none; }

.kalendae .k-btn-previous-year {
  left: 0; }

.kalendae .k-btn-previous-month {
  left: 16px; }

.kalendae .k-btn-next-month {
  right: 16px; }

.kalendae .k-btn-next-year {
  right: 0; }

.kalendae .k-btn-previous-month:after {
  content: "\2039"; }

.kalendae .k-btn-next-month:after {
  content: "\203A"; }

.kalendae .k-btn-previous-year:after {
  content: "\00AB"; }

.kalendae .k-btn-next-year:after {
  content: "\00BB"; }

.kalendae .k-btn-previous-month:hover,
.kalendae .k-btn-next-month:hover {
  color: #212934; }

.kalendae .k-btn-previous-year:hover,
.kalendae .k-btn-next-year:hover {
  color: #212934; }

/** Remove extra buttons when calendar shows multiple months **/
.kalendae .k-first-month .k-btn-next-month,
.kalendae .k-middle-month .k-btn-next-month,
.kalendae .k-middle-month .k-btn-previous-month,
.kalendae .k-last-month .k-btn-previous-month,
.kalendae .k-first-month .k-btn-next-year,
.kalendae .k-middle-month .k-btn-next-year,
.kalendae .k-middle-month .k-btn-previous-year,
.kalendae .k-last-month .k-btn-previous-year {
  display: none; }

/** Disable year nav option **/
.kalendae .k-title.k-disable-year-nav .k-btn-next-year,
.kalendae .k-title.k-disable-year-nav .k-btn-previous-year {
  display: none; }

.kalendae .k-title.k-disable-year-nav .k-btn-next-month {
  right: 0; }

.kalendae .k-title.k-disable-year-nav .k-btn-previous-month {
  left: 0; }

/** Hide unusable buttons **/
.kalendae.k-disable-next-month-btn .k-btn-next-month,
.kalendae.k-disable-previous-month-btn .k-btn-previous-month,
.kalendae.k-disable-next-year-btn .k-btn-next-year,
.kalendae.k-disable-previous-year-btn .k-btn-previous-year {
  display: none; }

/* OTHER STYLES */
.k-days {
  max-width: 260px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }

.k-days span, .k-header span {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 6px 5px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 36px;
      -ms-flex: 1 1 36px;
          flex: 1 1 36px;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center; }

.k-days span {
  background: #FAFAFA;
  color: rgba(33, 41, 52, 0.3); }

.k-header span {
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px;
  color: rgba(33, 41, 52, 0.5); }

/** Today **/
.k-today {
  color: #0096c8;
  font-weight: 600;
  border: 1px solid #0096c8;
  border-radius: 3px; }

/** Selectable  **/
.k-days .k-active {
  cursor: pointer;
  background: #fff;
  color: #212934;
  border-radius: 3px; }

/** Days outside of the month view (before the first day of the month, after the last day of the month) **/
.k-out-of-month {
  color: #212934;
  background: #fff;
  opacity: 0.3; }

/** Days between the start and end points on a range, outside of the selectable area **/
.k-days .k-range {
  background: rgba(31, 193, 241, 0.5);
  border-radius: 0; }

/** Selected day, when outside the selectable area **/
.k-selected {
  background: rgba(31, 193, 241, 0.5); }

/** Selectable day, hovered **/
.k-active:hover {
  background: rgba(31, 193, 241, 0.3); }

/** Selected day, when inside the selectable area **/
.k-selected.k-active {
  background: #1fc1f1;
  color: white; }

.sheet-content .message, .panel .message {
  color: rgba(33, 41, 52, 0.6);
  padding-top: 10px;
  text-align: center;
  min-height: 120px; }
  .sheet-content .message .title, .panel .message .title {
    margin-top: 15px;
    font-size: 18px; }

.sheet-content.unavailable h2, main #cards .card.unavailable h2 {
  margin-bottom: 0; }
.sheet-content.unavailable h4, main #cards .card.unavailable h4 {
  margin: 2px 0 20px 0;
  font-weight: 400; }
.sheet-content.unavailable p, main #cards .card.unavailable p {
  max-width: 50%; }
  @media only screen and (max-width: 800px) {
    .sheet-content.unavailable p, main #cards .card.unavailable p {
      max-width: 100%; } }
.sheet-content.unavailable img, main #cards .card.unavailable img {
  position: absolute;
  bottom: 0;
  right: 5%;
  max-width: 50%;
  height: auto;
  width: 361px; }
  .sheet-content.unavailable img.rect, main #cards .card.unavailable img.rect {
    width: 456px;
    right: 0; }
  @media only screen and (max-width: 800px) {
    .sheet-content.unavailable img, main #cards .card.unavailable img {
      display: none; } }

main #cards .card.unavailable {
  background: rgba(255, 255, 255, 0.1); }
  main #cards .card.unavailable .data {
    position: static; }
main #cards .card.message {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background: rgba(255, 255, 255, 0.1);
  text-align: left; }
  main #cards .card.message .data {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 60%;
        -ms-flex: 0 1 60%;
            flex: 0 1 60%; }
    main #cards .card.message .data p:last-child {
      margin: 0; }
    @media only screen and (max-width: 800px) {
      main #cards .card.message .data {
        -webkit-flex-basis: 100%;
            -ms-flex-preferred-size: 100%;
                flex-basis: 100%;
        margin-bottom: 20px; } }
  main #cards .card.message .additional {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center; }

body.add-contrast.level1 {
  background: rgba(33, 41, 52, 0.08); }
  body.add-contrast.level1 main #cards .card {
    border-color: rgba(33, 41, 52, 0.12); }
body.add-contrast.level2 {
  background: rgba(33, 41, 52, 0.15); }
  body.add-contrast.level2 main #cards .card {
    border-color: rgba(33, 41, 52, 0.25); }

/*
	Quantcast Campaign Renewals

	Author: Quantcast UX / Alex Fox
	Email: afox@quantcast.com

	Description: This file contains styles exclusive to the campaign renewal UI.

*/
.placement {
  border-bottom: 1px solid rgba(33, 41, 52, 0.1);
  padding: 30px 0 20px; }
  .placement:last-child {
    border-bottom: 3px solid rgba(33, 41, 52, 0.1); }
  .placement .grid {
    margin-bottom: 15px; }
  .placement .pl-info:last-child {
    text-align: right; }
  .placement .pl-info label {
    font-weight: bold; }

#orderSummary {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  text-align: right; }
  #orderSummary table {
    border: none;
    width: auto;
    margin: 30px 0; }
    #orderSummary table th {
      background: #212934;
      color: white;
      padding: 0; }
    #orderSummary table td {
      padding: 0;
      border-bottom: none; }
  #orderSummary table td {
    padding: 5px 0; }
    #orderSummary table td:first-child {
      font-weight: bold;
      padding-right: 40px; }