.ba-slider {
  position: relative;
  overflow: hidden;
}

.ba-slider img {
  width: 100%;
  display: block;
  max-width: none;
}

.ba-slider .resize {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 50%;
  overflow: hidden;
}

.ba-slider .handle {
  /* Thin line seperator */
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 4px;
  margin-left: -2px;
  background: #ffffff;
  cursor: ew-resize;
}

.ba-slider .handle:after {
  /* Big orange knob  */
  display: none;
  position: absolute;
  top: 50%;
  width: 64px;
  height: 64px;
  margin: -32px 0 0 -32px;
  content: '\21d4';
  color: white;
  font-weight: bold;
  font-size: 36px;
  text-align: center;
  line-height: 64px;
  background: #ffb800;
  /* @orange */
  border: 1px solid #e6a600;
  /* darken(@orange, 5%) */
  border-radius: 50%;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3), inset 0 2px 0 rgba(255, 255, 255, 0.5), inset 0 60px 50px -30px #ffd466;
          box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3), inset 0 2px 0 rgba(255, 255, 255, 0.5), inset 0 60px 50px -30px #ffd466;
  /* lighten(@orange, 20%)*/
}

.ba-slider .handle.ba-draggable:after {
  display: none;
  width: 48px;
  height: 48px;
  margin: -24px 0 0 -24px;
  line-height: 50px;
  font-size: 30px;
}

.handle {
  z-index: 20;
}

.handle__weight {
  position: absolute;
  z-index: 20;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
      -ms-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
  width: 55px;
  height: 55px;
  padding: 5px 0;
  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;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: solid 2px #ffffff;
  border-radius: 50%;
  background-color: #FFC328;
  font-family: "Helvetica Neue", sans-serif;
  font-size: 9px;
  line-height: 1;
  color: #ffffff;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.handle__weight::before, .handle__weight::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 0;
  height: 0;
  border: solid 16px transparent;
}

.handle__weight::before {
  left: -15px;
  border-color: transparent #ffffff transparent transparent;
  border-width: 10px 16px 10px 0;
}

.handle__weight::after {
  right: -15px;
  border-color: transparent transparent transparent #ffffff;
  border-width: 10px 0 10px 16px;
}

.handle__weight-value {
  margin: 3px 0 0;
  font-size: 18px;
  line-height: 1;
  font-weight: 700;
}

.ba-slider .handle:after {
  display: none;
}

@media screen and (min-width: 1170px) {
  .handle__weight {
    width: 80px;
    height: 80px;
    padding: 9px 0;
    border-width: 4px;
    font-size: 12px;
  }
  .handle__weight-value {
    margin: 5px 0 0;
    font-size: 36px;
    line-height: .7;
    font-weight: 700;
  }
}

.stories {
  padding-top: 24px;
  padding-bottom: 60px;
}

.stories__header {
  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-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 16px;
}

.stories__header-heading {
  margin: 0;
}

.stories__header-subheading {
  margin: 0 0 6px;
  color: #ed5749;
  -webkit-box-ordinal-group: 0;
      -ms-flex-order: -1;
          order: -1;
}

.stories__hero {
  margin-bottom: 40px;
}

.stories__hero-video {
  position: relative;
  width: 240px;
  height: 260px;
  margin: 0 auto 16px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='403' height='424' viewBox='0 0 403 424' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='274.489' height='327.372' rx='50' transform='rotate(29.978 76.781 307.246) skewX(-.044)' fill='%23ED5749'/%3e%3crect width='274.533' height='327.319' rx='50' transform='rotate(14.987 -18.72 430.046) skewX(-.025)' fill='%236FA1EC'/%3e%3crect width='274.49' height='327.372' rx='50' transform='rotate(-29.918 256.2 68.452) skewX(.164)' fill='%23FFC328'/%3e%3crect width='274.533' height='327.319' rx='50' transform='rotate(-14.987 356.774 -52.802) skewX(.026)' fill='%23F26A5E'/%3e%3c/svg%3e");
  z-index: 1;
}

.stories__hero-poster {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 165px;
  height: auto;
  -webkit-transform: translateY(-50%) translateX(-50%);
      -ms-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
}

.stories__hero-play {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
      -ms-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
  width: 40px;
  height: 42px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg viewBox='0 0 72 73' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='36' cy='36.848' r='36' fill='%23fff'/%3e%3cpath d='M45.82 34.703c1.643.958 1.643 3.331 0 4.29l-14.189 8.276c-1.655.966-3.734-.228-3.734-2.144V28.57c0-1.917 2.079-3.11 3.734-2.145l14.19 8.277z' fill='%2340414B'/%3e%3c/svg%3e");
}

.stories__hero-content blockquote {
  margin: 0 0 32px;
  padding: 0;
  text-align: center;
  font-weight: 300;
}

