/*------------------------------------*    $PATTERN LAB-SPECIFIC STYLES
\*------------------------------------*/
/**
 * This stylesheet is for styles you want to include only when the interface is being viewed within Pattern Lab.
 * This is helpful for displaying demo styles for grids, animations, color swatches, etc
 * It's also helpful for overriding context-specific styles like fixed or absolutely positioned elements
 * These styles will not be your production CSS.
 */
/* Style Guide Interface Colors */
/* Typography */
/* Defaults */
/* Dimensions */
/* Breakpoints */
.demo {
  overflow: hidden;
  margin-bottom: 1rem; }

.demo .gi, .demo .demo-block {
  background: #ddd;
  color: #808080;
  text-align: center;
  margin-bottom: 0.5em;
  padding: 1em !important; }
  .demo .gi:nth-of-type(2n), .demo .demo-block:nth-of-type(2n) {
    color: #ddd;
    background: #808080; }
  .demo .gi .gi, .demo .demo-block .gi {
    background: rgba(0, 0, 0, 0.1);
    color: #ddd; }
    .demo .gi .gi:nth-of-type(2n), .demo .demo-block .gi:nth-of-type(2n) {
      background: rgba(0, 0, 0, 0.3); }

.demo-animate {
  background: #ddd;
  padding: 1em;
  margin-bottom: 1em;
  text-align: center; }

.animate-move {
  position: relative; }
  .animate-move .demo-shape {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 20px;
    background: #808080; }
  .animate-move:hover > .demo-shape {
    left: 100%;
    margin-left: -20px; }

.sg-swatch {
  display: block;
  height: 1.5em;
  width: 50%; }
  @media all and (max-width: 30em) {
    .sg-swatch {
      float: left;
      margin-right: 0.3em; } }
  @media all and (min-width: 30em) {
    .sg-swatch {
      width: 100%;
      height: 4em;
      margin-bottom: 0.2em; } }

.sg-label {
  line-height: 1; }

/*
 * A partial implementation of the Ruby list functions from Compass:
 * https://github.com/Compass/compass/blob/stable/lib/compass/sass_extensions/functions/lists.rb
 */
/*
 * A partial implementation of the Ruby constants functions from Compass:
 * https://github.com/Compass/compass/blob/stable/lib/compass/sass_extensions/functions/constants.rb
 */
/*
 * A partial implementation of the Ruby display functions from Compass:
 * https://github.com/Compass/compass/blob/stable/core/lib/compass/core/sass_extensions/functions/display.rb
 */
.color-guide ul {
  margin: 0;
  padding: 0; }

.color-guide li {
  list-style: none;
  height: 3.75em;
  position: relative;
  display: block;
  width: 100%; }
  .color-guide li:after {
    content: "";
    display: table;
    clear: both; }
  @media (min-width: 500px) and (max-width: 1050px) {
    .color-guide li {
      width: 33.33333%;
      clear: right;
      float: left;
      margin-left: 0;
      margin-right: 0%; }
      .color-guide li:nth-child(3n) {
        width: 33.33333%;
        clear: right;
        float: right;
        margin-right: 0; }
      .color-guide li:nth-child(6n) {
        margin-bottom: 1em; } }
  @media (min-width: 1050px) {
    .color-guide li {
      width: 16.66667%;
      clear: right;
      float: left;
      margin-left: 0;
      margin-right: 0%; }
      .color-guide li:nth-child(6n) {
        width: 16.66667%;
        clear: right;
        float: right;
        margin-right: 0; } }
  .color-guide li:before, .color-guide li:after, .color-guide li:nth-child(6n):before, .color-guide li:nth-child(6n):after {
    position: absolute;
    height: 1.25em;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    left: 0;
    text-align: center; }
  .color-guide li:before {
    top: .25em; }
  .color-guide li:after {
    bottom: .25em; }
  .color-guide li:nth-child(1) {
    background-color: #ff0000; }
    .color-guide li:nth-child(1):before, .color-guide li:nth-child(1):after {
      color: black; }
    .color-guide li:nth-child(1):before {
      content: "#ff0000"; }
    .color-guide li:nth-child(1):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(2) {
    background-color: #ff4040; }
    .color-guide li:nth-child(2):before, .color-guide li:nth-child(2):after {
      color: black; }
    .color-guide li:nth-child(2):before {
      content: "#ff4040"; }
    .color-guide li:nth-child(2):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(3) {
    background-color: #ff8080; }
    .color-guide li:nth-child(3):before, .color-guide li:nth-child(3):after {
      color: black; }
    .color-guide li:nth-child(3):before {
      content: "#ff8080"; }
    .color-guide li:nth-child(3):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(4) {
    background-color: #ffbfbf; }
    .color-guide li:nth-child(4):before, .color-guide li:nth-child(4):after {
      color: black; }
    .color-guide li:nth-child(4):before {
      content: "#ffbfbf"; }
    .color-guide li:nth-child(4):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(5) {
    background-color: #ffd9d9; }
    .color-guide li:nth-child(5):before, .color-guide li:nth-child(5):after {
      color: black; }
    .color-guide li:nth-child(5):before {
      content: "#ffd9d9"; }
    .color-guide li:nth-child(5):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(6) {
    background-color: #ffe6e6; }
    .color-guide li:nth-child(6):before, .color-guide li:nth-child(6):after {
      color: black; }
    .color-guide li:nth-child(6):before {
      content: "#ffe6e6"; }
    .color-guide li:nth-child(6):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(7) {
    background-color: #ff0000; }
    .color-guide li:nth-child(7):before, .color-guide li:nth-child(7):after {
      color: black; }
    .color-guide li:nth-child(7):before {
      content: "#ff0000"; }
    .color-guide li:nth-child(7):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(8) {
    background-color: #bf0000; }
    .color-guide li:nth-child(8):before, .color-guide li:nth-child(8):after {
      color: white; }
    .color-guide li:nth-child(8):before {
      content: "#bf0000"; }
    .color-guide li:nth-child(8):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(9) {
    background-color: maroon; }
    .color-guide li:nth-child(9):before, .color-guide li:nth-child(9):after {
      color: white; }
    .color-guide li:nth-child(9):before {
      content: "maroon"; }
    .color-guide li:nth-child(9):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(10) {
    background-color: #400000; }
    .color-guide li:nth-child(10):before, .color-guide li:nth-child(10):after {
      color: white; }
    .color-guide li:nth-child(10):before {
      content: "#400000"; }
    .color-guide li:nth-child(10):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(11) {
    background-color: #260000; }
    .color-guide li:nth-child(11):before, .color-guide li:nth-child(11):after {
      color: white; }
    .color-guide li:nth-child(11):before {
      content: "#260000"; }
    .color-guide li:nth-child(11):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(12) {
    background-color: #1a0000; }
    .color-guide li:nth-child(12):before, .color-guide li:nth-child(12):after {
      color: white; }
    .color-guide li:nth-child(12):before {
      content: "#1a0000"; }
    .color-guide li:nth-child(12):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(13) {
    background-color: #f8941d; }
    .color-guide li:nth-child(13):before, .color-guide li:nth-child(13):after {
      color: black; }
    .color-guide li:nth-child(13):before {
      content: "#f8941d"; }
    .color-guide li:nth-child(13):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(14) {
    background-color: #faaf56; }
    .color-guide li:nth-child(14):before, .color-guide li:nth-child(14):after {
      color: black; }
    .color-guide li:nth-child(14):before {
      content: "#faaf56"; }
    .color-guide li:nth-child(14):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(15) {
    background-color: #fcca8e; }
    .color-guide li:nth-child(15):before, .color-guide li:nth-child(15):after {
      color: black; }
    .color-guide li:nth-child(15):before {
      content: "#fcca8e"; }
    .color-guide li:nth-child(15):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(16) {
    background-color: #fde4c7; }
    .color-guide li:nth-child(16):before, .color-guide li:nth-child(16):after {
      color: black; }
    .color-guide li:nth-child(16):before {
      content: "#fde4c7"; }
    .color-guide li:nth-child(16):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(17) {
    background-color: #feefdd; }
    .color-guide li:nth-child(17):before, .color-guide li:nth-child(17):after {
      color: black; }
    .color-guide li:nth-child(17):before {
      content: "#feefdd"; }
    .color-guide li:nth-child(17):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(18) {
    background-color: #fef4e8; }
    .color-guide li:nth-child(18):before, .color-guide li:nth-child(18):after {
      color: black; }
    .color-guide li:nth-child(18):before {
      content: "#fef4e8"; }
    .color-guide li:nth-child(18):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(19) {
    background-color: #f8941d; }
    .color-guide li:nth-child(19):before, .color-guide li:nth-child(19):after {
      color: black; }
    .color-guide li:nth-child(19):before {
      content: "#f8941d"; }
    .color-guide li:nth-child(19):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(20) {
    background-color: #ba6f16; }
    .color-guide li:nth-child(20):before, .color-guide li:nth-child(20):after {
      color: white; }
    .color-guide li:nth-child(20):before {
      content: "#ba6f16"; }
    .color-guide li:nth-child(20):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(21) {
    background-color: #7c4a0f; }
    .color-guide li:nth-child(21):before, .color-guide li:nth-child(21):after {
      color: white; }
    .color-guide li:nth-child(21):before {
      content: "#7c4a0f"; }
    .color-guide li:nth-child(21):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(22) {
    background-color: #3e2507; }
    .color-guide li:nth-child(22):before, .color-guide li:nth-child(22):after {
      color: white; }
    .color-guide li:nth-child(22):before {
      content: "#3e2507"; }
    .color-guide li:nth-child(22):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(23) {
    background-color: #251604; }
    .color-guide li:nth-child(23):before, .color-guide li:nth-child(23):after {
      color: white; }
    .color-guide li:nth-child(23):before {
      content: "#251604"; }
    .color-guide li:nth-child(23):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(24) {
    background-color: #190f03; }
    .color-guide li:nth-child(24):before, .color-guide li:nth-child(24):after {
      color: white; }
    .color-guide li:nth-child(24):before {
      content: "#190f03"; }
    .color-guide li:nth-child(24):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(25) {
    background-color: #555555; }
    .color-guide li:nth-child(25):before, .color-guide li:nth-child(25):after {
      color: white; }
    .color-guide li:nth-child(25):before {
      content: "#555555"; }
    .color-guide li:nth-child(25):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(26) {
    background-color: gray; }
    .color-guide li:nth-child(26):before, .color-guide li:nth-child(26):after {
      color: black; }
    .color-guide li:nth-child(26):before {
      content: "gray"; }
    .color-guide li:nth-child(26):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(27) {
    background-color: #aaaaaa; }
    .color-guide li:nth-child(27):before, .color-guide li:nth-child(27):after {
      color: black; }
    .color-guide li:nth-child(27):before {
      content: "#aaaaaa"; }
    .color-guide li:nth-child(27):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(28) {
    background-color: #d5d5d5; }
    .color-guide li:nth-child(28):before, .color-guide li:nth-child(28):after {
      color: black; }
    .color-guide li:nth-child(28):before {
      content: "#d5d5d5"; }
    .color-guide li:nth-child(28):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(29) {
    background-color: #e6e6e6; }
    .color-guide li:nth-child(29):before, .color-guide li:nth-child(29):after {
      color: black; }
    .color-guide li:nth-child(29):before {
      content: "#e6e6e6"; }
    .color-guide li:nth-child(29):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(30) {
    background-color: #eeeeee; }
    .color-guide li:nth-child(30):before, .color-guide li:nth-child(30):after {
      color: black; }
    .color-guide li:nth-child(30):before {
      content: "#eeeeee"; }
    .color-guide li:nth-child(30):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(31) {
    background-color: #555555; }
    .color-guide li:nth-child(31):before, .color-guide li:nth-child(31):after {
      color: white; }
    .color-guide li:nth-child(31):before {
      content: "#555555"; }
    .color-guide li:nth-child(31):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(32) {
    background-color: #404040; }
    .color-guide li:nth-child(32):before, .color-guide li:nth-child(32):after {
      color: white; }
    .color-guide li:nth-child(32):before {
      content: "#404040"; }
    .color-guide li:nth-child(32):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(33) {
    background-color: #2b2b2b; }
    .color-guide li:nth-child(33):before, .color-guide li:nth-child(33):after {
      color: white; }
    .color-guide li:nth-child(33):before {
      content: "#2b2b2b"; }
    .color-guide li:nth-child(33):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(34) {
    background-color: #151515; }
    .color-guide li:nth-child(34):before, .color-guide li:nth-child(34):after {
      color: white; }
    .color-guide li:nth-child(34):before {
      content: "#151515"; }
    .color-guide li:nth-child(34):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(35) {
    background-color: #0d0d0d; }
    .color-guide li:nth-child(35):before, .color-guide li:nth-child(35):after {
      color: white; }
    .color-guide li:nth-child(35):before {
      content: "#0d0d0d"; }
    .color-guide li:nth-child(35):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(36) {
    background-color: #090909; }
    .color-guide li:nth-child(36):before, .color-guide li:nth-child(36):after {
      color: white; }
    .color-guide li:nth-child(36):before {
      content: "#090909"; }
    .color-guide li:nth-child(36):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(37) {
    background-color: #7d7d7d; }
    .color-guide li:nth-child(37):before, .color-guide li:nth-child(37):after {
      color: white; }
    .color-guide li:nth-child(37):before {
      content: "#7d7d7d"; }
    .color-guide li:nth-child(37):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(38) {
    background-color: #9e9e9e; }
    .color-guide li:nth-child(38):before, .color-guide li:nth-child(38):after {
      color: black; }
    .color-guide li:nth-child(38):before {
      content: "#9e9e9e"; }
    .color-guide li:nth-child(38):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(39) {
    background-color: #bebebe; }
    .color-guide li:nth-child(39):before, .color-guide li:nth-child(39):after {
      color: black; }
    .color-guide li:nth-child(39):before {
      content: "#bebebe"; }
    .color-guide li:nth-child(39):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(40) {
    background-color: #dfdfdf; }
    .color-guide li:nth-child(40):before, .color-guide li:nth-child(40):after {
      color: black; }
    .color-guide li:nth-child(40):before {
      content: "#dfdfdf"; }
    .color-guide li:nth-child(40):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(41) {
    background-color: #ececec; }
    .color-guide li:nth-child(41):before, .color-guide li:nth-child(41):after {
      color: black; }
    .color-guide li:nth-child(41):before {
      content: "#ececec"; }
    .color-guide li:nth-child(41):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(42) {
    background-color: #f2f2f2; }
    .color-guide li:nth-child(42):before, .color-guide li:nth-child(42):after {
      color: black; }
    .color-guide li:nth-child(42):before {
      content: "#f2f2f2"; }
    .color-guide li:nth-child(42):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(43) {
    background-color: #7d7d7d; }
    .color-guide li:nth-child(43):before, .color-guide li:nth-child(43):after {
      color: white; }
    .color-guide li:nth-child(43):before {
      content: "#7d7d7d"; }
    .color-guide li:nth-child(43):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(44) {
    background-color: #5e5e5e; }
    .color-guide li:nth-child(44):before, .color-guide li:nth-child(44):after {
      color: white; }
    .color-guide li:nth-child(44):before {
      content: "#5e5e5e"; }
    .color-guide li:nth-child(44):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(45) {
    background-color: #3f3f3f; }
    .color-guide li:nth-child(45):before, .color-guide li:nth-child(45):after {
      color: white; }
    .color-guide li:nth-child(45):before {
      content: "#3f3f3f"; }
    .color-guide li:nth-child(45):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(46) {
    background-color: #1f1f1f; }
    .color-guide li:nth-child(46):before, .color-guide li:nth-child(46):after {
      color: white; }
    .color-guide li:nth-child(46):before {
      content: "#1f1f1f"; }
    .color-guide li:nth-child(46):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(47) {
    background-color: #131313; }
    .color-guide li:nth-child(47):before, .color-guide li:nth-child(47):after {
      color: white; }
    .color-guide li:nth-child(47):before {
      content: "#131313"; }
    .color-guide li:nth-child(47):after {
      content: attr(data-sass); }
  .color-guide li:nth-child(48) {
    background-color: #0d0d0d; }
    .color-guide li:nth-child(48):before, .color-guide li:nth-child(48):after {
      color: white; }
    .color-guide li:nth-child(48):before {
      content: "#0d0d0d"; }
    .color-guide li:nth-child(48):after {
      content: attr(data-sass); }

/* custom prototype styles */
.prototype--layout-block {
  border: 2px solid #878787;
  background: #bababa;
  height: 15em; }

.font-1 {
  font-family: Museo, serif;
  font-size: ptstorem(20);
  color: #333;
  font-weight: 900; }

.font-2 {
  font-family: Museo, serif;
  font-size: ptstorem(14);
  color: #666;
  font-weight: 700; }

.font-3 {
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #333; }

.font-3b {
  text-transform: uppercase;
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #333; }

.font-4 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(11);
  color: #ff0000; }

.font-5 {
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(22);
  color: #333; }

.font-6 {
  font-family: Museo, serif;
  font-weight: 500;
  font-size: ptstorem(13);
  color: #666; }

.font-7 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(17);
  color: #fff;
  letter-spacing: 0.3px; }

.font-7b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(15);
  color: #fff;
  letter-spacing: 0.3px; }

.font-8 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(20);
  color: #333;
  letter-spacing: 0.3px; }

.font-9 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(20);
  color: #666; }

.font-10 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(14);
  color: #666; }

.font-11 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #ff0000; }

.font-11 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #ff0000; }

.font-11b {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #ff0000; }

.font-12 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(17);
  color: #ff0000; }

.font-12b {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(17);
  color: #ff0000; }

.font-12c {
  text-transform: uppercase;
  font-family: Museo, serif;
  font-weight: 700;
  font-size: ptstorem(17);
  color: #fff;
  letter-spacing: 0.3px; }

.font-13 {
  font-family: Museo, serif;
  font-weight: 700;
  font-size: ptstorem(18);
  color: #333; }

.font-13b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(18);
  color: #333; }

.font-14 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(15);
  color: #666; }

.font-14b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(15);
  color: #666; }

.font-15 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(20);
  color: #ff0000; }

.font-15b {
  text-transform: uppercase;
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(20);
  color: #ff0000; }

.font-15c {
  text-transform: uppercase;
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(20);
  color: #666; }

.font-16 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #333; }

.font-16b {
  font-weight: 500;
  font-family: "Museo Sans", sans-serif;
  font-size: ptstorem(13);
  text-transform: capitalize;
  color: #333; }

.font-17 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #666; }

.font-17b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #666; }

.font-18 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(14);
  color: #333; }

.font-19 {
  text-transform: uppercase;
  font-family: Museo, serif;
  font-weight: 700;
  font-size: ptstorem(12);
  color: #666; }

.font-20 {
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(13);
  color: #fff; }

.font-21 {
  font-family: Museo, serif;
  font-weight: 700;
  font-size: ptstorem(14);
  color: #999; }

.font-22 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(20);
  color: #333; }

.font-23 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #666; }

.font-24 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(16);
  color: #666; }

.font-25 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(16);
  color: #333; }

.font-25b {
  font-family: Museo, serif;
  font-weight: 900;
  font-size: ptstorem(16);
  color: #333; }

.font-26 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(13);
  color: #666; }

.font-27 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(24);
  color: #666; }

.font-28 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(20);
  color: #fff; }

.font-29 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(12);
  color: #ff0000;
  letter-spacing: 0.3px; }

.font-30 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-size: ptstorem(12);
  font-weight: 700;
  color: #666;
  letter-spacing: 0.3px; }

.font-30b {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(12);
  color: #666; }

.font-31 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(11);
  color: #fff; }

.font-32 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(11);
  color: #999; }

.font-33 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #999; }

.font-33b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #999; }

.font-34 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #000000; }

.font-35 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(16);
  color: #999; }

.font-36 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(16);
  font-color: #fff; }

.font-37 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(18);
  color: #666; }

.font-38 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(14);
  color: #333; }

.font-39 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(27);
  color: #f8941d; }

.font-40 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(18);
  color: #ccc; }

.font-41 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #333; }

.font-41b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #333; }

.font-42 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(13);
  color: #a7a7a7;
  line-height: 120%; }

.font-43 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(14);
  color: #999; }

.font-43b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(14);
  color: #999; }

.font-44 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(32);
  color: #ff9933; }

.font-45 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(72);
  color: #ff9933; }

.font-46 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(42);
  color: #ff9933; }

.font-47 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(25);
  color: #ff9933; }

.font-47b {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(18);
  color: #ff9933; }

.font-48 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(14);
  color: #333; }

.font-49 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(16);
  color: #ff0000; }

.font-50 {
  text-transform: uppercase;
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(13);
  color: #fff; }

.font-51 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(13);
  color: #a7a7a7; }

.font-52 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 700;
  font-size: ptstorem(14);
  color: #333; }

.font-53 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 900;
  font-size: ptstorem(17);
  color: #333;
  text-transform: none; }

.font-54 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(17);
  color: #666;
  text-transform: uppercase; }

.font-55 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(12);
  color: #fff;
  text-transform: uppercase; }

.font-56 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(11);
  color: #ff0000; }

.font-57 {
  font-family: "Museo Sans", sans-serif;
  font-weight: 500;
  font-size: ptstorem(20);
  color: #333; }

.font-colors li {
  width: 20%;
  display: inline-block;
  height: 50px;
  text-align: center;
  padding-top: 18px; }

.font-color-1 {
  background-color: #333;
  color: white; }

.font-color-2 {
  background-color: #666;
  color: white; }

.font-color-3 {
  background-color: #999; }

.font-color-4 {
  background-color: #a7a7a7; }

.font-color-5 {
  background-color: #ff9933; }

.font-color-6 {
  background-color: #464646;
  color: white; }

.font-color-7 {
  background-color: #ccc; }

.font-background {
  background-color: #EEE; }