@charset "UTF-8";
@import url("//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700");
.ixu-cascading-base {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; }
  .ixu-cascading-base *,
  .ixu-cascading-base *::before,
  .ixu-cascading-base *::after {
    -moz-box-sizing: inherit;
         box-sizing: inherit; }

.ixu-cascading-typography {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  color: #69655e;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1; }
  .ixu-cascading-theme-inverse .ixu-cascading-typography, .ixu-cascading-typography.ixu-cascading-theme-inverse {
    color: #a9c1c7; }

.ixu-cascading-theme-inverse .ixu-cascading-focus *:focus,
.ixu-cascading-theme-inverse .ixu-cascading-focus *:focus + [class^='ixu'][class*='faux'], .ixu-cascading-focus.ixu-cascading-theme-inverse *:focus,
.ixu-cascading-focus.ixu-cascading-theme-inverse *:focus + [class^='ixu'][class*='faux'] {
  outline-color: rgba(135, 206, 250, 0.7); }

.ixu-cascading-focus *:focus,
.ixu-cascading-focus *:focus + [class^='ixu'][class*='faux'] {
  outline-color: rgba(27, 127, 204, 0.4);
  outline-style: auto;
  outline-width: 3px; }

.is-mouse-mode .ixu-cascading-focus *:focus,
.is-mouse-mode .ixu-cascading-focus *:focus + [class^='ixu'][class*='faux'],
.is-mouse-mode.ixu-cascading-focus *:focus,
.is-mouse-mode.ixu-cascading-focus *:focus + [class^='ixu'][class*='faux'] {
  outline: none; }

/* postcss-bem-linter: define ixu-background */
/*
@bemagic {
    intro: Component used as a container with background.
    description: Applies background that matches the theme used by its parent.
    required: true
}
*/
.ixu-background {
  background-color: #faf9f7; }
  .ixu-cascading-theme-inverse .ixu-background, .ixu-background.ixu-cascading-theme-inverse {
    background-color: #353535; }
  .ixu-cascading-theme-issuu .ixu-background, .ixu-background.ixu-cascading-theme-issuu {
    background-color: #e66a5c; }
  .ixu-cascading-theme-positive .ixu-background, .ixu-background.ixu-cascading-theme-positive {
    background-color: #60bf80; }
  .ixu-cascading-theme-danger .ixu-background, .ixu-background.ixu-cascading-theme-danger {
    background-color: #d94c58; }

/*
@bemagic {
    intro: Secondary variation of the background
    description: Applies secondary background that matches the theme used by its parent
    required: false
}
*/
.ixu-background--secondary {
  background-color: #f2f0eb; }
  .ixu-cascading-theme-inverse .ixu-background--secondary, .ixu-background--secondary.ixu-cascading-theme-inverse {
    background-color: #424242; }

/*
@bemagic {
    intro: Tertiery variation of the background
    description: Applies tertiary background that matches the theme used by its parent
    required: false
}
*/
.ixu-background--tertiary {
  background-color: #e8e4dc; }
  .ixu-cascading-theme-inverse .ixu-background--tertiary, .ixu-background--tertiary.ixu-cascading-theme-inverse {
    background-color: #4c4c4c; }

/* stylelint-disable declaration-no-important */
@-webkit-keyframes ixu-button-spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }
@keyframes ixu-button-spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.ixu-button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  outline: none;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  border: 2px solid transparent;
  border-radius: 18px;
  cursor: pointer;
  display: inline-block;
  line-height: 32px;
  padding: 0 24px;
  position: relative;
  -webkit-transition: 150ms;
  transition: 150ms; }
  .ixu-button:disabled {
    background-color: transparent !important;
    border: 1px dashed #b3ada1 !important;
    color: #b3ada1 !important;
    cursor: not-allowed;
    line-height: 34px; }
    .ixu-cascading-theme-inverse .ixu-button:disabled, .ixu-button:disabled.ixu-cascading-theme-inverse {
      border-color: #787878 !important;
      color: #787878 !important; }
    .ixu-cascading-theme-issuu .ixu-button:disabled, .ixu-button:disabled.ixu-cascading-theme-issuu {
      border-color: #bf4f43 !important;
      color: #bf4f43 !important; }
    .ixu-cascading-theme-positive .ixu-button:disabled, .ixu-button:disabled.ixu-cascading-theme-positive {
      border-color: #54996b !important;
      color: #54996b !important; }
    .ixu-cascading-theme-danger .ixu-button:disabled, .ixu-button:disabled.ixu-cascading-theme-danger {
      border-color: #b33640 !important;
      color: #b33640 !important; }
  .ixu-button:disabled[class*='is-'] {
    border: 1px solid transparent !important;
    color: transparent !important; }
    .ixu-button:disabled[class*='is-']::before {
      background-position: center;
      background-repeat: no-repeat;
      background-size: 20px;
      content: ' ';
      height: 100%;
      left: 0;
      position: absolute;
      width: 100%; }
  .ixu-button:disabled.is-loading::before {
    -webkit-animation: ixu-button-spin 1.6s linear infinite;
            animation: ixu-button-spin 1.6s linear infinite;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff' height='20px' width='20px'%3E%3Cpath d='M0 16q0-1.11.78-1.89t1.892-.782 1.883.78T5.328 16t-.773 1.89-1.883.782-1.89-.78T0 16zm3.86 9.406q0-1.094.772-1.883t1.883-.79q1.078 0 1.875.798t.797 1.876q0 1.11-.79 1.89t-1.882.782q-1.11 0-1.883-.78t-.773-1.892zm.03-18.843q0-1.125.798-1.89.78-.782 1.875-.782 1.11 0 1.906.782t.796 1.89-.79 1.884-1.913.773q-1.094 0-1.883-.774t-.79-1.883zm9.376 22.765q0-1.11.78-1.89.767-.767 1.876-.767t1.89.774.782 1.883-.78 1.89T15.92 32t-1.883-.782-.774-1.89zm.062-26.656q0-1.11.78-1.89T16 0t1.89.78.782 1.892-.78 1.883T16 5.328t-1.89-.773-.782-1.883zm9.406 22.734q0-1.078.797-1.875t1.907-.796q1.078 0 1.875.797t.797 1.876q0 1.11-.79 1.89t-1.883.782q-1.11 0-1.906-.78t-.796-1.892zm0-18.843q0-1.125.797-1.89.814-.782 1.907-.782t1.883.782.79 1.89-.79 1.884-1.883.773q-1.125 0-1.914-.774t-.79-1.883zM26.672 16q0-1.11.78-1.89t1.876-.782q1.11 0 1.89.78T32 16t-.78 1.89-1.892.782-1.883-.78T26.672 16z'/%3E%3C/svg%3E");
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); }
  .ixu-button:disabled.is-done::before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff' height='20px' width='20px'%3E%3Cpath d='M10.6 27.3c-.3 0-.7-.1-.9-.3L.4 17.7c-.5-.5-.5-1.3 0-1.8s1.3-.5 1.8 0l8.4 8.4L29.8 5.1c.5-.5 1.3-.5 1.8 0s.5 1.3 0 1.8l-20.2 20c-.2.3-.5.4-.8.4z'/%3E%3C/svg%3E"); }
  .ixu-button:disabled.is-error::before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff' height='20px' width='20px'%3E%3Cpath d='M15.9 3.5c.8 0 1.4.4 1.9 1.1L29 23.3c.5.8.5 1.9 0 2.7-.4.8-1.3 1.4-2.3 1.4H5.2c-1 0-1.9-.5-2.3-1.4-.5-.8-.4-1.9 0-2.7L14.1 4.7c.4-.7 1.1-1.2 1.8-1.2M16 1c-1.7 0-3.1.8-4.1 2.3L.7 22c-.9 1.6-1 3.7-.1 5.3s2.6 2.6 4.5 2.6h21.7c2 0 3.6-1 4.5-2.6.9-1.6.9-3.7-.1-5.2L20 3.4c-.9-1.6-2.4-2.3-4-2.4z'/%3E%3Cpath d='M15.9 18.7c-.7 0-1.3-.6-1.3-1.3V9.8c0-.7.6-1.3 1.3-1.3s1.3.6 1.3 1.3v7.6c0 .8-.5 1.3-1.3 1.3zm0 6c-.7 0-1.3-.6-1.3-1.3v-1.2c0-.7.6-1.3 1.3-1.3s1.3.6 1.3 1.3v1.2c0 .8-.5 1.3-1.3 1.3z'/%3E%3C/svg%3E"); }

/* postcss-bem-linter: define ixu-button */
/*
@bemagic {
    intro: Create a button with a `<button>` or `<a>` element to retain the native click function. Use a `disabled` attribute when a button can’t be clicked. NOTE, using an `<input>` tag does not work with the various `is-` state classes.
    description: A neutrally looking button used for common user actions
    required: true
}
*/
.ixu-button {
  background-color: #b3ada1;
  border-color: #b3ada1;
  color: #fff; }
  .ixu-button:hover, .ixu-button:focus {
    background-color: #ccc6ba;
    border-color: #ccc6ba;
    color: #fff; }
  .ixu-button:active {
    background-color: #b3ada1;
    border-color: #b3ada1;
    color: #fff; }
  .ixu-button:disabled[class*="is-"] {
    background-color: #b3ada1 !important; }
    .ixu-button:disabled[class*="is-"]::before {
      color: #fff; }
  .ixu-cascading-theme-inverse .ixu-button, .ixu-button.ixu-cascading-theme-inverse {
    background-color: #8da2a6;
    border-color: #8da2a6;
    color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button:hover, .ixu-cascading-theme-inverse .ixu-button:focus, .ixu-button.ixu-cascading-theme-inverse:hover, .ixu-button.ixu-cascading-theme-inverse:focus {
      background-color: #98aeb3;
      border-color: #98aeb3;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button:active, .ixu-button.ixu-cascading-theme-inverse:active {
      background-color: #8da2a6;
      border-color: #8da2a6;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button:disabled[class*="is-"], .ixu-button.ixu-cascading-theme-inverse:disabled[class*="is-"] {
      background-color: #8da2a6 !important; }
      .ixu-cascading-theme-inverse .ixu-button:disabled[class*="is-"]::before, .ixu-button.ixu-cascading-theme-inverse:disabled[class*="is-"]::before {
        color: #fff; }
  .ixu-cascading-theme-issuu .ixu-button, .ixu-button.ixu-cascading-theme-issuu {
    background-color: #cc5547;
    border-color: #cc5547;
    color: #fff; }
    .ixu-cascading-theme-issuu .ixu-button:hover, .ixu-cascading-theme-issuu .ixu-button:focus, .ixu-button.ixu-cascading-theme-issuu:hover, .ixu-button.ixu-cascading-theme-issuu:focus {
      background-color: #d95a4c;
      border-color: #d95a4c;
      color: #fff; }
    .ixu-cascading-theme-issuu .ixu-button:active, .ixu-button.ixu-cascading-theme-issuu:active {
      background-color: #cc5547;
      border-color: #cc5547;
      color: #fff; }
    .ixu-cascading-theme-issuu .ixu-button:disabled[class*="is-"], .ixu-button.ixu-cascading-theme-issuu:disabled[class*="is-"] {
      background-color: #cc5547 !important; }
      .ixu-cascading-theme-issuu .ixu-button:disabled[class*="is-"]::before, .ixu-button.ixu-cascading-theme-issuu:disabled[class*="is-"]::before {
        color: #fff; }
  .ixu-cascading-theme-positive .ixu-button, .ixu-button.ixu-cascading-theme-positive {
    background-color: #4d8c62;
    border-color: #4d8c62;
    color: #fff; }
    .ixu-cascading-theme-positive .ixu-button:hover, .ixu-cascading-theme-positive .ixu-button:focus, .ixu-button.ixu-cascading-theme-positive:hover, .ixu-button.ixu-cascading-theme-positive:focus {
      background-color: #54996b;
      border-color: #54996b;
      color: #fff; }
    .ixu-cascading-theme-positive .ixu-button:active, .ixu-button.ixu-cascading-theme-positive:active {
      background-color: #4d8c62;
      border-color: #4d8c62;
      color: #fff; }
    .ixu-cascading-theme-positive .ixu-button:disabled[class*="is-"], .ixu-button.ixu-cascading-theme-positive:disabled[class*="is-"] {
      background-color: #4d8c62 !important; }
      .ixu-cascading-theme-positive .ixu-button:disabled[class*="is-"]::before, .ixu-button.ixu-cascading-theme-positive:disabled[class*="is-"]::before {
        color: #fff; }
  .ixu-cascading-theme-danger .ixu-button, .ixu-button.ixu-cascading-theme-danger {
    background-color: #a1303a;
    border-color: #a1303a;
    color: #fff; }
    .ixu-cascading-theme-danger .ixu-button:hover, .ixu-cascading-theme-danger .ixu-button:focus, .ixu-button.ixu-cascading-theme-danger:hover, .ixu-button.ixu-cascading-theme-danger:focus {
      background-color: #b33640;
      border-color: #b33640;
      color: #fff; }
    .ixu-cascading-theme-danger .ixu-button:active, .ixu-button.ixu-cascading-theme-danger:active {
      background-color: #a1303a;
      border-color: #a1303a;
      color: #fff; }
    .ixu-cascading-theme-danger .ixu-button:disabled[class*="is-"], .ixu-button.ixu-cascading-theme-danger:disabled[class*="is-"] {
      background-color: #a1303a !important; }
      .ixu-cascading-theme-danger .ixu-button:disabled[class*="is-"]::before, .ixu-button.ixu-cascading-theme-danger:disabled[class*="is-"]::before {
        color: #fff; }

/*
@bemagic {
    description: A button using the issuu primary/brand color
}
*/
.ixu-button--pronounced {
  background-color: #f26f61;
  border-color: #f26f61;
  color: #fff; }
  .ixu-button--pronounced:hover, .ixu-button--pronounced:focus {
    background-color: #f77d6f;
    border-color: #f77d6f;
    color: #fff; }
  .ixu-button--pronounced:active {
    background-color: #f26f61;
    border-color: #f26f61;
    color: #fff; }
  .ixu-button--pronounced:disabled[class*="is-"] {
    background-color: #f26f61 !important; }
    .ixu-button--pronounced:disabled[class*="is-"]::before {
      color: #fff; }
  .ixu-cascading-theme-inverse .ixu-button--pronounced, .ixu-button--pronounced.ixu-cascading-theme-inverse {
    background-color: #f26f61;
    border-color: #f26f61;
    color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--pronounced:hover, .ixu-cascading-theme-inverse .ixu-button--pronounced:focus, .ixu-button--pronounced.ixu-cascading-theme-inverse:hover, .ixu-button--pronounced.ixu-cascading-theme-inverse:focus {
      background-color: #f77d6f;
      border-color: #f77d6f;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--pronounced:active, .ixu-button--pronounced.ixu-cascading-theme-inverse:active {
      background-color: #f26f61;
      border-color: #f26f61;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--pronounced:disabled[class*="is-"], .ixu-button--pronounced.ixu-cascading-theme-inverse:disabled[class*="is-"] {
      background-color: #f26f61 !important; }
      .ixu-cascading-theme-inverse .ixu-button--pronounced:disabled[class*="is-"]::before, .ixu-button--pronounced.ixu-cascading-theme-inverse:disabled[class*="is-"]::before {
        color: #fff; }
  .ixu-cascading-theme-issuu .ixu-button--pronounced, .ixu-button--pronounced.ixu-cascading-theme-issuu {
    background-color: #fff;
    border-color: #fff;
    color: #f26f61; }
    .ixu-cascading-theme-issuu .ixu-button--pronounced:hover, .ixu-cascading-theme-issuu .ixu-button--pronounced:focus, .ixu-button--pronounced.ixu-cascading-theme-issuu:hover, .ixu-button--pronounced.ixu-cascading-theme-issuu:focus {
      background-color: #f5f5f5;
      border-color: #f5f5f5;
      color: #f26f61; }
    .ixu-cascading-theme-issuu .ixu-button--pronounced:active, .ixu-button--pronounced.ixu-cascading-theme-issuu:active {
      background-color: #fff;
      border-color: #fff;
      color: #f26f61; }
    .ixu-cascading-theme-issuu .ixu-button--pronounced:disabled[class*="is-"], .ixu-button--pronounced.ixu-cascading-theme-issuu:disabled[class*="is-"] {
      background-color: #fff !important; }
      .ixu-cascading-theme-issuu .ixu-button--pronounced:disabled[class*="is-"]::before, .ixu-button--pronounced.ixu-cascading-theme-issuu:disabled[class*="is-"]::before {
        color: #f26f61; }

/*
@bemagic {
    description: Use to promote an exceptionally benefitial user action
}
*/
.ixu-button--positive {
  background-color: #60bf80;
  border-color: #60bf80;
  color: #fff; }
  .ixu-button--positive:hover, .ixu-button--positive:focus {
    background-color: #6c8;
    border-color: #6c8;
    color: #fff; }
  .ixu-button--positive:active {
    background-color: #60bf80;
    border-color: #60bf80;
    color: #fff; }
  .ixu-button--positive:disabled[class*="is-"] {
    background-color: #60bf80 !important; }
    .ixu-button--positive:disabled[class*="is-"]::before {
      color: #fff; }
  .ixu-cascading-theme-inverse .ixu-button--positive, .ixu-button--positive.ixu-cascading-theme-inverse {
    background-color: #60bf80;
    border-color: #60bf80;
    color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--positive:hover, .ixu-cascading-theme-inverse .ixu-button--positive:focus, .ixu-button--positive.ixu-cascading-theme-inverse:hover, .ixu-button--positive.ixu-cascading-theme-inverse:focus {
      background-color: #6c8;
      border-color: #6c8;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--positive:active, .ixu-button--positive.ixu-cascading-theme-inverse:active {
      background-color: #60bf80;
      border-color: #60bf80;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--positive:disabled[class*="is-"], .ixu-button--positive.ixu-cascading-theme-inverse:disabled[class*="is-"] {
      background-color: #60bf80 !important; }
      .ixu-cascading-theme-inverse .ixu-button--positive:disabled[class*="is-"]::before, .ixu-button--positive.ixu-cascading-theme-inverse:disabled[class*="is-"]::before {
        color: #fff; }
  .ixu-cascading-theme-positive .ixu-button--positive, .ixu-button--positive.ixu-cascading-theme-positive {
    background-color: #fff;
    border-color: #fff;
    color: #60bf80; }
    .ixu-cascading-theme-positive .ixu-button--positive:hover, .ixu-cascading-theme-positive .ixu-button--positive:focus, .ixu-button--positive.ixu-cascading-theme-positive:hover, .ixu-button--positive.ixu-cascading-theme-positive:focus {
      background-color: #f5f5f5;
      border-color: #f5f5f5;
      color: #60bf80; }
    .ixu-cascading-theme-positive .ixu-button--positive:active, .ixu-button--positive.ixu-cascading-theme-positive:active {
      background-color: #fff;
      border-color: #fff;
      color: #60bf80; }
    .ixu-cascading-theme-positive .ixu-button--positive:disabled[class*="is-"], .ixu-button--positive.ixu-cascading-theme-positive:disabled[class*="is-"] {
      background-color: #fff !important; }
      .ixu-cascading-theme-positive .ixu-button--positive:disabled[class*="is-"]::before, .ixu-button--positive.ixu-cascading-theme-positive:disabled[class*="is-"]::before {
        color: #60bf80; }

/*
@bemagic {
    description: Use *only* for dangerous user actions such as deleting an account or publication
}
*/
.ixu-button--danger {
  background-color: #d94c58;
  border-color: #d94c58;
  color: #fff; }
  .ixu-button--danger:hover, .ixu-button--danger:focus {
    background-color: #e6505d;
    border-color: #e6505d;
    color: #fff; }
  .ixu-button--danger:active {
    background-color: #d94c58;
    border-color: #d94c58;
    color: #fff; }
  .ixu-button--danger:disabled[class*="is-"] {
    background-color: #d94c58 !important; }
    .ixu-button--danger:disabled[class*="is-"]::before {
      color: #fff; }
  .ixu-cascading-theme-inverse .ixu-button--danger, .ixu-button--danger.ixu-cascading-theme-inverse {
    background-color: #d94c58;
    border-color: #d94c58;
    color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--danger:hover, .ixu-cascading-theme-inverse .ixu-button--danger:focus, .ixu-button--danger.ixu-cascading-theme-inverse:hover, .ixu-button--danger.ixu-cascading-theme-inverse:focus {
      background-color: #e6505d;
      border-color: #e6505d;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--danger:active, .ixu-button--danger.ixu-cascading-theme-inverse:active {
      background-color: #d94c58;
      border-color: #d94c58;
      color: #fff; }
    .ixu-cascading-theme-inverse .ixu-button--danger:disabled[class*="is-"], .ixu-button--danger.ixu-cascading-theme-inverse:disabled[class*="is-"] {
      background-color: #d94c58 !important; }
      .ixu-cascading-theme-inverse .ixu-button--danger:disabled[class*="is-"]::before, .ixu-button--danger.ixu-cascading-theme-inverse:disabled[class*="is-"]::before {
        color: #fff; }
  .ixu-cascading-theme-danger .ixu-button--danger, .ixu-button--danger.ixu-cascading-theme-danger {
    background-color: #fff;
    border-color: #fff;
    color: #d94c58; }
    .ixu-cascading-theme-danger .ixu-button--danger:hover, .ixu-cascading-theme-danger .ixu-button--danger:focus, .ixu-button--danger.ixu-cascading-theme-danger:hover, .ixu-button--danger.ixu-cascading-theme-danger:focus {
      background-color: #f5f5f5;
      border-color: #f5f5f5;
      color: #d94c58; }
    .ixu-cascading-theme-danger .ixu-button--danger:active, .ixu-button--danger.ixu-cascading-theme-danger:active {
      background-color: #fff;
      border-color: #fff;
      color: #d94c58; }
    .ixu-cascading-theme-danger .ixu-button--danger:disabled[class*="is-"], .ixu-button--danger.ixu-cascading-theme-danger:disabled[class*="is-"] {
      background-color: #fff !important; }
      .ixu-cascading-theme-danger .ixu-button--danger:disabled[class*="is-"]::before, .ixu-button--danger.ixu-cascading-theme-danger:disabled[class*="is-"]::before {
        color: #d94c58; }

.ixu-button--outline {
  background-color: transparent;
  color: #69655e; }
  .ixu-cascading-theme-inverse .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-inverse {
    background-color: transparent; }
  .ixu-cascading-theme-positive .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-positive {
    background-color: transparent; }
  .ixu-cascading-theme-danger .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-danger {
    background-color: transparent; }
  .ixu-cascading-theme-issuu .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-issuu {
    background-color: transparent; }
  .ixu-cascading-theme-inverse .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-inverse {
    color: #fff; }
  .ixu-cascading-theme-positive .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-positive {
    color: #fff; }
  .ixu-cascading-theme-danger .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-danger {
    color: #fff; }
  .ixu-cascading-theme-issuu .ixu-button--outline, .ixu-button--outline.ixu-cascading-theme-issuu {
    color: #fff; }

.ixu-button--discreet {
  color: #69655e;
  background-color: transparent;
  border-color: transparent; }
  .ixu-cascading-theme-inverse .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-inverse {
    background-color: transparent;
    border-color: transparent; }
  .ixu-cascading-theme-positive .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-positive {
    background-color: transparent;
    border-color: transparent; }
  .ixu-cascading-theme-danger .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-danger {
    background-color: transparent;
    border-color: transparent; }
  .ixu-cascading-theme-issuu .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-issuu {
    background-color: transparent;
    border-color: transparent; }
  .ixu-cascading-theme-inverse .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-inverse {
    color: #fff; }
  .ixu-cascading-theme-positive .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-positive {
    color: #fff; }
  .ixu-cascading-theme-danger .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-danger {
    color: #fff; }
  .ixu-cascading-theme-issuu .ixu-button--discreet, .ixu-button--discreet.ixu-cascading-theme-issuu {
    color: #fff; }

.ixu-button--rounded {
  height: 36px;
  line-height: 1;
  overflow: hidden;
  padding: 0;
  width: 36px; }

.ixu-button--large {
  font-size: 16px;
  border-radius: 27px;
  line-height: 48px; }

/* postcss-bem-linter: define ixu-checkbox; */
/*
@bemagic {
    intro: The ability to style checkboxes with CSS varies across browsers. To ensure that checkboxes look the same everywhere, we use a custom DOM. Pay close attention to the markup, because all elements must exist for the styles to work. **NOTE** The tag for this component should be `<label>` when used by itself (without a label). See `ixu-form-element` for usage with a label
    description: A customly styled checkbox that fits the issuu design system
    tag: label
    text: ''
}
*/
.ixu-checkbox {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  display: block;
  position: relative; }

/*
@bemagic {
    description: The actual checkbox (hidden to allow custom styling)
    required: true
}
*/
.ixu-checkbox__native {
  cursor: pointer;
  height: 20px;
  opacity: 0;
  position: absolute;
  width: 20px;
  z-index: 1;
  /* stylelint-disable-next-line declaration-no-important */
  margin: 0 !important; }

/*
@bemagic {
    description: A "fake" (artificial) checkbox used for custom styling,
    text: ''
    required: true
}
*/
.ixu-checkbox__faux {
  background-color: #fff;
  border: 1px solid #b3ada1;
  border-radius: 5px;
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  color: transparent;
  height: 20px;
  position: relative;
  -webkit-transition: 150ms;
  transition: 150ms;
  width: 20px; }
  .ixu-cascading-theme-inverse .ixu-checkbox__faux, .ixu-checkbox__faux.ixu-cascading-theme-inverse {
    background-color: #353535;
    border: 1px solid #98aeb3; }
  .ixu-checkbox__native:hover + .ixu-checkbox__faux {
    color: #ccc6ba; }
    .ixu-cascading-theme-inverse .ixu-checkbox__native:hover + .ixu-checkbox__faux, .ixu-checkbox__native:hover + .ixu-checkbox__faux.ixu-cascading-theme-inverse {
      color: #6c7d80; }
  .ixu-checkbox__native:active + .ixu-checkbox__faux,
  .ixu-checkbox__native:checked + .ixu-checkbox__faux {
    color: #353535; }
    .ixu-cascading-theme-inverse .ixu-checkbox__native:active + .ixu-checkbox__faux, .ixu-checkbox__native:active + .ixu-checkbox__faux.ixu-cascading-theme-inverse, .ixu-cascading-theme-inverse
    .ixu-checkbox__native:checked + .ixu-checkbox__faux,
    .ixu-checkbox__native:checked + .ixu-checkbox__faux.ixu-cascading-theme-inverse {
      color: #fff; }
  .ixu-checkbox__native:disabled + .ixu-checkbox__faux {
    border-style: dashed;
    cursor: not-allowed;
    opacity: .5; }
  .ixu-checkbox__faux::after {
    border-bottom: 3px solid currentColor;
    border-left: 3px solid currentColor;
    -moz-box-sizing: border-box;
         box-sizing: border-box;
    color: currentColor;
    content: '';
    height: 7px;
    left: 3px;
    position: absolute;
    top: 4px;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
    width: 12px; }

/* postcss-bem-linter: define ixu-dropdown */
/*
@bemagic {
    intro: This is a menu with a small pointy triangle that can be used to create dropdowns. If you use `ixu-dropdown--above` you place the arrow on the bottom, this is for menues that open upwards.
    description: This is the css for an issuu dropdown.
    required: true
}
*/
.ixu-dropdown {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  background-color: #fff;
  border-color: rgba(0, 0, 0, 0.1);
  border-radius: 2px;
  border-style: solid;
  border-width: 1px 0 0 1px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.23);
  display: inline-block;
  min-width: 165px;
  position: relative; }
  .ixu-cascading-theme-inverse .ixu-dropdown, .ixu-dropdown.ixu-cascading-theme-inverse {
    background-color: #4c4c4c; }
    .ixu-cascading-theme-inverse .ixu-dropdown::before, .ixu-dropdown.ixu-cascading-theme-inverse::before {
      background-color: #4c4c4c;
      border-color: rgba(0, 0, 0, 0.1); }
  .ixu-dropdown::before {
    background-color: #fff;
    border-left: 1px solid #e0dace;
    border-top: 1px solid #e0dace;
    content: '';
    display: block;
    height: 12px;
    position: absolute;
    right: 12px;
    top: -6px;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    width: 12px; }

/*
@bemagic {
    description: When you want the list to show above and the arrow on the bottom.
}
*/
.ixu-dropdown--above::before {
  bottom: -6px;
  box-shadow: -1px -1px 1px -1px rgba(0, 0, 0, 0.23);
  top: auto;
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg); }

/*
@bemagic {
    description: Use this to group items. Sections are seperated with a line.
}
*/
.ixu-dropdown__section {
  border-bottom: 1px solid #f2f0eb;
  padding: 8px 0; }
  .ixu-cascading-theme-inverse .ixu-dropdown__section, .ixu-dropdown__section.ixu-cascading-theme-inverse {
    border-bottom: 1px solid #424242; }
  .ixu-dropdown__section:last-child {
    border-bottom: 0; }

/*
@bemagic {
    description: The individual lines you can click on.
}
*/
.ixu-dropdown__item {
  color: #353535;
  display: block;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  padding: 8px 12px;
  text-decoration: none; }
  .ixu-cascading-theme-inverse .ixu-dropdown__item, .ixu-dropdown__item.ixu-cascading-theme-inverse {
    color: #fff; }
  .ixu-dropdown__item:focus {
    color: currentColor; }
  .ixu-dropdown__item:hover:not(.ixu-dropdown__item--disabled) {
    color: #69655e; }
    .ixu-cascading-theme-inverse .ixu-dropdown__item:hover:not(.ixu-dropdown__item--disabled), .ixu-dropdown__item:hover:not(.ixu-dropdown__item--disabled).ixu-cascading-theme-inverse {
      color: #d6d6d6; }

.ixu-dropdown__item--disabled, .ixu-dropdown__item--disabled:hover {
  color: #b3ada1;
  cursor: not-allowed; }
  .ixu-cascading-theme-inverse .ixu-dropdown__item--disabled, .ixu-dropdown__item--disabled.ixu-cascading-theme-inverse, .ixu-cascading-theme-inverse .ixu-dropdown__item--disabled:hover, .ixu-dropdown__item--disabled:hover.ixu-cascading-theme-inverse {
    color: #8da2a6; }

/*
@bemagic {
    description: To hide dropdown and make it ready to be animated in.
}
*/
.ixu-dropdown.is-enter-start {
  opacity: 0;
  -webkit-transform: scale(0.97);
          transform: scale(0.97);
  -webkit-transition: 150ms;
  transition: 150ms;
  visibility: hidden; }

/*
@bemagic {
    description: To animate the dropdown in.
}
*/
.ixu-dropdown.is-enter-end {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
  visibility: visible; }

/*
@bemagic {
    description: To make dropdown ready to be animated out.
}
*/
.ixu-dropdown.is-leave-start {
  opacity: 1; }

/*
@bemagic {
    description: To animate the dropdown out.
}
*/
.ixu-dropdown.is-leave-end {
  opacity: 0;
  -webkit-transform: scale(0.97);
          transform: scale(0.97);
  -webkit-transition: 150ms;
  transition: 150ms;
  visibility: hidden; }

/* postcss-bem-linter: define ixu-form-element */
/*
@bemagic {
    intro: A `layout` component for controlling spacing and orientation `labels` and `form-elements` within.
    description: A wrapper for label and form-element with a default vertical layout
    tag: label
    required: true
}
*/
.ixu-form-element {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column; }

/*
@bemagic {
    description: Position `label` and some arbitrary form element (e.g. checkbox) side-by-side
}
*/
.ixu-form-element--horizontal {
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-direction: row;
      -ms-flex-direction: row;
          flex-direction: row; }

/*
@bemagic {
    description: A "faux" (artificial) label
    tag: div
}
*/
.ixu-form-element__label {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  color: #69655e;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  margin: 0 0 6px; }
  .ixu-cascading-theme-inverse .ixu-form-element__label, .ixu-form-element__label.ixu-cascading-theme-inverse {
    color: #a9c1c7; }
  .ixu-form-element--horizontal .ixu-form-element__label {
    margin: 0 6px 0 0; }
    .ixu-form-element--horizontal .ixu-form-element__label:last-child {
      margin: 0 0 0 6px; }
  .ixu-form-element__label.is-error {
    color: #cc4752; }
  .ixu-form-element__label.is-disabled {
    opacity: .5; }

/* postcss-bem-linter: define ixu-heading */
/*
@bemagic {
    intro: In our framework, all headings (h1–h6) are reset to the base (body text) size, with margins and padding reset to zero. When building an enterprise application, the heading level may vary depending on the context of the component or page. Using the correct heading level is important for accessibility
    description: The default heading
    required: true
}
*/
.ixu-heading {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  color: #69655e;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.3;
  /* To simplify the user interface, we allow nested typography elements within headers */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */
  /* To simplify the user interface, we allow nested typography elements within headers */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */
  /* To simplify the user interface, we allow nested typography elements within headers */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */ }
  .ixu-cascading-fluid-typography .ixu-heading, .ixu-heading.ixu-cascading-fluid-typography {
    font-size: 20px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-heading, .ixu-heading.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(20px + 4 * (100vw - 320px) / 880);
        font-size: calc(20px + 4 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-heading, .ixu-heading.ixu-cascading-fluid-typography {
        font-size: 24px; } }
  .ixu-cascading-theme-inverse .ixu-heading, .ixu-heading.ixu-cascading-theme-inverse {
    color: #a9c1c7; }
  .ixu-cascading-theme-positive .ixu-heading, .ixu-heading.ixu-cascading-theme-positive {
    color: #fff; }
  .ixu-cascading-theme-danger .ixu-heading, .ixu-heading.ixu-cascading-theme-danger {
    color: #fff; }
  .ixu-cascading-theme-issuu .ixu-heading, .ixu-heading.ixu-cascading-theme-issuu {
    color: #fff; }
  .ixu-heading em {
    font-style: italic; }
  .ixu-heading strong {
    font-weight: 600; }
  .ixu-heading a {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background-color: transparent;
    border: 0;
    color: #f26f61;
    cursor: pointer;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    text-decoration: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    .ixu-cascading-theme-inverse .ixu-heading a, .ixu-heading a.ixu-cascading-theme-inverse {
      color: #fff; }
    .ixu-cascading-theme-danger .ixu-heading a, .ixu-heading a.ixu-cascading-theme-danger {
      color: #fff;
      text-decoration: underline; }
    .ixu-cascading-theme-issuu .ixu-heading a, .ixu-heading a.ixu-cascading-theme-issuu {
      color: #fff;
      text-decoration: underline; }
    .ixu-cascading-theme-positive .ixu-heading a, .ixu-heading a.ixu-cascading-theme-positive {
      color: #fff;
      text-decoration: underline; }
    .ixu-heading a:hover {
      color: #ff8c80;
      text-decoration: underline; }
      .ixu-cascading-theme-inverse .ixu-heading a:hover, .ixu-heading a:hover.ixu-cascading-theme-inverse {
        color: #d6d6d6; }
      .ixu-cascading-theme-danger .ixu-heading a:hover, .ixu-heading a:hover.ixu-cascading-theme-danger {
        color: rgba(255, 255, 255, 0.75); }
      .ixu-cascading-theme-issuu .ixu-heading a:hover, .ixu-heading a:hover.ixu-cascading-theme-issuu {
        color: rgba(255, 255, 255, 0.75); }
      .ixu-cascading-theme-positive .ixu-heading a:hover, .ixu-heading a:hover.ixu-cascading-theme-positive {
        color: rgba(255, 255, 255, 0.75); }

/*
@bemagic {
    description: A heading using the issuu primary (brand) color
}
*/
.ixu-heading--pronounced {
  color: #353535; }
  .ixu-cascading-theme-inverse .ixu-heading--pronounced, .ixu-heading--pronounced.ixu-cascading-theme-inverse {
    color: #fff; }

/*
@bemagic {
    description: A heading using the issuu primary (brand) color
}
*/
.ixu-heading--issuu-brand {
  color: #f26f61; }
  .ixu-cascading-theme-inverse .ixu-heading--issuu-brand, .ixu-heading--issuu-brand.ixu-cascading-theme-inverse {
    color: #f26f61; }

/*
@bemagic {
    description: Used for light headings
}
*/
.ixu-heading--light {
  font-weight: 300;
  /* To simplify the user interface, we allow nested typography elements within headers */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */ }
  .ixu-heading--light strong {
    font-weight: 400; }

/*
@bemagic {
    description: Used for semibold headings
}
*/
.ixu-heading--semibold {
  font-weight: 600;
  /* To simplify the user interface, we allow nested typography elements within headers */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */ }
  .ixu-heading--semibold strong {
    font-weight: 700; }

/*
@bemagic {
    description: Used for bold headings
}
*/
.ixu-heading--bold {
  font-weight: 700; }

/*
@bemagic {
    description: This is typically the largest heading on a page and usually designates a page title
}
*/
.ixu-heading--large {
  font-size: 32px; }
  .ixu-cascading-fluid-typography .ixu-heading--large, .ixu-heading--large.ixu-cascading-fluid-typography {
    font-size: 24px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-heading--large, .ixu-heading--large.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(24px + 8 * (100vw - 320px) / 880);
        font-size: calc(24px + 8 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-heading--large, .ixu-heading--large.ixu-cascading-fluid-typography {
        font-size: 32px; } }

/*
@bemagic {
    description: This is an extraordinarily big heading
}
*/
.ixu-heading--hero {
  font-size: 63px; }
  .ixu-cascading-fluid-typography .ixu-heading--hero, .ixu-heading--hero.ixu-cascading-fluid-typography {
    font-size: 46px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-heading--hero, .ixu-heading--hero.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(46px + 17 * (100vw - 320px) / 880);
        font-size: calc(46px + 17 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-heading--hero, .ixu-heading--hero.ixu-cascading-fluid-typography {
        font-size: 63px; } }

/*
@bemagic {
    description: This is an insanely big heading
}
*/
.ixu-heading--huge {
  font-size: 46px; }
  .ixu-cascading-fluid-typography .ixu-heading--huge, .ixu-heading--huge.ixu-cascading-fluid-typography {
    font-size: 32px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-heading--huge, .ixu-heading--huge.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(32px + 14 * (100vw - 320px) / 880);
        font-size: calc(32px + 14 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-heading--huge, .ixu-heading--huge.ixu-cascading-fluid-typography {
        font-size: 46px; } }

/*
@bemagic {
    description: Small Headings are used for smaller content areas such as list sections or card titles
}
*/
.ixu-heading--small {
  font-size: 20px; }
  .ixu-cascading-fluid-typography .ixu-heading--small, .ixu-heading--small.ixu-cascading-fluid-typography {
    font-size: 16px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-heading--small, .ixu-heading--small.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(16px + 4 * (100vw - 320px) / 880);
        font-size: calc(16px + 4 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-heading--small, .ixu-heading--small.ixu-cascading-fluid-typography {
        font-size: 20px; } }

/*
@bemagic {
    description: A very tiny heading
}
*/
.ixu-heading--tiny {
  font-size: 16px; }
  .ixu-cascading-fluid-typography .ixu-heading--tiny, .ixu-heading--tiny.ixu-cascading-fluid-typography {
    font-size: 14px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-heading--tiny, .ixu-heading--tiny.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(14px + 2 * (100vw - 320px) / 880);
        font-size: calc(14px + 2 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-heading--tiny, .ixu-heading--tiny.ixu-cascading-fluid-typography {
        font-size: 16px; } }

/* postcss-bem-linter: define ixu-icon */
/*
@bemagic {
    intro: Apply this class to a SVG to get baseline styling for iCSSuu icons
    required: true
}
*/
.ixu-icon {
  fill: currentColor;
  height: 28px;
  width: 28px; }

/* postcss-bem-linter: define ixu-link */
/*
@bemagic {
    intro: A standalone link. Links within `ixu-heading` or `ixu-paragraph` will be styled automatically
    description: The default link styling
}
*/
.ixu-link {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  border: 0;
  color: #f26f61;
  cursor: pointer;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
  padding: 0;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  .ixu-cascading-theme-inverse .ixu-link, .ixu-link.ixu-cascading-theme-inverse {
    color: #fff; }
  .ixu-cascading-theme-danger .ixu-link, .ixu-link.ixu-cascading-theme-danger {
    color: #fff;
    text-decoration: underline; }
  .ixu-cascading-theme-issuu .ixu-link, .ixu-link.ixu-cascading-theme-issuu {
    color: #fff;
    text-decoration: underline; }
  .ixu-cascading-theme-positive .ixu-link, .ixu-link.ixu-cascading-theme-positive {
    color: #fff;
    text-decoration: underline; }
  .ixu-link:hover {
    color: #ff8c80;
    text-decoration: underline; }
    .ixu-cascading-theme-inverse .ixu-link:hover, .ixu-link:hover.ixu-cascading-theme-inverse {
      color: #d6d6d6; }
    .ixu-cascading-theme-danger .ixu-link:hover, .ixu-link:hover.ixu-cascading-theme-danger {
      color: rgba(255, 255, 255, 0.75); }
    .ixu-cascading-theme-issuu .ixu-link:hover, .ixu-link:hover.ixu-cascading-theme-issuu {
      color: rgba(255, 255, 255, 0.75); }
    .ixu-cascading-theme-positive .ixu-link:hover, .ixu-link:hover.ixu-cascading-theme-positive {
      color: rgba(255, 255, 255, 0.75); }

/* postcss-bem-linter: define ixu-paragraph */
/*
@bemagic {
    intro: In our framework, all paragraphs are reset to the base (body text) size, with margins and padding reset to zero. Use this component to get a typical paragraph styling.
    description: The default paragraph
    required: true
}
*/
.ixu-paragraph {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  color: #69655e;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  /* To simplify the user interface, we allow nested typography elements within paragraphs */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */
  /* To simplify the user interface, we allow nested typography elements within paragraphs */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */
  /* To simplify the user interface, we allow nested typography elements within paragraphs */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */ }
  .ixu-cascading-fluid-typography .ixu-paragraph, .ixu-paragraph.ixu-cascading-fluid-typography {
    font-size: 14px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-paragraph, .ixu-paragraph.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(14px + 2 * (100vw - 320px) / 880);
        font-size: calc(14px + 2 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-paragraph, .ixu-paragraph.ixu-cascading-fluid-typography {
        font-size: 16px; } }
  .ixu-cascading-theme-inverse .ixu-paragraph, .ixu-paragraph.ixu-cascading-theme-inverse {
    color: #a9c1c7; }
  .ixu-cascading-theme-positive .ixu-paragraph, .ixu-paragraph.ixu-cascading-theme-positive {
    color: #fff; }
  .ixu-cascading-theme-danger .ixu-paragraph, .ixu-paragraph.ixu-cascading-theme-danger {
    color: #fff; }
  .ixu-cascading-theme-issuu .ixu-paragraph, .ixu-paragraph.ixu-cascading-theme-issuu {
    color: #fff; }
  .ixu-paragraph em {
    font-style: italic; }
  .ixu-paragraph strong {
    font-weight: 600; }
  .ixu-paragraph a {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background-color: transparent;
    border: 0;
    color: #f26f61;
    cursor: pointer;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    text-decoration: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    .ixu-cascading-theme-inverse .ixu-paragraph a, .ixu-paragraph a.ixu-cascading-theme-inverse {
      color: #fff; }
    .ixu-cascading-theme-danger .ixu-paragraph a, .ixu-paragraph a.ixu-cascading-theme-danger {
      color: #fff;
      text-decoration: underline; }
    .ixu-cascading-theme-issuu .ixu-paragraph a, .ixu-paragraph a.ixu-cascading-theme-issuu {
      color: #fff;
      text-decoration: underline; }
    .ixu-cascading-theme-positive .ixu-paragraph a, .ixu-paragraph a.ixu-cascading-theme-positive {
      color: #fff;
      text-decoration: underline; }
    .ixu-paragraph a:hover {
      color: #ff8c80;
      text-decoration: underline; }
      .ixu-cascading-theme-inverse .ixu-paragraph a:hover, .ixu-paragraph a:hover.ixu-cascading-theme-inverse {
        color: #d6d6d6; }
      .ixu-cascading-theme-danger .ixu-paragraph a:hover, .ixu-paragraph a:hover.ixu-cascading-theme-danger {
        color: rgba(255, 255, 255, 0.75); }
      .ixu-cascading-theme-issuu .ixu-paragraph a:hover, .ixu-paragraph a:hover.ixu-cascading-theme-issuu {
        color: rgba(255, 255, 255, 0.75); }
      .ixu-cascading-theme-positive .ixu-paragraph a:hover, .ixu-paragraph a:hover.ixu-cascading-theme-positive {
        color: rgba(255, 255, 255, 0.75); }

/*
@bemagic {
    description: A heading using the issuu primary (brand) color
}
*/
.ixu-paragraph--pronounced {
  color: #353535; }
  .ixu-cascading-theme-inverse .ixu-paragraph--pronounced, .ixu-paragraph--pronounced.ixu-cascading-theme-inverse {
    color: #fff; }

/*
@bemagic {
    description: A heading using the issuu primary (brand) color
}
*/
.ixu-paragraph--issuu-brand {
  color: #f26f61; }
  .ixu-cascading-theme-inverse .ixu-paragraph--issuu-brand, .ixu-paragraph--issuu-brand.ixu-cascading-theme-inverse {
    color: #f26f61; }

/*
@bemagic {
    description: Used for light headings
}
*/
.ixu-paragraph--light {
  font-weight: 300;
  /* To simplify the user interface, we allow nested typography elements within paragraphs */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */ }
  .ixu-paragraph--light strong {
    font-weight: 400; }

/*
@bemagic {
    description: Used for semibold paragraphs
}
*/
.ixu-paragraph--semibold {
  font-weight: 600;
  /* To simplify the user interface, we allow nested typography elements within paragraphs */
  /* stylelint-disable-next-line plugin/selector-bem-pattern */ }
  .ixu-paragraph--semibold strong {
    font-weight: 700; }

/*
@bemagic {
    description: Used for bold paragraphs
}
*/
.ixu-paragraph--bold {
  font-weight: 700; }

/*
@bemagic {
    description: A very large paragraph great for page intro's or large multiline text
}
*/
.ixu-paragraph--huge {
  font-size: 24px; }
  .ixu-cascading-fluid-typography .ixu-paragraph--huge, .ixu-paragraph--huge.ixu-cascading-fluid-typography {
    font-size: 20px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--huge, .ixu-paragraph--huge.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(20px + 4 * (100vw - 320px) / 880);
        font-size: calc(20px + 4 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--huge, .ixu-paragraph--huge.ixu-cascading-fluid-typography {
        font-size: 24px; } }

/*
@bemagic {
    description: A very large paragraph great for page intro's or large multiline text
}
*/
.ixu-paragraph--large {
  font-size: 20px; }
  .ixu-cascading-fluid-typography .ixu-paragraph--large, .ixu-paragraph--large.ixu-cascading-fluid-typography {
    font-size: 16px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--large, .ixu-paragraph--large.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(16px + 4 * (100vw - 320px) / 880);
        font-size: calc(16px + 4 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--large, .ixu-paragraph--large.ixu-cascading-fluid-typography {
        font-size: 20px; } }

/*
@bemagic {
    description: A small paragraph useful compressing lots of text in a small space
}
*/
.ixu-paragraph--small {
  font-size: 14px; }
  .ixu-cascading-fluid-typography .ixu-paragraph--small, .ixu-paragraph--small.ixu-cascading-fluid-typography {
    font-size: 12px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--small, .ixu-paragraph--small.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(12px + 2 * (100vw - 320px) / 880);
        font-size: calc(12px + 2 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--small, .ixu-paragraph--small.ixu-cascading-fluid-typography {
        font-size: 14px; } }

/*
@bemagic {
    description: A very small paragraph useful compressing lots of text in a very small space
}
*/
.ixu-paragraph--tiny {
  font-size: 12px; }
  .ixu-cascading-fluid-typography .ixu-paragraph--tiny, .ixu-paragraph--tiny.ixu-cascading-fluid-typography {
    font-size: 10px; }
    @media screen and (min-width: 320px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--tiny, .ixu-paragraph--tiny.ixu-cascading-fluid-typography {
        font-size: -webkit-calc(10px + 2 * (100vw - 320px) / 880);
        font-size: calc(10px + 2 * (100vw - 320px) / 880); } }
    @media screen and (min-width: 1200px) {
      .ixu-cascading-fluid-typography .ixu-paragraph--tiny, .ixu-paragraph--tiny.ixu-cascading-fluid-typography {
        font-size: 12px; } }

/* postcss-bem-linter: define ixu-select */
/*
@bemagic {
    intro: Apply this class to a `select` html element to get the default iCSSuu select styling. Select `option`'s intentionally have native styling as it is hard to achieve consistent custom styling of these and also the native ones usually look acceptable.
    description: A select designed for issuu components
}
*/
.ixu-select {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  -moz-appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='%23ccc6ba'%3E%3Cpath d='M.078 6.375Q.234 6 .672 6h30.656q.422 0 .61.414t-.08.664L16.516 25.734Q16.295 26 16 26q-.345 0-.517-.266L.14 7.078q-.25-.25-.064-.703z'/%3E%3C/svg%3E");
  background-position: -webkit-calc(100% - 12px) 50%;
  background-position: calc(100% - 12px) 50%;
  background-repeat: no-repeat;
  background-size: 10px;
  border: 1px solid #b3ada1;
  border-radius: 3px;
  color: #353535;
  cursor: pointer;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 14px;
  height: 36px;
  line-height: normal;
  outline: none;
  padding: 0 36px 0 12px;
  -webkit-transition: 150ms;
  transition: 150ms;
  width: 100%; }
  .ixu-cascading-theme-inverse .ixu-select, .ixu-select.ixu-cascading-theme-inverse {
    background-color: #353535;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='%236c7d80'%3E%3Cpath d='M.078 6.375Q.234 6 .672 6h30.656q.422 0 .61.414t-.08.664L16.516 25.734Q16.295 26 16 26q-.345 0-.517-.266L.14 7.078q-.25-.25-.064-.703z'/%3E%3C/svg%3E");
    border-color: #98aeb3;
    color: #fff; }
  .ixu-select:hover {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='%23353535'%3E%3Cpath d='M.078 6.375Q.234 6 .672 6h30.656q.422 0 .61.414t-.08.664L16.516 25.734Q16.295 26 16 26q-.345 0-.517-.266L.14 7.078q-.25-.25-.064-.703z'/%3E%3C/svg%3E"); }
    .ixu-cascading-theme-inverse .ixu-select:hover, .ixu-select:hover.ixu-cascading-theme-inverse {
      background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath d='M.078 6.375Q.234 6 .672 6h30.656q.422 0 .61.414t-.08.664L16.516 25.734Q16.295 26 16 26q-.345 0-.517-.266L.14 7.078q-.25-.25-.064-.703z'/%3E%3C/svg%3E"); }
  @media screen and (max-width: 480px) {
    .ixu-select {
      font-size: 16px; } }
  .ixu-select:disabled {
    border-style: dashed;
    cursor: not-allowed;
    opacity: .75; }
  .ixu-select::-ms-expand {
    display: none; }

/* postcss-bem-linter: define ixu-tabs */
/*
@bemagic {
    intro: A tab keeps related content in a single container that is shown and hidden through navigation. To get the best result, the proposed HTML elements should be used.
    description: A container around the tabs controlling the layout
    required: true
    tag: ul
}
*/
.ixu-tabs {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  list-style-type: none; }

/*
@bemagic {
    description: A tab element that will be separated from other tabs
    tag: li
}
*/
.ixu-tabs__item {
  margin-right: 36px;
  position: relative; }
  .ixu-tabs__item:last-child {
    margin-right: 0; }

/*
@bemagic {
    description: A link element with a line beneath when active
    tag: a
}
*/
.ixu-tabs__link {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #69655e;
  cursor: pointer;
  display: block;
  line-height: 36px;
  list-style-type: none;
  position: relative;
  text-decoration: none;
  -webkit-transition: color 150ms;
  transition: color 150ms;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  white-space: nowrap; }
  .ixu-cascading-theme-inverse .ixu-tabs__link, .ixu-tabs__link.ixu-cascading-theme-inverse {
    color: #a9c1c7; }
  .ixu-tabs__link:active, .ixu-tabs__link:focus, .ixu-tabs__link:hover {
    color: #353535; }
    .ixu-cascading-theme-inverse .ixu-tabs__link:active, .ixu-tabs__link:active.ixu-cascading-theme-inverse, .ixu-cascading-theme-inverse .ixu-tabs__link:focus, .ixu-tabs__link:focus.ixu-cascading-theme-inverse, .ixu-cascading-theme-inverse .ixu-tabs__link:hover, .ixu-tabs__link:hover.ixu-cascading-theme-inverse {
      color: #fff; }
  .ixu-tabs__link.is-active:not(.ixu-tabs__link--more) {
    color: #353535; }
    .ixu-cascading-theme-inverse .ixu-tabs__link.is-active:not(.ixu-tabs__link--more), .ixu-tabs__link.is-active:not(.ixu-tabs__link--more).ixu-cascading-theme-inverse {
      color: #fff; }
    .ixu-tabs__link.is-active:not(.ixu-tabs__link--more)::before {
      background-color: #f26f61;
      bottom: 0;
      content: '';
      height: 2px;
      left: 0;
      position: absolute;
      width: 100%; }

/*
@bemagic {
    description: A variation of the link element with a down-arrow to the right and a changed
    *
    tag: a
}
*/
.ixu-tabs__link--more {
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }
  .ixu-tabs__link--more.is-active {
    color: #f26f61; }
  .ixu-tabs__link--more::after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid currentColor;
    content: '';
    height: 0;
    margin-left: 4px;
    width: 0; }

/* postcss-bem-linter: define ixu-textfield */
/*
@bemagic {
    intro: Apply this class to an inputfield of type `text` or `search` to recieve a custom looking issuu input including state handling
    description: A text input designed for the issuu brand
    required: true
    placeholder: Some placeholder
    tag: input
}
*/
.ixu-textfield {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  -webkit-appearance: none;
  background-color: #fff;
  border: 1px solid #b3ada1;
  border-radius: 3px;
  color: #353535;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 14px;
  height: 36px;
  line-height: normal;
  padding: 0 12px;
  -webkit-transition: border-color 150ms;
  transition: border-color 150ms;
  width: 100%; }
  .ixu-cascading-theme-inverse .ixu-textfield, .ixu-textfield.ixu-cascading-theme-inverse {
    background-color: #353535;
    border-color: #98aeb3;
    color: #fff; }
    .ixu-cascading-theme-inverse .ixu-textfield::-webkit-input-placeholder, .ixu-textfield.ixu-cascading-theme-inverse::-webkit-input-placeholder {
      color: #6c7d80; }
    .ixu-cascading-theme-inverse .ixu-textfield::-moz-placeholder, .ixu-textfield.ixu-cascading-theme-inverse::-moz-placeholder {
      color: #6c7d80; }
    .ixu-cascading-theme-inverse .ixu-textfield:-ms-input-placeholder, .ixu-textfield.ixu-cascading-theme-inverse:-ms-input-placeholder {
      color: #6c7d80; }
    .ixu-cascading-theme-inverse .ixu-textfield::placeholder, .ixu-textfield.ixu-cascading-theme-inverse::placeholder {
      color: #6c7d80; }
  .ixu-textfield.is-error {
    background-color: #cc4752;
    border-color: transparent;
    color: #fff; }
    .ixu-textfield.is-error::-webkit-input-placeholder {
      color: #ff99a1; }
    .ixu-textfield.is-error::-moz-placeholder {
      color: #ff99a1; }
    .ixu-textfield.is-error:-ms-input-placeholder {
      color: #ff99a1; }
    .ixu-textfield.is-error::placeholder {
      color: #ff99a1; }
  @media screen and (max-width: 480px) {
    .ixu-textfield {
      font-size: 16px; } }
  .ixu-textfield::-webkit-input-placeholder {
    color: #ccc6ba; }
  .ixu-textfield::-moz-placeholder {
    color: #ccc6ba; }
  .ixu-textfield:-ms-input-placeholder {
    color: #ccc6ba; }
  .ixu-textfield::placeholder {
    color: #ccc6ba; }
  .ixu-textfield:disabled {
    border-style: dashed;
    cursor: not-allowed;
    opacity: .75; }
  .ixu-textfield:-moz-read-only {
    background: none;
    border-color: #b3ada1;
    cursor: default;
    opacity: .75; }
  .ixu-textfield:read-only {
    background: none;
    border-color: #b3ada1;
    cursor: default;
    opacity: .75; }
    .ixu-cascading-theme-inverse .ixu-textfield:-moz-read-only, .ixu-textfield:-moz-read-only.ixu-cascading-theme-inverse {
      border-color: #98aeb3; }
    .ixu-cascading-theme-inverse .ixu-textfield:read-only, .ixu-textfield:read-only.ixu-cascading-theme-inverse {
      border-color: #98aeb3; }

/*
@bemagic {
    description: Use this variation for inputs of type search
    placeholder: Some placeholder
    type: search
}
*/
.ixu-textfield--search {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23ccc6ba' height='18px' width='18px'%3E%3Cpath d='M0 29.33q0 1.1.78 1.9t1.9.77 1.88-.78l9.04-9.08Q16.52 24 20 24q3.28 0 6.03-1.6 2.77-1.63 4.37-4.4t1.6-6q0-3.28-1.6-6.03Q28.77 3.2 26 1.6T20 0q-3.28 0-6.02 1.6Q11.2 3.23 9.6 6T8 12q0 3.48 1.86 6.4L.78 27.45q-.78.78-.78 1.9zM12 12q0-1.6.64-3.1t1.7-2.56q1.1-1.1 2.57-1.72T20 4t3.1.63 2.56 1.72 1.72 2.56T28 12t-.63 3.1-1.72 2.56-2.56 1.72T20 20t-3.1-.63-2.57-1.72-1.72-2.56T12 12z'/%3E%3C/svg%3E");
  background-position: 18px center;
  background-repeat: no-repeat;
  background-size: 18px;
  border-radius: 18px;
  padding-left: 48px; }
  .ixu-cascading-theme-inverse .ixu-textfield--search, .ixu-textfield--search.ixu-cascading-theme-inverse {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%236c7d80' height='18px' width='18px'%3E%3Cpath d='M0 29.33q0 1.1.78 1.9t1.9.77 1.88-.78l9.04-9.08Q16.52 24 20 24q3.28 0 6.03-1.6 2.77-1.63 4.37-4.4t1.6-6q0-3.28-1.6-6.03Q28.77 3.2 26 1.6T20 0q-3.28 0-6.02 1.6Q11.2 3.23 9.6 6T8 12q0 3.48 1.86 6.4L.78 27.45q-.78.78-.78 1.9zM12 12q0-1.6.64-3.1t1.7-2.56q1.1-1.1 2.57-1.72T20 4t3.1.63 2.56 1.72 1.72 2.56T28 12t-.63 3.1-1.72 2.56-2.56 1.72T20 20t-3.1-.63-2.57-1.72-1.72-2.56T12 12z'/%3E%3C/svg%3E"); }

/*
@bemagic {
    description: Use this variation for textareas (multiline, resizable) inputs
    tag: textarea
}
*/
.ixu-textfield--multiline {
  height: auto;
  padding: 12px; }

/* postcss-bem-linter: define ixu-radio */
/*
@bemagic {
    intro: The ability to style radio buttons with CSS varies across browsers. To ensure that radio buttons look the same everywhere, we use a custom DOM. Pay close attention to the markup, because all elements must exist for the styles to work. **NOTE** The tag for this component should be `<label>` when used by itself (without a label). See `ixu-form-element` for usage with a label
    description: A customly styled radio button that fits the issuu design system
    tag: label
    text: ''
}
*/
.ixu-radio {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline; }

/*
@bemagic {
    description: The actual radio button (hidden to allow custom styling)
    required: true
    tag: input
}
*/
.ixu-radio__native {
  height: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  width: 0; }

/*
@bemagic {
    description: A "fake" (artificial) radio button used for custom styling,
    text: ''
    required: true
}
*/
.ixu-radio__faux {
  background-color: #fff;
  border: 1px solid #b3ada1;
  border-radius: 10px;
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  color: transparent;
  cursor: pointer;
  height: 20px;
  position: relative;
  -webkit-transition: 150ms;
  transition: 150ms;
  width: 20px; }
  .ixu-cascading-theme-inverse .ixu-radio__faux, .ixu-radio__faux.ixu-cascading-theme-inverse {
    background-color: #353535;
    border: 1px solid #98aeb3; }
  .ixu-radio__native:hover + .ixu-radio__faux {
    color: #ccc6ba; }
    .ixu-cascading-theme-inverse .ixu-radio__native:hover + .ixu-radio__faux, .ixu-radio__native:hover + .ixu-radio__faux.ixu-cascading-theme-inverse {
      color: #6c7d80; }
  .ixu-radio__native:active + .ixu-radio__faux,
  .ixu-radio__native:checked + .ixu-radio__faux {
    color: #353535; }
    .ixu-cascading-theme-inverse .ixu-radio__native:active + .ixu-radio__faux, .ixu-radio__native:active + .ixu-radio__faux.ixu-cascading-theme-inverse, .ixu-cascading-theme-inverse
    .ixu-radio__native:checked + .ixu-radio__faux,
    .ixu-radio__native:checked + .ixu-radio__faux.ixu-cascading-theme-inverse {
      color: #fff; }
  .ixu-radio__native:disabled + .ixu-radio__faux {
    border-style: dashed;
    cursor: not-allowed;
    opacity: .5; }
  .ixu-radio__faux::after {
    background-color: currentColor;
    border-radius: 50%;
    content: '';
    height: 8px;
    left: 5px;
    position: absolute;
    top: 5px;
    width: 8px; }

/*
@bemagic {
    intro: The `ixu-modal` provides a semi-transparent background (for overlaying a page) and a shell for modal content. It will position itself `fixed` within its closest positioned parent. In most cases, you'll probably want to have it as a direct descendant of the `<body>` so that it can take over the entire screen. We **strongly** recommend using the [`Modal`](ixu.issuu.com/react/#Modal) component in `issuu-ixu-react` package. But if you don't, make sure to address accesibility issues and support the same interactions.
    description: The modal overlay and container for the modal contents. Mutes out the underlying page and centers the modal content.
    experimental: true
    container: true
}
*/
.ixu-modal {
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: rgba(0, 0, 0, 0.7);
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  left: 0;
  opacity: 0;
  overflow: scroll;
  position: fixed;
  top: 0;
  -webkit-transition: 150ms;
  transition: 150ms;
  visibility: none;
  width: 100%; }
  .ixu-modal.is-open {
    opacity: 1;
    visibility: visible; }

/*
@bemagic {
    description: The the wrapper for the modal content.
    container: true
    mandatory
}
*/
.ixu-modal__inner {
  background-color: #f2f0eb;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
  margin: 12px;
  position: relative; }
  .ixu-cascading-theme-inverse .ixu-modal__inner, .ixu-modal__inner.ixu-cascading-theme-inverse {
    background-color: #424242; }
  .ixu-cascading-theme-issuu .ixu-modal__inner, .ixu-modal__inner.ixu-cascading-theme-issuu {
    background-color: #d95a4c; }
  .ixu-cascading-theme-positive .ixu-modal__inner, .ixu-modal__inner.ixu-cascading-theme-positive {
    background-color: #59b377; }
  .ixu-cascading-theme-danger .ixu-modal__inner, .ixu-modal__inner.ixu-cascading-theme-danger {
    background-color: #cc4752; }

/*
@bemagic {
    description: A container adding padding to the contents of the modal. We have use-cases where it is necessary to omit padding within the modal. This is not required, but should almost always be used.
    parent: inner
    container: true
}
*/
.ixu-modal__content {
  padding: 30px; }

/*
@bemagic {
    tag: button
    parent: inner
    description: A rounded button positioned absolutely in the top-right of the modal.
    container: true
    mandatory
}
*/
.ixu-modal__close-button {
  background-color: #e8e4dc;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23b3ada1' height='10px' width='10px'%3E%3Cpath d='M6.446 8L.322 14.124c-.43.43-.43 1.126 0 1.555.215.213.496.32.777.32.28 0 .562-.107.776-.32L8 9.554l6.124 6.124c.214.213.496.32.777.32.282 0 .563-.107.778-.32.43-.43.43-1.126 0-1.556L9.554 8l6.124-6.124c.43-.43.43-1.125 0-1.554-.43-.43-1.125-.43-1.554 0L8 6.446 1.876.322c-.43-.43-1.125-.43-1.554 0-.43.43-.43 1.125 0 1.554L6.446 8z'/%3E%3C/svg%3E");
  background-position: 5px 5px;
  background-repeat: no-repeat;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  height: 20px;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 20px; }
  .ixu-cascading-theme-inverse .ixu-modal__close-button, .ixu-modal__close-button.ixu-cascading-theme-inverse {
    background-color: #4c4c4c;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%238da2a6' height='10px' width='10px'%3E%3Cpath d='M6.446 8L.322 14.124c-.43.43-.43 1.126 0 1.555.215.213.496.32.777.32.28 0 .562-.107.776-.32L8 9.554l6.124 6.124c.214.213.496.32.777.32.282 0 .563-.107.778-.32.43-.43.43-1.126 0-1.556L9.554 8l6.124-6.124c.43-.43.43-1.125 0-1.554-.43-.43-1.125-.43-1.554 0L8 6.446 1.876.322c-.43-.43-1.125-.43-1.554 0-.43.43-.43 1.125 0 1.554L6.446 8z'/%3E%3C/svg%3E"); }
  .ixu-cascading-theme-issuu .ixu-modal__close-button, .ixu-modal__close-button.ixu-cascading-theme-issuu {
    background-color: #cc5547;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffa399' height='10px' width='10px'%3E%3Cpath d='M6.446 8L.322 14.124c-.43.43-.43 1.126 0 1.555.215.213.496.32.777.32.28 0 .562-.107.776-.32L8 9.554l6.124 6.124c.214.213.496.32.777.32.282 0 .563-.107.778-.32.43-.43.43-1.126 0-1.556L9.554 8l6.124-6.124c.43-.43.43-1.125 0-1.554-.43-.43-1.125-.43-1.554 0L8 6.446 1.876.322c-.43-.43-1.125-.43-1.554 0-.43.43-.43 1.125 0 1.554L6.446 8z'/%3E%3C/svg%3E"); }
  .ixu-cascading-theme-positive .ixu-modal__close-button, .ixu-modal__close-button.ixu-cascading-theme-positive {
    background-color: #54996b;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23b6f2ca' height='10px' width='10px'%3E%3Cpath d='M6.446 8L.322 14.124c-.43.43-.43 1.126 0 1.555.215.213.496.32.777.32.28 0 .562-.107.776-.32L8 9.554l6.124 6.124c.214.213.496.32.777.32.282 0 .563-.107.778-.32.43-.43.43-1.126 0-1.556L9.554 8l6.124-6.124c.43-.43.43-1.125 0-1.554-.43-.43-1.125-.43-1.554 0L8 6.446 1.876.322c-.43-.43-1.125-.43-1.554 0-.43.43-.43 1.125 0 1.554L6.446 8z'/%3E%3C/svg%3E"); }
  .ixu-cascading-theme-danger .ixu-modal__close-button, .ixu-modal__close-button.ixu-cascading-theme-danger {
    background-color: #b33640;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff99a1' height='10px' width='10px'%3E%3Cpath d='M6.446 8L.322 14.124c-.43.43-.43 1.126 0 1.555.215.213.496.32.777.32.28 0 .562-.107.776-.32L8 9.554l6.124 6.124c.214.213.496.32.777.32.282 0 .563-.107.778-.32.43-.43.43-1.126 0-1.556L9.554 8l6.124-6.124c.43-.43.43-1.125 0-1.554-.43-.43-1.125-.43-1.554 0L8 6.446 1.876.322c-.43-.43-1.125-.43-1.554 0-.43.43-.43 1.125 0 1.554L6.446 8z'/%3E%3C/svg%3E"); }