.stories__hero-content cite {
  display: block;
  font-style: normal;
  text-align: center;
  font-weight: 300;
}

.stories__list {
  list-style: none;
  padding: 0;
  margin: 0;
  margin-bottom: 40px;
}

.stories__item {
  max-width: 272px;
  margin: 0 auto 16px;
  border-radius: 16px;
  overflow: hidden;
  background-color: #ffffff;
  -webkit-box-shadow: 0 20px 40px rgba(45, 45, 45, 0.05);
          box-shadow: 0 20px 40px rgba(45, 45, 45, 0.05);
  text-align: center;

  display: flex;
  flex-direction: column;
}

.stories__item-slider {
  background-color: #f5f5f5;
}

.stories__item-slider-img {
  width: 100% !important;
  height: auto;
}

.stories__item-content {
  padding: 16px 24px;

  flex-grow: 1;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.stories__item-heading {
  margin: 0 0 4px;
}

.stories__item-age {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 16px;
  color: #9a9a9a;
  font-weight: 500;
}

.stories__item-text {
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 16px;
  color: #323232;
  letter-spacing: 0.033em;
}

@media screen and (min-width: 575px) {
  .stories__item {
    max-width: 432px;
    width: 100%;
  }
  .stories__item-content {
    padding: 16px 32px;
  }
  .stories__item-age, .stories__item-text {
    font-size: 14px;
    line-height: 20px;
  }
  .stories__item-text {
    margin-bottom: 16px;
  }
}

@media screen and (min-width: 768px) {
  .stories__header-heading {
    margin-bottom: 32px;
  }
  .stories__hero {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .stories__hero-video {
    width: 403px;
    height: 424px;
    margin: 0 20px 0 0;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  .stories__hero-poster {
    width: 276px;
  }
  .stories__hero-play {
    width: 56px;
    height: 58px;
  }
  .stories__hero-content blockquote,
  .stories__hero-content cite {
    text-align: left;
  }
  .stories__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    max-width: 880px;
    margin: 0 auto 48px;
  }
}

@media screen and (min-width: 992px) {
  .stories {
    padding-top: 100px;
  }
  .stories__hero {
    margin-bottom: 120px;
  }
  .stories__hero-video {
    margin-right: 60px;
  }
  .stories__hero-content {
    font-size: 16px;
    line-height: 24px;
  }
  .stories__item {
    margin: 0 0 16px;
  }
}

@media screen and (min-width: 1170px) {
  .stories__header {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .stories__header-heading {
    margin: 0 0 56px;
  }
}

@media screen and (min-width: 1440px) {
  .stories__list {
    max-width: none;
  }
}

.story {
  padding-top: 24px;
}

.story__header {
  margin-bottom: 40px;
}

.story__header-wrapper {
  margin-bottom: 24px;
  text-align: center;
}

.story__header-heading {
  margin: 0 0 4px;
}

.story__header-info {
  display: block;
  font-size: 12px;
  line-height: 16px;
  color: #9a9a9a;
  font-weight: 500;
}

.story__header-btn {
  max-width: 272px;
  margin: 0 auto;
}

.story__header-result-slider {
  height: 54.5vw;
  max-height: 335px;
  margin-bottom: 8px;
}

.story__header-result-slider .ba-img.active {
  z-index: 11;
}

.story__header-result-slider .ba-img {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 50%;
  height: 100%;
}

.story__header-result-slider .ba-img.resize_right {
  right: 0;
}

.story__header-result-info {
  display: block;
  font-size: 12px;
  line-height: 16px;
  color: #9a9a9a;
  font-weight: 500;
}

.story__header-result-info-item {
  position: relative;
  padding: 8px 16px 8px 48px;
  border-radius: 8px;
}

.story__header-result-info-item--program {
  margin-bottom: 24px;
  background-color: #EEF4FD;
  background-repeat: no-repeat;
  background-position: 12px 50%;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.4 23.396l-1.117-.506c-.893-.406-1.785-.812-2.68-1.217-1.075-.49-2.153-.977-3.227-1.467-.935-.425-1.867-.85-2.802-1.271-.452-.204-.9-.427-1.357-.618l-.019-.008c.132.234.262.47.394.705v-1.268-3.043-3.666-3.171c0-.517.013-1.034 0-1.549v-.022L.4 7c.372.17.744.338 1.117.507l2.68 1.216c1.075.49 2.152.977 3.227 1.467.934.425 1.867.85 2.801 1.271.452.204.9.428 1.357.618l.019.008c-.132-.234-.261-.47-.393-.705V22.53c0 .517-.011 1.034 0 1.549v.022c0 .427.364.835.792.816a.818.818 0 00.792-.816v-1.269-3.042-3.667-3.17c0-.517.01-1.035 0-1.549v-.022c0-.261-.145-.593-.393-.705l-1.117-.506-2.68-1.216c-1.075-.49-2.153-.978-3.227-1.467-.935-.425-1.867-.85-2.802-1.272-.452-.206-.906-.41-1.357-.617l-.019-.008c-.266-.123-.533-.161-.8 0a.828.828 0 00-.393.704v11.148c0 .518-.01 1.035 0 1.55v.02c0 .262.145.594.393.706l1.117.506 2.68 1.217c1.075.49 2.152.977 3.227 1.467.935.424 1.867.849 2.802 1.27.451.208.905.412 1.357.619l.018.008c.201.092.389.144.61.081a.803.803 0 00.473-.375c.098-.19.145-.42.08-.629-.056-.188-.178-.406-.363-.487z' fill='%236FA1EC'/%3e%3cpath d='M22.801 18.306a2392.487 2392.487 0 01-3.797 1.723c-1.075.49-2.152.977-3.227 1.467-.934.425-1.866.85-2.801 1.271-.452.204-.911.4-1.358.618l-.018.008 1.19.705V22.83v-3.043-3.666-3.17c0-.518.014-1.035 0-1.55v-.021c-.131.234-.26.47-.393.705l1.117-.507 2.68-1.216c1.075-.49 2.153-.977 3.227-1.467.935-.425 1.867-.85 2.802-1.271.451-.204.91-.4 1.357-.618l.019-.008-1.191-.705V17.44c0 .518-.01 1.035 0 1.55v.021c0 .428.364.836.792.817a.818.818 0 00.792-.817v-1.268V14.7v-3.666-3.17c0-.518.01-1.035 0-1.55v-.021c0-.289-.15-.56-.393-.705-.267-.16-.534-.122-.8 0a12144.749 12144.749 0 01-3.797 1.723c-1.075.49-2.153.977-3.227 1.467-.935.424-1.867.849-2.802 1.27-.451.205-.914.396-1.357.619l-.019.008c-.248.111-.393.443-.393.705v11.147c0 .518-.01 1.035 0 1.55v.021c0 .289.15.56.393.705.267.16.534.122.8 0l1.117-.506 2.68-1.217c1.075-.49 2.153-.977 3.227-1.467.935-.424 1.867-.849 2.802-1.27.451-.205.914-.395 1.357-.619l.019-.008c.169-.076.317-.313.364-.487a.854.854 0 00-.08-.629c-.107-.174-.271-.326-.472-.375-.222-.052-.404-.011-.61.081z' fill='%236FA1EC'/%3e%3cpath d='M22.803 5.59c-.372.17-.745.338-1.117.507l-2.68 1.217c-1.075.49-2.152.977-3.227 1.467-.934.424-1.867.849-2.801 1.27-.452.205-.911.4-1.358.619l-.018.008h.8l-1.117-.507-2.68-1.216c-1.075-.49-2.152-.977-3.227-1.467-.935-.425-1.867-.85-2.802-1.271-.451-.204-.9-.425-1.357-.618a.127.127 0 01-.018-.008l-.19 1.491 1.117-.454c.89-.362 1.782-.724 2.672-1.089l3.232-1.314c.935-.381 1.87-.762 2.804-1.14.452-.183.914-.352 1.357-.553l.019-.008h-.423l1.117.454c.89.362 1.783.724 2.673 1.089L18.81 5.38c.934.381 1.87.762 2.804 1.14.451.183.9.387 1.357.553l.019.008c.18.074.451.014.61-.081a.829.829 0 00.364-.487c.045-.21.037-.444-.08-.63a.917.917 0 00-.472-.375l-1.117-.454c-.895-.365-1.79-.73-2.683-1.092-1.08-.44-2.162-.879-3.242-1.32-.932-.378-1.864-.759-2.797-1.137-.446-.183-.89-.384-1.344-.547-.24-.087-.404-.02-.607.062-.232.095-.465.19-.697.283l-2.53 1.029L5.17 3.648c-.971.394-1.94.789-2.912 1.186l-1.59.648-.074.03c-.3.122-.522.33-.567.678-.037.29.092.683.377.813l1.123.51 2.693 1.224c1.08.49 2.16.98 3.24 1.473.93.421 1.859.843 2.79 1.268.447.201.893.408 1.34.607.171.076.325.13.52.103a1.17 1.17 0 00.312-.103l.145-.065c.232-.107.462-.21.694-.316.842-.384 1.688-.765 2.53-1.149 1.075-.487 2.15-.977 3.224-1.464.974-.444 1.949-.885 2.923-1.328.533-.242 1.064-.485 1.598-.724l.073-.033c.17-.076.317-.313.365-.487a.854.854 0 00-.08-.629c-.108-.174-.271-.326-.472-.375-.23-.06-.412-.02-.618.076z' fill='%236FA1EC'/%3e%3cpath d='M17.078 8.691V12.237c0 .428.364.836.792.817a.818.818 0 00.793-.817V9.13v-.438c0-.427-.365-.835-.793-.816a.818.818 0 00-.792.816z' fill='%236FA1EC'/%3e%3cpath d='M6.456 4.728l1.114.474 2.675 1.135 3.238 1.371c.932.395 1.864.792 2.799 1.187.451.19.9.403 1.36.577l.018.008c.177.076.454.014.61-.081a.829.829 0 00.364-.488c.045-.21.037-.443-.079-.628-.119-.19-.272-.289-.473-.376l-1.114-.473-2.675-1.135-3.237-1.372c-.932-.395-1.864-.792-2.799-1.187-.452-.19-.9-.403-1.36-.577l-.018-.008c-.177-.076-.455-.013-.61.082a.828.828 0 00-.365.487c-.045.21-.037.444.08.629.118.19.271.288.472.375z' fill='%236FA1EC'/%3e%3c/svg%3e ");
}

.story__header-result-info-item--program .story__header-result-info-title,
.story__header-result-info-item--program .story__header-result-info-text {
  color: #6fa1ec;
}

.story__header-result-info-item--period {
  margin-bottom: 8px;
  background-color: #f5f5f5;
  background-repeat: no-repeat;
  background-position: 12px 50%;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.986.918C18.617.918 24 6.3 24 12.903c0 6.633-5.382 12.015-12.014 12.015C5.381 24.918 0 19.536 0 12.903 0 6.3 5.382.918 11.986.918zm0 1.95c5.556 0 10.065 4.48 10.065 10.035 0 5.557-4.51 10.066-10.065 10.066-5.557 0-10.037-4.51-10.037-10.066A10.02 10.02 0 0111.986 2.867zm3.287 11.17l-2.59-1.338V7.9c0-.902-1.338-.902-1.338 0v5.207a.64.64 0 00.35.582l2.938 1.542c.785.436 1.425-.786.64-1.193zm5.41-.436h-.407c-.901 0-.901-1.368 0-1.368h.408c-.35-4.276-3.753-7.68-8-8v.408c0 .901-1.368.901-1.368 0v-.408a8.675 8.675 0 00-8 8h.408c.901 0 .901 1.338 0 1.338h-.408c.32 4.277 3.724 7.68 8 8.03v-.408c0-.901 1.338-.901 1.338 0v.408c4.277-.35 7.68-3.753 8.03-8z' fill='%2368CF6D'/%3e%3c/svg%3e");
}

.story__header-result-info-item--period .story__header-result-info-title {
  color: #9a9a9a;
}

.story__header-result-info-title {
  margin: 0 0 4px;
  font-size: 12px;
  line-height: 16px;
  color: #323232;
  font-weight: 500;
}

.story__header-result-info-text {
  margin: 0;
  font-size: 14px;
  line-height: 20px;
  color: #323232;
}

.story__header-result-info-link {
  position: absolute;
  top: 50%;
  right: 12px;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: solid 1px #6fa1ec;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-color: #6fa1ec;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='7' height='10' viewBox='0 0 7 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M1.875 8.668l3.75-3.75-3.75-3.75' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
}

.story__header-result-info-link:hover {
  background-color: #86b0ef;
}

.story__header-result-info-link:focus {
  outline: none;
  border: solid 1px #86b0ef;
  background-color: #86b0ef;
  -webkit-box-shadow: inset 0 0 0 1px #ffffff;
          box-shadow: inset 0 0 0 1px #ffffff;
}

@media screen and (min-width: 575px) {
  .story__header-result-slider {
    height: 58.5vw;
  }
  .story__header-result-info-item {
    padding: 8px 16px 8px 64px;
  }
  .story__header-result-info-item--period {
    background-position: 24px 50%;
  }
  .story__header-result-info-item--period .story__header-result-info-title {
    color: #9a9a9a;
  }
  .story__header-result-info-item--program {
    background-position: 24px 50%;
  }
  .story__header-result-info-item--program .story__header-result-info-title,
  .story__header-result-info-item--program .story__header-result-info-text {
    color: #6fa1ec;
  }
}

@media screen and (min-width: 768px) {
  .story__inner {
    max-width: 800px;
    margin: 0 auto;
  }
  .story__header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .story__header-wrapper {
    margin: 0;
    text-align: left;
  }
  .story__header-info {
    font-size: 14px;
    line-height: 20px;
  }
  .story__header-btn {
    margin: 0;
    max-width: 206px;
  }
  .story__header-result {
    width: 100%;
    margin-top: 24px;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .story__header-result-slider {
    max-height: 487px;
    margin-bottom: 16px;
    border-radius: 24px;
  }
  .story__header-result-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .story__header-result-info-item {
    width: calc(50% - 8px);
    margin: 0;
  }
}