@font-face {
  font-family: 'Gotham Rounded';
  src: url('https://ch-api.healthhub.sg/api/public/content/a670d1f164a34547bffd8ebbba261213?v=897a527e');
  src: url('https://ch-api.healthhub.sg/api/public/content/a670d1f164a34547bffd8ebbba261213?v=897a527e?#iefix') format('embedded-opentype'),
       url('https://ch-api.healthhub.sg/api/public/content/6a5d9e1908d64e64941f65b09cb79e52?v=e7ae523c') format('woff2'),
       url('https://ch-api.healthhub.sg/api/public/content/6e873136d3954b3199bb31db29134321?v=be995703') format('woff'),
       url('https://ch-api.healthhub.sg/api/public/content/ed978be85e3e4901b02f77f1eb582e1e?v=be8bf2a0') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham Rounded';
  src: url('https://ch-api.healthhub.sg/api/public/content/26d06abd72084fb784377e416dd8b423?v=9e1a0057');
  src: url('https://ch-api.healthhub.sg/api/public/content/26d06abd72084fb784377e416dd8b423?v=9e1a0057?#iefix') format('embedded-opentype'),
       url('https://ch-api.healthhub.sg/api/public/content/5b043e673af741c1b8d1b998649ba7a7?v=4fb94c26') format('woff2'),
       url('https://ch-api.healthhub.sg/api/public/content/29e2fb32efd24fa0b4f2a871d5224afc?v=b144264c') format('woff'),
       url('https://ch-api.healthhub.sg/api/public/content/f3acfea3be724ecbb98805502cd3602b?v=c7f1af45') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham Rounded';
  src: url('https://ch-api.healthhub.sg/api/public/content/e27308b65668418c9b9ecd44e6b1926e?v=748d4bd6');
  src: url('https://ch-api.healthhub.sg/api/public/content/e27308b65668418c9b9ecd44e6b1926e?v=748d4bd6?#iefix') format('embedded-opentype'),
       url('https://ch-api.healthhub.sg/api/public/content/d496efcdb01649e0b41ab14366a4fc2a?v=a4fe71f4') format('woff2'),
       url('https://ch-api.healthhub.sg/api/public/content/9cf025550d5d461e81ccf7d6c433e2be?v=1ac230d4') format('woff'),
       url('https://ch-api.healthhub.sg/api/public/content/624c7f96adb747cfb0da3fd7f0178890?v=e386cea0') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham Rounded';
  src: url('https://ch-api.healthhub.sg/api/public/content/26d06abd72084fb784377e416dd8b423?v=9e1a0057');
  src: url('https://ch-api.healthhub.sg/api/public/content/26d06abd72084fb784377e416dd8b423?v=9e1a0057?#iefix') format('embedded-opentype'),
       url('https://ch-api.healthhub.sg/api/public/content/5b043e673af741c1b8d1b998649ba7a7?v=4fb94c26') format('woff2'),
       url('https://ch-api.healthhub.sg/api/public/content/29e2fb32efd24fa0b4f2a871d5224afc?v=b144264c') format('woff'),
       url('https://ch-api.healthhub.sg/api/public/content/f3acfea3be724ecbb98805502cd3602b?v=c7f1af45') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cocogoose';
  src: url('https://ch-api.healthhub.sg/api/public/content/15e4fa893553485c8548b1ca4fc2c992?v=a4ee880d');
  src: url('https://ch-api.healthhub.sg/api/public/content/15e4fa893553485c8548b1ca4fc2c992?v=a4ee880d?#iefix') format('embedded-opentype'),
       url('https://ch-api.healthhub.sg/api/public/content/977f32f4120e439c897777160cd8a432?v=a9e74596') format('woff2'),
       url('https://ch-api.healthhub.sg/api/public/content/f318e99787844b5eac2eb72eeecfe3d8?v=03ade0b5') format('woff'),
       url('https://ch-api.healthhub.sg/api/public/content/2eafb9ba790f45eabb5e3adef5a4731d?v=c0f35163') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* Start */
.mobile {
  display: none;
}
.desktop {
  display: block;
}
.temp-template {
  margin: 0 auto;
  padding: 0;
  clear: both;
  padding-right: 0;
  padding-left: 0;
}

.hpb-container {
  position: relative;
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  font-family: 'Gotham Rounded',Gotham,Helvetica,Arial,sans-serif;
  font-weight: 500;
  color: #000;
  background-color: #fff;
  line-height: 1.4;
  margin-top: 50px;
  margin-bottom: 100px;
}
.hpb-container:before,
.hpb-container:after {
  content: '';
  clear: both;
  display: table;
}
.hpb-container .f-1 {
  font-size: 72px;
}
.hpb-container .f-2 {
  font-size: 50px;
}
.hpb-container .f-3 {
  font-size: 21px;
  line-height: 1.43;
}
.hpb-container .f-4 {
  font-size: 17px;
}
.hpb-container .c-yellow {
  color: #faa31b;
}
.hpb-container .c-green {
  color: #009ea3;
}
.hpb-container .c-grey {
  color: #606060;
}
.hpb-container a {
  color: inherit;
  text-decoration: underline;
}
.hpb-container ul,
.hpb-container ol:not(.carousel-indicators) {
  margin: 0;
  padding: 0 0 0 1.4em;
}
.hpb-container .content-container {
  text-align: center;
}
.hpb-container .content-container p {
  padding: 0;
  margin: 0 0 1em;
  font-family: 'Gotham Rounded',Gotham,Helvetica,Arial,sans-serif !important;
  line-height: 1.43;
}
.hpb-container .content-container p>span {
  font-size: 0.933336em;
  font-weight: 500;
}
.hpb-container .content-container h1>span {
  font-size: 1.6em;
  font-weight: 400;
}
.hpb-container .content-container h2>span {
  font-size: 1.333336em;
  font-weight: 400;
}
.hpb-container .content-container .heading,
.hpb-container .content-container .content {
  margin-bottom: 3em;
}
.hpb-container .content-container .heading {
  display: block;
  padding-bottom: 0;
}
.hpb-container .content-container .heading .kv img {
  max-width: 75%;
}
.hpb-container .content-container .heading .kv,
.hpb-container .content-container .heading .title {
  font-family: Cocogoose,'Gotham Rounded',Gotham,Helvetica,Arial,sans-serif;
  margin-bottom: 50px;
}
.hpb-container .content-container .content {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.hpb-container .carousel .carousel-control {
  width: 10%;
  background-image: none;
  opacity: 1;
}
.hpb-container .carousel .carousel-control .arrow {
  width: 30px;
}
.hpb-container .carousel .carousel-indicators {
  margin-bottom: 2em;
}
.hpb-container .carousel .carousel-indicators li {
  border-color: #707070;
  background-color: #707070;
  margin-left: 2px;
  margin-right: 2px;
}
.hpb-container .carousel .carousel-indicators li.active {
  border-color: #333;
  background-color: #333;
}
.hpb-container .carousel .carousel-inner > .item {
  color: inherit;
}
.hpb-container .carousel .carousel-inner > .item > *,
.hpb-container .carousel .carousel-inner > .item > a > img {
  width: 100%;
}
.hpb-container .carousel .carousel-inner > .item .figure-wrapper,
.hpb-container .carousel .carousel-inner > .item .audio-wrapper,
.hpb-container .carousel .carousel-inner > .item .coloured-box {
  margin-bottom: 0;
}
.hpb-container .carousel .carousel-inner > .next {
  border: 0;
}

.hpb-container .carousel.indicators-outside {
  margin-bottom: 80px;
}
.hpb-container .carousel.indicators-outside .carousel-indicators {
  bottom: auto;
  top: 100%;
  margin-top: 20px;
  margin-bottom: 0;
}
.hpb-container .main-carousel .carousel-control-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-left: 5%;
  padding-right: 5%;
}
.hpb-container .main-carousel .carousel-control-wrapper .carousel-control {
  position: static;
  text-decoration: none;
  text-shadow: none;
  width: auto;
  display: block;
  padding: 10px;
  border-radius: 50%;
  border: 2px solid #aac2c1;
  color: #fff;
}
.hpb-container .main-carousel .carousel-control-wrapper .carousel-control a {
  display: block;
  border-radius: 50%;
  text-decoration: none;
}
.hpb-container .main-carousel .carousel-control-wrapper .carousel-control span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #aac2c1;
  font-size: 1.2em;
  width: 90px;
  height: 90px;
  border-radius: 50%;
}
.hpb-container .btn-coloured {
  display: inline-block;
  border: 0;
  border-radius: 100px;
  color: #fff;
  background: url(../images/btn-coloured.png) center center no-repeat;
  background-size: cover;
  min-width: 7.2em;
  padding: .35em .5em .25em;
  margin: 0 .8em;
  text-decoration: none;
}
.hpb-container .btn-coloured.btn-agitated {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/c26af11d1471441d8c0321c73ad7ab54?v=8ec10b86);
}
.hpb-container .btn-coloured.btn-angry {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/704651da1ae0478599fb35221c5e3013?v=750c21d7);
}
.hpb-container .btn-coloured.btn-calm {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/1a0c76b48b404c62a615229c2042b8c3?v=d775ebe2);
}
.hpb-container .btn-coloured.btn-confident {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/ce17dd4c9a224c34bb93ac8913af58ca?v=75559741);
}
.hpb-container .btn-coloured.btn-dread {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/e7b029bfd78f4c5c9af7eb5bc8a037bc?v=34352ff3);
}
.hpb-container .btn-coloured.btn-excited {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/1d2057bfcade4242a9038cffa8497dbd?v=ba0c259e);
}
.hpb-container .btn-coloured.btn-frustrated {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/09ae295dfd92473fbf882320bf0e3e8b?v=c0c72d5b);
}
.hpb-container .btn-coloured.btn-gloomy {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/840b06e210a8444aa47bce76b1aa2552?v=c26f1502);
}
.hpb-container .btn-coloured.btn-grateful {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/e7ee9b16a8f44a30be0952e9f889540c?v=e354589b);
}
.hpb-container .btn-coloured.btn-happy {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/bbd76cbd1a2c440ba872d51c91bc43c5?v=a914b852);
}
.hpb-container .btn-coloured.btn-hopeful {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/2a13b5f4ec88416e80c3cba731d5fb81?v=f1ea3b04);
}
.hpb-container .btn-coloured.btn-hopeless {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/c50fbc1d1c30466a855d45b305a6e3a5?v=50177213);
}
.hpb-container .btn-coloured.btn-joyful {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/8da6051ebd614df7a2565ed776c0369e?v=74d35a47);
}
.hpb-container .btn-coloured.btn-motivated {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/fc772adff60345bdb5360ad562bad8a3?v=adc5f3e3);
}
.hpb-container .btn-coloured.btn-optimistic {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/099e0670770b4cd5bd9911ac92c627d0?v=03fb60b0);
}
.hpb-container .btn-coloured.btn-sad {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/3988a57d26294384bd862b48af8c77a2?v=742fba26);
}
.hpb-container .btn-coloured.btn-stressed {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/2eb5516099d943fdadcbbc889e9413a4?v=8355f17f);
}
.hpb-container .btn-coloured.btn-worried {
  background-image: url(https://ch-api.healthhub.sg/api/public/content/65d739cff26140fc9fa6904bbe03fdb3?v=1485e340);
}
.hpb-container .btn-coloured.selected {
  background: black;
}
.hpb-container .btn-coloured.with-outline {
  position: relative;
  margin-top: 8px;
  color: #000;
  min-width: 250px;
  padding-top: .5em;
  padding-bottom: .4em;
}
.hpb-container .btn-coloured.with-outline:before {
  content: '';
  display: block;
  position: absolute;
  left: -5px;
  right: -5px;
  top: -5px;
  bottom: -5px;
  border: 3px solid #aac2c1;
  border-radius: 100px;
}

.hpb-container .btn-circle {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 92px;
  height: 92px;
  background: #feaa98 url(https://ch-api.healthhub.sg/api/public/content/5b42978cc5a544079d483c89c4144728?v=97d5e27a) center center no-repeat;
  background-size: cover;
  position: relative;
  overflow: hidden;
  border-radius: 50%;
}
.hpb-container .btn-circle img {
  max-width: 100%;
}
.hpb-container a.selected > .btn-circle {
  background: #999;
}

.hpb-container .selectable-buttons .btn-coloured {
  margin-top: 2.2em;
}

.hpb-container .thinking-pattern {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: url(https://ch-api.healthhub.sg/api/public/content/7d52687f9efa40ad92804a417a8338b6?v=50789599) center center no-repeat;
  background-size: cover;
  border-radius: 100px;
  font-weight: 700;
  line-height: 1.2;
  width: 100%;
  margin: 0;
  color: #000;
  padding: .5em 1.5em;
  text-align: left;
}
.hpb-container .thinking-pattern small {
  display: block;
  font-size: 60%;
  font-weight: 400;
  line-height: 1.5;
}

.hpb-container .shredder-container {
  margin-top: 1em;
  margin-bottom: 1em;
  padding: 1em;
}
.hpb-container .shredder-container .the-shredder {
  max-width: 900px;
  margin: 0 auto;
}
.hpb-container .shredder-container .the-shredder .unshredded {
  z-index: 20;
}
.hpb-container .shredder-container .the-shredder .unshredded,
.hpb-container .shredder-container .the-shredder .shredded {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  padding: 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.hpb-container .shredder-container .the-shredder .shredder {
  height: 190px;
  color: #000;
  background-color: #727272;
  margin-top: -95px;
  margin-bottom: -95px;
  padding: 0 60px;
  position: relative;
  z-index: 10;
  border-radius: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.hpb-container .shredder-container .the-shredder .shredder::before {
  content: '';
  display: block;
  width: 100%;
  height: 18px;
  background-color: #000;
  border-radius: 100px;
}
.hpb-container .shredder-container .the-shredder .unshredded,
.hpb-container .shredder-container .the-shredder .shredded {
  position: relative;
  -webkit-transform-origin: center top;
      -ms-transform-origin: center top;
          transform-origin: center top;
  height: 560px;
}
.hpb-container .shredder-container .the-shredder .unshredded {
  width: 560px;
}
.hpb-container .shredder-container .the-shredder .shredded {
  width: 620px;
}
.hpb-container .shredder-container .the-shredder .unshredded .wrapper,
.hpb-container .shredder-container .the-shredder .shredded .wrapper {
  position: relative;
  overflow: hidden;
}
.hpb-container .shredder-container .the-shredder .shredded .wrapper {
  width: 28px;
}
.hpb-container .shredder-container .button-wrapper {
  text-align:center;
  margin-top: -35%;
  padding-bottom: 27%;
}
.hpb-container .shredder-container .button-wrapper .btn-shred-it {
  background: #faa31b;
  color: #000;
  font-size: 1.8em;
  margin-top: .5em;
}

.hpb-container .paper {
  width: 560px;
  height: 560px;
  margin: 0 auto;
  background: #F1F2F2;
  padding: 50px 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.hpb-container .paper .kv {
  max-width: 80%;
  margin: 0 0 0 auto;
}
.hpb-container .paper .thinking-pattern {
  margin-top: 20px;
  min-height: 82px;
}

.hpb-container #carousel-emotions-explorer .quiz#how-you-feeling-today .btn-coloured {
  font-size: .8em;
}
.hpb-container #carousel-emotions-explorer .quiz#great .heading .title span {
  font-size: 3.573336em;
}
.hpb-container #carousel-emotions-explorer .quiz#notGreat .heading .title span {
  font-size: 2.133336em;
}
.hpb-container #carousel-emotions-explorer .quiz#great .content p>span,
.hpb-container #carousel-emotions-explorer .quiz#notGreat .content p>span {
  font-size: 1.422224em;
}
.hpb-container #carousel-emotions-explorer .quiz#whatsTheCause #the-cause a {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  width: 130px;
  margin: 2em 1.5em 0;
  color: inherit;
  text-decoration: none;
  font-size: 0.933336em;
}
.hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .content-container .content p > span {
  font-size: 1.377777em;
}
.hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .content-container .content {
  max-width: 800px;
}
.hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons > * {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 48%;
          flex: 0 0 48%;
  font-size: 0.933336em;
  margin: 1em 0 0;
  padding: 0;
  cursor: pointer;
}
.hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons > * .thinking-pattern {
  height: 100%;
}
.hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons > *.selected .thinking-pattern {
  color: #fff;
  background: #000;
}
.hpb-container #carousel-emotions-explorer .quiz#goodJob .heading .title span {
  font-size: 2.133333em;
}

