/* black, we use this for basic text */
/* purple */
/* blue */
/* orange */
/* brownish */
/* green */
/* pumpkin */
body, html, p, ul, ol, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0; }

b {
  font-weight: bold; }

a {
  text-decoration: none; }

h1, h2, h3, h4, h5, h6 {
  font-size: 1rem; }

b {
  color: #784a9e; }

a {
  color: #000; }
  a:visited {
    color: #000; }
  a:active {
    color: #784a9e; }
  a.current {
    color: #784a9e; }

html {
  width: 100%;
  height: 100%;
  font-family: 'Times New Roman',serif;
  font-size: 1em; }
  @media (max-width: 960px) {
    html {
      font-size: 0.8em; } }

body {
  background: #e5d8c9;
  background: -moz-radial-gradient(50% 75%, ellipse cover, #f4eee6 0%, #e5d8c9 100%);
  background: -webkit-radial-gradient(ellipse, 50% 75%, 0px, 50% 75%, 100%, color-stop(0%, #f4eee6), color-stop(100%, #e5d8c9));
  background: -ms-radial-gradient(50% 75%, ellipse cover, #f4eee6 0%, #e5d8c9 100%);
  background: radial-gradient(ellipse at 50% 75%, #f4eee6 0%, #e5d8c9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4eee6', endColorstr='#e5d8c9',GradientType=0 ) fixed;
  /*background: url(../img/back_survey.png) no-repeat 0 0;*/
  background-size: cover;
  background-repeat: no-repeat; }
  @media (max-width: 960px) {
    body {
      position: relative; } }

.content {
  clear: both;
  position: relative;
  min-height: calc(100% - 134px); }
  @media (max-width: 960px) {
    .content {
      padding-bottom: 80px; } }

.purple {
  color: #784a9e;
  font-family: "Arial Bold", Arial;
  font-weight: 900;
  font-style: italic; }

.logo .purple, .block h1 .purple {
  font-style: normal; }

.reg {
  font-size: 0.75em;
  vertical-align: super; }

.button {
  display: inline-block;
  width: 266px;
  height: 47px;
  font-size: 0;
  background: url(../img/sprite.png) no-repeat -100px 0; }
  .button.button-email {
    background-position: -100px 0; }
  .button.button-cart {
    background-position: -100px -47px; }

.icon {
  display: inline-block;
  width: 72px;
  height: 72px;
  background: url(../img/sprite.png) no-repeat 0 -140px; }
  .icon.icon-crying-video {
    background-position: 0 -140px; }
  .icon.icon-booklet {
    background-position: 0 -212px; }
  .icon.icon-coping-video {
    height: 70px;
    width: 70px;
    margin: 1px 0;
    background-position: 0 -284px; }
  .icon.icon-survey {
    height: 70px;
    width: 70px;
    margin: 1px 0;
    background-position: 0 -354px; }

.spinner {
  width: 50px;
  height: 50px;
  display: inline-block;
  background: url(../img/spinner.gif) no-repeat 0 0; }

.pagination {
  margin-top: 55px;
  display: inline-block; }
  .pagination li {
    display: inline-block;
    background: #784a9e;
    border-radius: 8px;
    opacity: 0.15;
    width: 8px;
    height: 8px;
    margin: 0 3px;
    cursor: pointer; }
    .pagination li.active {
      opacity: 1; }

.page {
  margin: 25px auto 0;
  text-align: center; }
  @media (max-width: 960px) {
    .page {
      margin-top: 30px; } }

.block h1 {
  font-size: 1.719rem;
  line-height: 1.125rem;
  margin-top: 30px; }
  .block h1 .purple {
    font-size: 3.438rem;
    line-height: 3.4rem;
    display: block; }
.block p {
  display: block;
  margin: 22px auto 0;
  max-width: 340px;
  font-size: 1.063rem;
  line-height: 1.313rem; }
  @media (max-width: 960px) {
    .block p {
      margin-top: 25px;
      padding-left: 20px;
      padding-right: 20px;
      margin-left: auto;
      margin-right: auto; } }

.language-selector {
  display: block;
  font-size: 0.983rem;
  line-height: 1.643rem;
  text-align: center;
  margin: 0 0 15px 0;
  margin-top: 20px; }
  .language-selector li {
    margin: 0 0 15px 0;
    display: block; }
    .language-selector li a {
      font-family: "Source Sans Pro", sans-serif;
      display: inline-block;
      background: #784a9e;
      border: solid 1px rgba(120, 74, 156, 0.5);
      color: #fff;
      width: 204px;
      padding: 10px; }
      .language-selector li a.share-btn {
        font-family: "Source Sans Pro", sans-serif;
        display: inline-block;
        background: #e59a27;
        border: solid 1px rgba(229, 154, 39, 0.5);
        color: #fff;
        width: 204px;
        padding: 10px; }
        .language-selector li a.share-btn img {
          vertical-align: baseline; }
    @media (max-width: 960px) {
      .language-selector li {
        display: block;
        margin: 0 0 15px 0; }
        .language-selector li a {
          width: 204px;
          padding: 10px; } }

.popup {
  z-index: 100;
  position: absolute;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.85); }
  .popup .popup-frame {
    padding: 10px;
    background: #fff;
    margin: 0 auto;
    position: relative; }
    .popup .popup-frame > .close {
      font-family: "Source Sans Pro", sans-serif;
      font-size: 0.938rem;
      float: right;
      margin-top: -40px;
      color: #fff;
      cursor: pointer; }
  @media (max-width: 960px) {
    .popup {
      margin-top: -10px; }
      .popup .popup-frame {
        background: none;
        padding: 0; }
        .popup .popup-frame > .close {
          margin-top: -20px; }
        .popup .popup-frame.dialogue {
          background: #fff; } }

.slides-window {
  z-index: 4;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #e5d8c9;
  background: -moz-radial-gradient(50% 75%, ellipse cover, #f4eee6 0%, #e5d8c9 100%);
  background: -webkit-radial-gradient(ellipse, 50% 75%, 0px, 50% 75%, 100%, color-stop(0%, #f4eee6), color-stop(100%, #e5d8c9));
  background: -ms-radial-gradient(50% 75%, ellipse cover, #f4eee6 0%, #e5d8c9 100%);
  background: radial-gradient(ellipse at 50% 75%, #f4eee6 0%, #e5d8c9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4eee6', endColorstr='#e5d8c9',GradientType=0 ) fixed; }
  .slides-window .slides {
    position: absolute;
    transition: left 0.25s ease-in-out;
    top: 0;
    left: 0;
    height: 100%;
    white-space: nowrap; }
    .slides-window .slides .slide {
      overflow: auto;
      /* margin collapse */
      width: 570px;
      height: 100%;
      display: inline-block;
      background-size: contain;
      white-space: normal; }
      .slides-window .slides .slide.a {
        background: #f00; }
      .slides-window .slides .slide.b {
        background: #0f0; }
      .slides-window .slides .slide.c {
        background: #00f; }

.control {
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .control.disabled {
    opacity: 0.25;
    cursor: not-allowed; }

.button.close {
  color: #fff;
  width: 115px;
  height: 40px;
  z-index: 5;
  font-size: 1.25rem;
  line-height: 40px;
  border-radius: 4px;
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
  background: #2da238;
  background: -moz-linear-gradient(top, #49c55c 0%, #2da238 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #49c55c), color-stop(100%, #2da238));
  background: -webkit-linear-gradient(top, #49c55c 0%, #2da238 100%);
  background: -o-linear-gradient(top, #49c55c 0%, #2da238 100%);
  background: -ms-linear-gradient(top, #49c55c 0%, #2da238 100%);
  background: linear-gradient(to bottom, #49c55c 0%, #2da238 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49c55c', endColorstr='#2da238',GradientType=0 ) fixed; }

.page .block h1.coping-title .purple {
  font-size: 2.25rem;
  line-height: 2.2rem;
  margin-bottom: 5px; }
  .page .block h1.coping-title .purple .reg {
    vertical-align: middle;
    display: inline-block;
    margin-top: -0.5em;
    font-weight: normal;
    font-family: "Arial", "sans-serif"; }

.header {
  background: rgba(255, 255, 255, 0.25);
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.2);
  height: 54px;
  line-height: 54px;
  padding-top: 0;
  padding-right: 0px;
  padding-left: 55px;
  padding-bottom: 0; }
  @media (max-width: 960px) {
    .header {
      padding: 0; } }
  .header .logo {
    float: left;
    font-weight: 700;
    font-size: 1.25rem; }
    .header .logo .logo-title {
      display: block; }
    .header .logo .logo-home {
      font-family: "Source Sans Pro", sans-serif;
      display: none;
      color: #784a9e; }
    @media (max-width: 960px) {
      .header .logo .logo-home {
        display: block;
        margin-left: 10px; }
      .header .logo .logo-title {
        display: none; } }
  .header .navigation {
    float: right; }
    .header .navigation .trigger {
      display: inline-block;
      width: 53px;
      height: 100%;
      cursor: pointer;
      text-align: center;
      margin-left: 20px; }
      .header .navigation .trigger .doodad {
        display: inline-block;
        background: url(../img/sprite.png) no-repeat 0 -500px;
        width: 25px;
        height: 20px;
        vertical-align: middle; }
      .header .navigation .trigger.active {
        background-color: #784a9e; }
    .header .navigation .external-menu {
      z-index: 100;
      list-style: none;
      font-family: 'Source Sans Pro';
      font-size: 1.125rem;
      display: inline-block;
      /* smaller displays get the hamburger layout */ }
      .header .navigation .external-menu li {
        display: inline-block;
        margin-left: 30px; }
        .header .navigation .external-menu li.menu-access-code {
          display: none; }
        @media (max-width: 960px) {
          .header .navigation .external-menu li.menu-access-code {
            display: block;
            background: #784a9e;
            color: #fff;
            text-align: center;
            padding-bottom: 30px;
            padding-top: 30px; }
            .header .navigation .external-menu li.menu-access-code p {
              line-height: 1em;
              font-size: 12px; }
              .header .navigation .external-menu li.menu-access-code p strong {
                font-weight: normal; }
              .header .navigation .external-menu li.menu-access-code p .code {
                font-size: 16px;
                padding: 14px;
                display: inline-block; } }
        .header .navigation .external-menu li a {
          display: block;
          white-space: nowrap; }
        .header .navigation .external-menu li.open a {
          color: #784a9e; }
        .header .navigation .external-menu li:first-child {
          margin-left: 0; }
        .header .navigation .external-menu li.has-submenu > a:after {
          content: ' \25BC';
          /* this is a triangle pointing down */
          font-size: 0.75rem;
          margin-left: 3px; }
      .header .navigation .external-menu .submenu {
        display: none;
        position: absolute;
        font-size: 0.938rem;
        line-height: 2.188rem;
        font-weight: 600;
        z-index: 200; }
        .header .navigation .external-menu .submenu.visible {
          display: block; }
        .header .navigation .external-menu .submenu li {
          display: block;
          margin: 0; }
          .header .navigation .external-menu .submenu li a {
            padding: 16px 21px;
            color: #fff;
            background: #784a9e; }
          .header .navigation .external-menu .submenu li:nth-child(0n+1):hover a {
            background: #08b1cb; }
          .header .navigation .external-menu .submenu li:nth-child(0n+2):hover a {
            background: #e59a27; }
          .header .navigation .external-menu .submenu li:nth-child(0n+3):hover a {
            background: #e54c3a; }
      @media (max-width: 960px) {
        .header .navigation .external-menu {
          position: absolute;
          top: 54px;
          right: 0;
          text-align: right;
          display: none; }
          .header .navigation .external-menu.visible {
            display: block; }
          .header .navigation .external-menu li {
            display: block;
            margin: 0; }
            .header .navigation .external-menu li a {
              padding: 16px 21px;
              color: #fff;
              background: #784a9e; }
            .header .navigation .external-menu li.has-submenu > a {
              display: none; }
              .header .navigation .external-menu li.has-submenu > a:after {
                content: ''; }
            .header .navigation .external-menu li .submenu {
              display: block;
              position: static; }
            .header .navigation .external-menu li:hover:nth-child(0n+2) a {
              background: #e59a27; }
            .header .navigation .external-menu li:hover:nth-child(0n+3) a {
              background: #e54c3a; }
            .header .navigation .external-menu li:hover:nth-child(0n+4) a {
              background: #08b1cb; }
            .header .navigation .external-menu li:hover:nth-child(0n+5) a {
              background: #784a9e; } }
    .header .navigation .small-menu {
      z-index: 100;
      list-style: none;
      font-family: 'Source Sans Pro';
      font-size: 1.125rem;
      display: inline-block;
      position: absolute;
      top: 54px;
      right: 0;
      text-align: right;
      display: none; }
      .header .navigation .small-menu li {
        display: inline-block;
        margin-left: 30px; }
        .header .navigation .small-menu li.menu-access-code {
          display: none; }
        @media (max-width: 960px) {
          .header .navigation .small-menu li.menu-access-code {
            display: block;
            background: #784a9e;
            color: #fff;
            text-align: center;
            padding-bottom: 30px;
            padding-top: 30px; }
            .header .navigation .small-menu li.menu-access-code p {
              line-height: 1em;
              font-size: 12px; }
              .header .navigation .small-menu li.menu-access-code p strong {
                font-weight: normal; }
              .header .navigation .small-menu li.menu-access-code p .code {
                font-size: 16px;
                padding: 14px;
                display: inline-block; } }
        .header .navigation .small-menu li a {
          display: block;
          white-space: nowrap; }
        .header .navigation .small-menu li.open a {
          color: #784a9e; }
        .header .navigation .small-menu li:first-child {
          margin-left: 0; }
        .header .navigation .small-menu li.has-submenu > a:after {
          content: ' \25BC';
          /* this is a triangle pointing down */
          font-size: 0.75rem;
          margin-left: 3px; }
      .header .navigation .small-menu .submenu {
        display: none;
        position: absolute;
        font-size: 0.938rem;
        line-height: 2.188rem;
        font-weight: 600;
        z-index: 5; }
        .header .navigation .small-menu .submenu.visible {
          display: block; }
        .header .navigation .small-menu .submenu li {
          display: block;
          margin: 0; }
          .header .navigation .small-menu .submenu li a {
            padding: 16px 21px;
            color: #fff;
            background: #784a9e; }
          .header .navigation .small-menu .submenu li:nth-child(0n+1):hover a {
            background: #08b1cb; }
          .header .navigation .small-menu .submenu li:nth-child(0n+2):hover a {
            background: #e59a27; }
          .header .navigation .small-menu .submenu li:nth-child(0n+3):hover a {
            background: #e54c3a; }
      @media (max-width: 960px) {
        .header .navigation .small-menu {
          top: 354px; } }
      .header .navigation .small-menu.visible {
        display: block; }
      .header .navigation .small-menu li {
        display: block;
        margin: 0; }
        .header .navigation .small-menu li a {
          padding: 16px 21px;
          color: #fff;
          background: #784a9e; }
        .header .navigation .small-menu li.has-submenu > a {
          display: none; }
          .header .navigation .small-menu li.has-submenu > a:after {
            content: ''; }
        .header .navigation .small-menu li .submenu {
          display: block;
          position: static; }
        .header .navigation .small-menu li:hover:nth-child(0n+1) a {
          background: #08b1cb; }
        .header .navigation .small-menu li:hover:nth-child(0n+2) a {
          background: #e59a27; }
        .header .navigation .small-menu li:hover:nth-child(0n+3) a {
          background: #e54c3a; }
        .header .navigation .small-menu li:hover:nth-child(0n+4) a {
          background: #32b198; }

.footer {
  height: 80px;
  background: rgba(255, 255, 255, 0.5);
  z-index: 2;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  line-height: 80px;
  text-align: center; }
  @media (max-width: 960px) {
    .footer {
      position: absolute; } }
  .footer p {
    font-family: "Source Sans Pro", sans-serif;
    position: absolute; }
    .footer p.access-code {
      left: 30px; }
      .footer p.access-code .code {
        color: #784a9e;
        font-weight: bold; }
    .footer p.copyright {
      right: 30px;
      top: 0; }
    @media (max-width: 960px) {
      .footer p {
        display: none; } }
  .footer .sharebar {
    display: inline-block;
    list-style: none; }
    .footer .sharebar li {
      display: inline-block;
      margin: 0 9px; }
      .footer .sharebar li a {
        vertical-align: middle; }

textarea, .checkbox {
  background: #fff;
  border-radius: 4px;
  display: inline-block;
  font-size: 1.5rem;
  text-align: center;
  box-sizing: border-box;
  border-radius: 4px;
  box-shadow: none;
  border: solid 1px #b4b6b8;
  box-shadow: inset 0 1px 1px 1px rgba(193, 192, 194, 0.5); }

textarea {
  display: block;
  width: 100%;
  margin-top: 10px;
  text-align: left;
  padding: 10px;
  height: 8rem; }

.checkbox {
  vertical-align: middle;
  width: 50px;
  height: 50px;
  line-height: 1.75rem;
  margin-right: 20px; }
  .checkbox:checked {
    background: #fff url(../img/sprite.png) no-repeat -343px -232px; }

.dialogue {
  font-size: 1.5rem;
  max-width: 330px;
  height: auto;
  text-align: center;
  font-family: "Source Sans Pro", arial, "sans-serif"; }
  .dialogue h2 {
    font-size: 1.75rem; }
  .dialogue .button {
    border: none;
    border-top: solid 2px #c654d4;
    background: #522169;
    background: -moz-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8b37a6), color-stop(100%, #522169));
    background: -webkit-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: -o-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: -ms-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: linear-gradient(to bottom, #8b37a6 0%, #522169 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b37a6', endColorstr='#522169',GradientType=0 ) fixed;
    color: #fff;
    text-shadow: 0 0 1px black;
    font-size: 1em;
    line-height: 47px;
    display: block;
    margin: 25px auto 10px; }
  .dialogue .cancel {
    font-size: 1.07rem;
    color: #000;
    text-decoration: underline;
    opacity: 0.6;
    margin-top: 22px; }

.popup-dialogue {
  display: none; }

.share {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../img/sprite.png) no-repeat 0 0;
  font-size: 0; }
  .share.facebook {
    background-position: 0 0; }
  .share.pinterest {
    background-position: 0 -32px; }
  .share.twitter {
    background-position: 0 -64px; }
  .share.youtube {
    background-position: 0 -96px; }

.page-index .slides {
  position: relative;
  height: 340px;
  width: 340px;
  margin: 0 auto; }
  @media (max-width: 960px) {
    .page-index .slides {
      width: 272px; } }
  .page-index .slides .slide {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.5s ease-in-out; }
    .page-index .slides .slide.active {
      opacity: 1; }
    .page-index .slides .slide a {
      display: inline-block; }
    .page-index .slides .slide.active {
      display: block; }
.page-index .thumbnails {
  display: block;
  margin: 30px auto 0; }
  .page-index .thumbnails li {
    display: inline-block;
    margin: 0 17px; }
    .page-index .thumbnails li a {
      width: 226px;
      height: 140px;
      display: inline-block;
      background: url(../img/sprite.png) no-repeat -100px -420px;
      font-size: 0; }
      .page-index .thumbnails li a.thumbnail-booklet {
        background-position: -100px -280px; }
      .page-index .thumbnails li a.thumbnail-coping-video {
        background-position: -100px -140px; }
      .page-index .thumbnails li a.thumbnail-survey {
        background-position: -100px -560px; }
  @media (max-width: 960px) {
    .page-index .thumbnails {
      display: none; } }

.page-about {
  text-align: center;
  max-width: 770px;
  margin: 70px auto 0;
  font-family: "Source Sans Pro"; }
  .page-about h1 {
    font-size: 1.25rem;
    font-weight: normal; }
  .page-about .divider {
    width: 60%;
    margin: 20px auto;
    border-top: solid 1px rgba(87, 82, 76, 0.2); }
  .page-about .summary {
    font-size: 1.563rem;
    line-height: 30px;
    color: #784a9e; }
  .page-about .details {
    font-size: 1.3rem;
    line-height: 1.7rem;
    text-align: center; }
    .page-about .details p a {
      display: block;
      width: 266px;
      height: 47px;
      background: url(../img/sprite.png) no-repeat -100px -93px;
      font-size: 0;
      margin: 20px auto; }
  @media (max-width: 960px) {
    .page-about {
      margin-top: 30px;
      padding: 0 1em; }
      .page-about .details {
        overflow: auto; }
        .page-about .details p {
          float: none;
          text-align: justify;
          width: auto;
          margin: 1em; } }

.page-contact {
  font-family: "Source Sans Pro";
  max-width: 370px;
  text-align: center;
  margin: 70px auto 0;
  font-size: 1.25rem;
  line-height: 1.563rem; }
  .page-contact h2 {
    margin-top: 36px;
    font-weight: 600;
    font-size: 1.25rem; }
  .page-contact .button {
    margin-top: 25px; }
  .page-contact .phonenumbers {
    margin: 36px 0; }
  .page-contact a {
    color: #784a9e; }
    .page-contact a :hover {
      text-decoration: underline; }

.page-login, .page-dob, .page-language {
  text-align: center;
  max-width: 360px;
  margin: 0 auto; }
  @media (max-width: 960px) {
    .page-login, .page-dob, .page-language {
      max-width: 320px; } }
  .page-login .intro, .page-dob .intro, .page-language .intro {
    margin: 20px auto 40px; }
    .page-login .intro h1, .page-dob .intro h1, .page-language .intro h1 {
      font-size: 1.719rem;
      line-height: 1.125rem; }
      .page-login .intro h1 .purple, .page-dob .intro h1 .purple, .page-language .intro h1 .purple {
        font-size: 3.438rem;
        line-height: 3.4rem;
        display: block; }
    .page-login .intro p, .page-dob .intro p, .page-language .intro p {
      font-weight: bold;
      font-style: italic;
      font-size: 0.938rem;
      line-height: 1.375rem;
      margin-top: 20px; }
    .page-login .intro .purple, .page-dob .intro .purple, .page-language .intro .purple {
      font-style: normal; }
  .page-login .login-box, .page-dob .login-box, .page-language .login-box {
    background: #f9f8f3;
    border-radius: 3px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3);
    padding: 35px 24px;
    height: 365px; }
    .page-login .login-box h2, .page-dob .login-box h2, .page-language .login-box h2 {
      font-size: 1.75rem;
      line-height: 1.5rem;
      font-family: "Source Sans Pro", sans-serif;
      font-weight: normal; }
    .page-login .login-box p, .page-dob .login-box p, .page-language .login-box p {
      margin-top: 16px;
      font-size: 1rem;
      line-height: 1.125rem;
      color: #a9a9a9; }
    .page-login .login-box input, .page-dob .login-box input, .page-login .login-box .submit, .page-dob .login-box .submit, .page-language .login-box input, .page-language .login-box .submit {
      display: block;
      width: 100%;
      font-size: 1.5rem;
      line-height: 1.75rem;
      text-align: center;
      box-sizing: border-box;
      border-radius: 4px;
      padding: 25px 0;
      box-shadow: none; }
    .page-login .login-box input[type="text"], .page-dob .login-box input[type="text"], .page-login .login-box input[type="date"], .page-dob .login-box input[type="date"], .page-language .login-box input[type="text"], .page-language .login-box input[type="date"] {
      margin-top: 45px;
      border: solid 1px #b4b6b8;
      box-shadow: inset 0 1px 1px 1px rgba(193, 192, 194, 0.5);
      min-width: 250px; }
      .page-login .login-box input[type="text"].month, .page-dob .login-box input[type="text"].month, .page-login .login-box input[type="text"].day, .page-dob .login-box input[type="text"].day, .page-login .login-box input[type="date"].month, .page-dob .login-box input[type="date"].month, .page-login .login-box input[type="date"].day, .page-dob .login-box input[type="date"].day, .page-language .login-box input[type="text"].month, .page-language .login-box input[type="text"].day, .page-language .login-box input[type="date"].month, .page-language .login-box input[type="date"].day {
        width: 21%;
        margin-right: 5%; }
      .page-login .login-box input[type="text"].year, .page-dob .login-box input[type="text"].year, .page-login .login-box input[type="date"].year, .page-dob .login-box input[type="date"].year, .page-language .login-box input[type="text"].year, .page-language .login-box input[type="date"].year {
        width: 45%; }
    .page-login .login-box .submit, .page-dob .login-box .submit, .page-language .login-box .submit {
      border: none;
      border-top: solid 2px #c654d4;
      background: #522169;
      background: -moz-linear-gradient(top, #8b37a6 0%, #522169 100%);
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8b37a6), color-stop(100%, #522169));
      background: -webkit-linear-gradient(top, #8b37a6 0%, #522169 100%);
      background: -o-linear-gradient(top, #8b37a6 0%, #522169 100%);
      background: -ms-linear-gradient(top, #8b37a6 0%, #522169 100%);
      background: linear-gradient(to bottom, #8b37a6 0%, #522169 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b37a6', endColorstr='#522169',GradientType=0 ) fixed;
      color: #fff;
      text-shadow: 0 0 1px black;
      margin-top: 34px; }
    .page-login .login-box .authcode, .page-dob .login-box .authcode, .page-login .login-box .birthdate, .page-dob .login-box .birthdate, .page-login .login-box .loading, .page-dob .login-box .loading, .page-language .login-box .authcode, .page-language .login-box .birthdate, .page-language .login-box .loading {
      height: 365px; }
    .page-login .login-box .birthdate input[type="text"], .page-dob .login-box .birthdate input[type="text"], .page-language .login-box .birthdate input[type="text"] {
      display: inline-block;
      width: 100%; }
    .page-login .login-box .loading .spinner, .page-dob .login-box .loading .spinner, .page-language .login-box .loading .spinner {
      margin: 64px 0; }
    .page-login .login-box .purple, .page-dob .login-box .purple, .page-language .login-box .purple {
      font-style: normal; }
  .page-login .slides-window, .page-dob .slides-window, .page-language .slides-window {
    background: none;
    filter: none; }
    .page-login .slides-window .slides, .page-dob .slides-window .slides, .page-language .slides-window .slides {
      font-size: 0; }
      .page-login .slides-window .slides .slide, .page-dob .slides-window .slides .slide, .page-language .slides-window .slides .slide {
        width: 312px; }
        @media (max-width: 960px) {
          .page-login .slides-window .slides .slide, .page-dob .slides-window .slides .slide, .page-language .slides-window .slides .slide {
            width: 272px; } }
  .page-login .language-selector li, .page-dob .language-selector li, .page-language .language-selector li {
    display: block; }
    .page-login .language-selector li a.submit, .page-dob .language-selector li a.submit, .page-language .language-selector li a.submit {
      margin-top: 16px;
      font-size: 1.25rem;
      padding: 12px 0; }

.booklet .booklet-frame {
  width: 590px;
  height: 370px; }
  .booklet .booklet-frame .slide {
    width: 590px; }
  .booklet .booklet-frame .navigation .control {
    z-index: 5;
    display: inline-block;
    cursor: pointer;
    position: absolute;
    top: 50%;
    right: 27px;
    width: 40px;
    height: 41px;
    margin-top: -20px;
    background: url(../img/sprite.png) no-repeat -350px -140px; }
    .booklet .booklet-frame .navigation .control.prev {
      background-position: -350px -181px;
      left: 27px; }
.booklet .index {
  background: #e59a27;
  border-radius: 25px;
  color: #fff;
  font-size: 1.75rem;
  line-height: 45px;
  width: 45px;
  height: 45px;
  text-align: center;
  margin-top: 10px;
  margin-left: 10px; }
@media (max-width: 765px) {
  .booklet .booklet-frame .navigation .control {
    background: none;
    width: 50%;
    height: 100%;
    top: 0;
    right: 0; }
    .booklet .booklet-frame .navigation .control.prev {
      left: 0; } }
@media (max-width: 960px) {
  .booklet {
    margin-top: 0; }
    .booklet .booklet-frame .navigation .control {
      right: 1px; }
      .booklet .booklet-frame .navigation .control.prev {
        left: 1px; }
    .booklet .booklet-frame .close {
      position: absolute;
      top: 0;
      right: 0;
      margin: 3px 3px 0 0;
      z-index: 500;
      text-shadow: 0 0 3px rgba(0, 0, 0, 0.9); }
    .booklet .booklet-frame .index {
      width: 25px;
      height: 25px;
      line-height: 25px;
      margin-left: 10px;
      margin-top: 10px;
      font-size: 1rem; } }

.page-videos .video .video-frame {
  width: 590px;
  height: 370px; }
  @media (max-width: 960px) {
    .page-videos .video .video-frame {
      max-width: 90%;
      max-height: 70%; } }

.survey {
  font-family: "Source Sans Pro", "sans-serif";
  font-size: 1.5rem; }
  .survey .survey-frame {
    width: 600px;
    height: 800px;
    max-height: 80%; }
    @media (max-width: 960px) {
      .survey .survey-frame {
        width: 310px;
        max-height: 70%; } }
    .survey .survey-frame .progress-wrapper {
      position: relative; }
    .survey .survey-frame .progress {
      height: 16px;
      width: 0;
      background: #e54c3a;
      position: absolute;
      top: 0;
      z-index: 5; }
      .survey .survey-frame .progress.complete {
        background: #32b198; }
    .survey .survey-frame .navigation {
      margin-top: 20px;
      height: 40px; }
      .survey .survey-frame .navigation .control {
        /*position: absolute;*/
        float: left;
        /*
        bottom: 20px;
        left: 30px;
        */
        color: #fff;
        width: 115px;
        height: 40px;
        z-index: 5;
        font-size: 1.25rem;
        line-height: 40px;
        border-radius: 4px;
        text-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
        background: #e6261a;
        background: -moz-linear-gradient(top, #eb5a45 0%, #e6261a 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eb5a45), color-stop(100%, #e6261a));
        background: -webkit-linear-gradient(top, #eb5a45 0%, #e6261a 100%);
        background: -o-linear-gradient(top, #eb5a45 0%, #e6261a 100%);
        background: -ms-linear-gradient(top, #eb5a45 0%, #e6261a 100%);
        background: linear-gradient(to bottom, #eb5a45 0%, #e6261a 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eb5a45', endColorstr='#e6261a',GradientType=0 ) fixed; }
        .survey .survey-frame .navigation .control.prev {
          margin-left: 30px; }
        .survey .survey-frame .navigation .control.next {
          /*
          left: auto;
          right: 30px;
          */
          float: right;
          margin-right: 30px; }
        @media (max-width: 960px) {
          .survey .survey-frame .navigation .control {
            bottom: -50px; } }
    .survey .survey-frame .slides {
      vertical-align: top; }
    .survey .survey-frame .slide {
      text-align: center;
      vertical-align: top;
      width: 600px;
      padding: 40px 0 20px;
      box-sizing: border-box;
      overflow-y: auto; }
      @media (max-width: 960px) {
        .survey .survey-frame .slide {
          width: 310px;
          padding-bottom: 100px; } }
      .survey .survey-frame .slide .index {
        background: #e54c3a;
        border-radius: 25px;
        box-shadow: 0 0 2px 2px rgba(255, 255, 255, 0.5);
        color: #fff;
        font-size: 1.75rem;
        line-height: 45px;
        width: 45px;
        height: 45px;
        text-align: center;
        display: inline-block; }
      .survey .survey-frame .slide .title {
        margin-top: 20px;
        font-weight: normal;
        font-size: 1.5rem; }
      .survey .survey-frame .slide .question {
        width: 80%;
        width: calc(100% - 20px);
        margin: 0 auto;
        clear: both;
        /* subquestions */ }
        .survey .survey-frame .slide .question .answers {
          position: relative;
          overflow: hidden;
          /* margin collapse */ }
          .survey .survey-frame .slide .question .answers .answer {
            cursor: pointer; }
            .survey .survey-frame .slide .question .answers .answer.type-radio {
              border-radius: 100px;
              display: inline-block;
              background: #c9b8a4;
              border: solid 6px #c9b8a4;
              width: 100px;
              height: 100px;
              color: #fff;
              margin-top: 35px;
              margin-left: 8px;
              margin-right: 8px;
              vertical-align: middle;
              line-height: 100px; }
              .survey .survey-frame .slide .question .answers .answer.type-radio.active {
                background: #e54c3a; }
              .survey .survey-frame .slide .question .answers .answer.type-radio span {
                font-size: 0.9em;
                display: inline-block;
                vertical-align: middle;
                line-height: 1.5rem; }
            .survey .survey-frame .slide .question .answers .answer.type-checkbox {
              clear: both;
              text-align: left;
              vertical-align: middle;
              margin-top: 20px; }
              .survey .survey-frame .slide .question .answers .answer.type-checkbox label {
                vertical-align: middle; }
            .survey .survey-frame .slide .question .answers .answer label {
              cursor: pointer; }
            .survey .survey-frame .slide .question .answers .answer.active .checkbox {
              background: #fff url(../img/sprite.png) no-repeat -343px -232px; }
          .survey .survey-frame .slide .question .answers.count-6, .survey .survey-frame .slide .question .answers.count-5 {
            max-width: 400px;
            margin: 0 auto; }
        .survey .survey-frame .slide .question.vertical {
          /* this is a big hack to make them vertically stack, flex would make these nice but not supported in all the browsers we're targeting */ }
          .survey .survey-frame .slide .question.vertical .answer.type-radio {
            float: left;
            clear: left;
            display: block;
            position: relative;
            left: 50%;
            margin-left: -58px; }
        .survey .survey-frame .slide .question .question .title {
          font-size: 0.75em; }
        .survey .survey-frame .slide .question .question .answer.type-radio {
          width: 75px;
          height: 75px;
          line-height: 75px;
          font-size: 0.75em; }
  .survey .slide-confirmation .checkmark {
    border-radius: 100px;
    display: inline-block;
    background: #32b198;
    border: solid 6px #c9b8a4;
    width: 100px;
    height: 100px;
    color: #fff;
    margin-top: 35px;
    margin-left: 8px;
    margin-right: 8px;
    vertical-align: middle;
    line-height: 100px;
    background: #32b198 url(../img/sprite.png) no-repeat -369px -268px; }
  .survey .slide-confirmation h2 {
    font-weight: 600;
    font-size: 2rem;
    margin-top: 30px; }
  .survey .slide-confirmation p {
    margin: 25px auto 0;
    font-size: 1.25rem;
    font-weight: 200;
    width: 60%; }
  .survey .slide-confirmation .close {
    margin-top: 80px; }

body.lang-es .block h1, body.lang-fr .block h1 {
  line-height: 1.719rem; }

body.lang-es .page-index .thumbnails li a {
  background-image: url(../img/sprite_es.png); }

body.lang-fr .page-index .thumbnails li a {
  background-image: url(../img/sprite_fr.png); }

body.lang-fr .login-box {
  height: 375px; }

.betterbackground {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -5; }
  .betterbackground .betterbackground-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: none;
    background-repeat: no-repeat;
    background-position: 50% 0%;
    background-size: cover;
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    -moz-transition: opacity 0.5s;
    -ie-transition: opacity 0.5s;
    -o-transition: opacity 0.5s;
    transition: opacity 0.5s; }

.page-issue {
  font-family: "Source Sans Pro","sans-serif";
  max-width: 550px;
  font-size: 1.25rem;
  padding: 0 20px; }
  .page-issue textarea {
    margin-top: 1.25rem; }
  .page-issue input[type="submit"] {
    font-size: 1.25rem;
    margin-top: 1.25rem;
    background: #522169;
    background: -moz-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8b37a6), color-stop(100%, #522169));
    background: -webkit-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: -o-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: -ms-linear-gradient(top, #8b37a6 0%, #522169 100%);
    background: linear-gradient(to bottom, #8b37a6 0%, #522169 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b37a6', endColorstr='#522169',GradientType=0 ) fixed;
    color: #fff;
    padding: 15px 100px;
    border: none;
    cursor: pointer; }

.page-dob .dob-selector .dob-button {
  display: inline-block;
  width: 100%;
  height: 67px;
  font-size: 1.2rem;
  border: none;
  border-top: solid 2px #c654d4;
  background: #522169;
  background: -moz-linear-gradient(top, #8b37a6 0%, #522169 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8b37a6), color-stop(100%, #522169));
  background: -webkit-linear-gradient(top, #8b37a6 0%, #522169 100%);
  background: -o-linear-gradient(top, #8b37a6 0%, #522169 100%);
  background: -ms-linear-gradient(top, #8b37a6 0%, #522169 100%);
  background: linear-gradient(to bottom, #8b37a6 0%, #522169 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b37a6', endColorstr='#522169',GradientType=0 ) fixed;
  color: #fff;
  text-shadow: 0 0 1px black;
  margin-top: 14px; }

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