@media (max-width: 1280px) {
  .hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons > * {
    font-size: 1.3125vw;
  }
}
@media (max-width: 1024px) {
  .hpb-container {
    margin-top: 5vw;
    margin-bottom: 10vw;
  }
  .hpb-container .content-container p {
    line-height: 1.25;
  }
  .hpb-container .content-container p>span {
    font-size: .888889em;
  }
  .hpb-container .content-container h1>span {
    font-size: 1.666667em;
  }
  .hpb-container .content-container h2>span {
    font-size: 1.25em;
  }
  .hpb-container .content-container .heading {
    margin-bottom: .5em;
  }
  .hpb-container .btn-circle {
    width: 80px;
    height: 80px;
  }
  .hpb-container .main-carousel .carousel-control-wrapper .carousel-control {
    padding: 8px;
  }
  .hpb-container .main-carousel .carousel-control-wrapper .carousel-control span {
    width: 65px;
    height: 65px;
    font-size: .8em;
  }
  .hpb-container .shredder-container .the-shredder .shredder {
    height: 140px;
    margin-top: -70px;
    margin-bottom: -70px;
    padding: 0 40px;
    border-radius: 40px;
  }
  .hpb-container .shredder-container .the-shredder .unshredded,
  .hpb-container .shredder-container .the-shredder .shredded {
    width: 480px;
    height: 480px;
  }
  .hpb-container .shredder-container .the-shredder .shredded {
    width: 525px;
  }
  .hpb-container .shredder-container .the-shredder .shredded .wrapper {
    width: 24px;
  }
  .hpb-container .paper {
    width: 480px;
    height: 480px;
  }
  .hpb-container .paper .kv img {
    width: 230px;
  }
  .hpb-container .paper .thinking-pattern {
    margin-top: 21px;
    min-height: 58px;
    font-size: .75em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#how-you-feeling-today .btn-coloured {
    font-size: 1em;
    min-width: 8em;
    margin: 1.5em .5em 0;
  }
  .hpb-container #carousel-emotions-explorer .quiz#whatsTheCause #the-cause a {
    width: 120px;
    font-size: .888889em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons > * {
    font-size: 2vw;
  }
  .hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .content-container .content {
    max-width: 86vw;
  }
}
@media (max-width: 767px) {
  .hpb-container {
    margin-top: 10vw;
    margin-bottom: 20vw;
  }
  .hpb-container .btn-circle {
    width: 75px;
    height: 75px;
  }
  .hpb-container .btn-coloured.with-outline {
    width: 180px;
  }
  .hpb-container .btn-coloured.with-outline:before {
    left: -4px;
    right: -4px;
    top: -4px;
    bottom: -4px;
    border: 2px solid #aac2c1;
    border-radius: 100px;
  }
  .hpb-container .content-container .heading .title {
    margin-bottom: 30px;
  }
  .hpb-container .content-container h2>span {
    font-size: 1em;
  }
  .hpb-container .main-carousel .carousel-control-wrapper .carousel-control {
    padding: 5px;
  }
  .hpb-container .main-carousel .carousel-control-wrapper .carousel-control span {
    width: 50px;
    height: 50px;
    font-size: .7em;
  }
  .hpb-container .shredder-container .the-shredder .shredder {
    height: 80px;
    margin: -40px -15px;
    padding: 0 4vw;
    border-radius: 7vw;
  }
  .hpb-container .shredder-container .the-shredder .unshredded,
  .hpb-container .shredder-container .the-shredder .shredded {
    width: 76vw;
    height: 76vw;
  }
  .hpb-container .shredder-container .the-shredder .shredded {
    width: calc(76vw + 20px);
  }
  .hpb-container .shredder-container .the-shredder .shredded .wrapper {
    width: 3.9vw;
  }
  .hpb-container .paper {
    width: 76vw;
    height: 76vw;
    padding: 5vw;
  }
  .hpb-container .paper .kv {
    margin-right: auto;
  }
  .hpb-container .paper .kv img {
    width: 30vw;
  }
  .hpb-container .paper .thinking-pattern {
    margin-top: 3vw;
    min-height: 12vw;
    font-size: 3.4vw;
  }
  .hpb-container .shredder-container .button-wrapper {
      margin-top: -50%;
  }
  .hpb-container .shredder-container .button-wrapper .btn-shred-it {
    font-size: 1.5em;
    padding: .5em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#great .heading .title span {
    font-size: 2.6em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#great .content p>span,
  .hpb-container #carousel-emotions-explorer .quiz#notGreat .content p>span {
    font-size: 1.25em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#great .heading .kv img,
  .hpb-container #carousel-emotions-explorer .quiz#notGreat .heading .kv img,
  .hpb-container #carousel-emotions-explorer .quiz#goodJob .heading .kv img {
    max-width: 60%;
  }
  .hpb-container #carousel-emotions-explorer .quiz#whatsTheCause #the-cause a {
    width: 100px;
  }
  .hpb-container #carousel-emotions-explorer .quiz#notGreat .heading .title span,
  .hpb-container #carousel-emotions-explorer .quiz#makingGoodProgress .heading .title span {
    font-size: 1.4em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#how-you-feeling-today .btn-coloured {
    font-size: 3.5vw;
    min-width: 25vw;
    margin: 5vw .8vw 0;
    padding-top: 1.8vw;
    padding-bottom: 1.5vw;
  }
  .hpb-container #carousel-emotions-explorer .quiz#whatsTheCause #the-cause a {
    font-size: .7em;
    margin-left: .1em;
    margin-right: .1em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .hpb-container #carousel-emotions-explorer .quiz#thinkingPattern .selectable-buttons > * {
    -ms-flex-preferred-size: 90%;
        flex-basis: 96%;
    font-size: 4vw;
    min-height: 15vw;
  }
  .hpb-container #carousel-emotions-explorer .quiz#readyToShred .heading {
    padding-left: 0;
    padding-right: 0;
  }
  .hpb-container #carousel-emotions-explorer .quiz#goodJob .heading .title span {
    font-size: 1em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#goodJob .content {
    padding-left: 5vw;
    padding-right: 5vw;
  }
}
@media (max-width: 350px) {
  .hpb-container .btn-circle {
    width: 60px;
    height: 60px;
  }
  .hpb-container .content-container .heading .kv img {
    max-width: 88%;
  }
  .hpb-container .shredder-container .button-wrapper .btn-shred-it {
    font-size: 1.125em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#whatsTheCause #the-cause a {
    width: 88px;
    font-size: .66em;
  }
  .hpb-container #carousel-emotions-explorer .quiz#great .heading .title span {
    font-size: 20vw;
  }
  .hpb-container #carousel-emotions-explorer .quiz#great .content p>span,
  .hpb-container #carousel-emotions-explorer .quiz#notGreat .content p>span {
    font-size: 8vw;
  }
  .hpb-container #carousel-emotions-explorer .quiz#notGreat .heading .title span,
  .hpb-container #carousel-emotions-explorer .quiz#makingGoodProgress .heading .title span {
    font-size: 12vw;
  }
}