/* --------------------------- Horizontal Wrapper --------------------------- */
.twae-horizontal-timeline {
  --tw-ibx-position: 50;

  --tw-cbx-text-align: center;

  --tw-cbx-bd-top-width: 3px;
  --tw-cbx-bd-right-width: 0px;
  --tw-cbx-bd-bottom-width: 0px;
  --tw-cbx-bd-left-width: 0px;

  --tw-cbx-img-order: 0;

  --nav-icon-height: 24px;
  --nav-icon-width: 24px;
  --nav-icon-color: var(--tw-line-bg, #222);
  --nav-icon-radius: 0;

  overflow: visible;
}
.twae-horizontal-timeline.twae-wrapper.style-2 {
  --tw-cbx-img-order: 2;

  --tw-ibx-radius: 0;
  --tw-ibx-bd-width: calc(var(--tw-line-bd-width, var(--tw-line-width)) * 1px);

  --tw-cbx-radius: 0px 0px 0px 0px;
  --tw-cbx-padding: 0px;
  --tw-cbx-bd-top-width: 0px;

  --tw-cbx-title-color: #fff;
  --tw-cbx-title-bg: var(--tw-ibx-bg);
  --tw-cbx-title-padding: 8px 12px 8px 12px;
  --tw-cbx-title-margin: 0px 0px 0px 0px;

  --tw-cbx-des-padding: 0px 10px 0px 10px;
}
.twae-horizontal-timeline.twae-wrapper.style-3 {
  --tw-cbx-radius: 0px 0px 0px 0px;
  --tw-cbx-padding: 0px;
  --tw-cbx-bd-top-width: 0px;
  --tw-cbx-bg: #fff;
  --tw-cbx-shadow: 0px;
}
.twae-horizontal-timeline.twae-wrapper.style-4 {
  --tw-cbx-radius: 0px 0px 0px 0px;
  --tw-cbx-bd-top-width: 0px;
  --tw-cbx-bg: #fff;
  --tw-cbx-shadow: 0px;
}
.twae-horizontal-timeline.twae-wrapper.style-4 .twae-content {
  background: transparent !IMPORTANT;
}
.twae-horizontal-timeline.twae-wrapper {
  width: calc(100% - var(--nav-icon-width) * 2);
  margin: 0 var(--nav-icon-width);
}
.twae-wrapper-inside {
  overflow: hidden;
}
/* ------------------------ Horizontal Wrapper - END ------------------------ */


/* --------------------------------- Slider --------------------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-slider-container {
  width: calc(100% - var(--tw-cbx-space));
  margin: 0 calc(var(--tw-cbx-space) * 0.5px);
  display: block;
  position: relative;
}

.twae-horizontal-timeline.twae-wrapper .twae-slider-container.swiper-container,
.twae-horizontal-timeline.twae-wrapper .twae-slider-container.swiper-container .swiper-wrapper{
  overflow: visible;
}
/* ------------------------------ Slider - END ------------------------------ */


/* --------------------------- Next / Prev Buttons -------------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-button-prev,
.twae-horizontal-timeline.twae-wrapper .twae-button-next {
  position: absolute;
  top: calc(0px + var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px + var(--tw-ibx-size) - var(--nav-icon-height) * 0.5);
  background: var(--nav-icon-background);
  color: var(--nav-icon-color);
  width: var(--nav-icon-width);
  height: var(--nav-icon-height);
  font-size: calc(var(--nav-icon-height) - 4px);
  line-height: 1em;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9;
  cursor: pointer;
}
.twae-horizontal-timeline.twae-wrapper .twae-button-next {
  right: calc(0px - var(--nav-icon-width));
}
.twae-horizontal-timeline.twae-wrapper .twae-button-prev {
  left: calc(0px - var(--nav-icon-width));
}
.twae-horizontal-timeline.twae-wrapper .twae-button-prev i,
.twae-horizontal-timeline.twae-wrapper .twae-button-next i{
  /*-webkit-text-stroke: 0.5px var(--nav-icon-color);
  color: transparent;*/
}
.twae-horizontal-timeline.twae-wrapper .twae-button-next.swiper-button-disabled,
.twae-horizontal-timeline.twae-wrapper .twae-button-prev.swiper-button-disabled{
  opacity: 0.5;
  cursor: not-allowed !important;
}
/* ------------------------ Next / Prev Buttons - END ----------------------- */


/* ---------------------------- Horizontal Line ---------------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-story-line {
  position: absolute;
  top: calc(0px - var(--tw-ibx-size) - var(--tw-line-width) / 2);
  left: calc(0px - var(--tw-cbx-space) * 0.5px);
  display: block;
  width: calc(100% + var(--tw-cbx-space) * 1px);
  height: var(--tw-line-width);
  background-color: var(--tw-line-bg);
  border-width: calc(var(--tw-line-bd-width) * 1px) 0px calc(var(--tw-line-bd-width) * 1px) 0px;
  border-style: var(--tw-line-bd-style);
  border-color: var(--tw-line-bd-color);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-story-line,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-story-line {
  top: auto;
  bottom: calc(0px - var(--tw-ibx-size) - var(--tw-line-width) / 2);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1):before,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1):after {
  content: '';
  position: absolute;
  width: var(--tw-line-width);
  height: calc(100% - (var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px - var(--tw-line-width)));
  bottom: calc(0px - var(--tw-ibx-size) - var(--tw-line-width) / 2);
  background-color: var(--tw-line-bg);
  border-width: 0px calc(var(--tw-line-bd-width) * 1px) 0px calc(var(--tw-line-bd-width) * 1px);
  border-style: var(--tw-line-bd-style);
  border-color: var(--tw-line-bd-color);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1):before {
  left: calc(0px - var(--tw-cbx-space) * 0.5px - var(--tw-line-width) / 2);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1):after {
  right: calc(0px - var(--tw-cbx-space) * 0.5px - var(--tw-line-width) / 2);
}
/* -------------------------- Horizontal Line - END ------------------------ */


/* -------------------------------- Line Fill ------------------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-h-line {
  position: absolute;
  top: calc(0px + var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px + var(--tw-ibx-size) - var(--tw-line-width) * 0.5);
  left: 0;
  display: block;
  width: 100%;
  height: var(--tw-line-width);
  background-color: var(--tw-line-bg);
  border-width: calc(var(--tw-line-bd-width) * 1px) 0px calc(var(--tw-line-bd-width) * 1px) 0px;
  border-style: var(--tw-line-bd-style);
  border-color: var(--tw-line-bd-color);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-story-line {
  top: auto;
  bottom: calc(0px + var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px + var(--tw-ibx-size) - var(--tw-line-width) * 0.5);
}
.twae-line-fill.swiper-pagination-progressbar {
  position: absolute;
  top: calc(0px + var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px + var(--tw-ibx-size) - var(--tw-line-width) * 0.5);
  left: 0;
  width: 100%;
  height: var(--tw-line-width);
  background: transparent;
}
.twae-line-fill.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--tw-line-filling-color);
}
.twae-line-filler .twae-story-line {
  display: none;
}
/* ----------------------------- Line Fill - END ---------------------------- */


/* ------------------------ Line Year Box Horizontal ------------------------ */
.twae-horizontal-timeline.twae-wrapper .twae-year {
  position: absolute;
  top: calc(var(--tw-ibx-size) / 2 - var(--tw-ibx-size) * 2 - (var(--tw-ybx-size) * ((60 + var(--tw-ibx-radius) / 1.25) / 100) - var(--tw-ibx-size)) / 2);
  /* left: calc(0px - var(--tw-cbx-space) * 0.5px - var(--tw-ybx-size) / 2); */
  left: 0px;
  margin: 0;
  justify-content: flex-start;
  width: auto;
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-year,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-year {
  top: auto;
  bottom: calc(var(--tw-ibx-size) / 2 - var(--tw-ibx-size) * 2 - (var(--tw-ybx-size) * ((60 + var(--tw-ibx-radius) / 1.25) / 100) - var(--tw-ibx-size)) / 2);
}
.twae-horizontal-timeline.twae-wrapper .twae-year-text:before,
.twae-horizontal-timeline.twae-wrapper .twae-year-text:after {
    width: calc(var(--tw-ybx-bd-width) + var(--tw-line-width) * 0.1);
    height: calc(var(--tw-line-width) - var(--tw-line-bd-width) * 2px);
    top: calc(50% - (var(--tw-line-width) - var(--tw-line-bd-width) * 2px) / 2);
}
.twae-horizontal-timeline.twae-wrapper .twae-year-text:before {
    left: 0;
}
.twae-horizontal-timeline.twae-wrapper .twae-year-text:after {
    right: 0;
}
/* --------------------- Line Year Box Horizontal - END --------------------- */


/* ---------------------------- Labels Horizontal --------------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-labels {
  justify-content: var(--tw-lbl-justify);
  top: calc(0px - (var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap)) - var(--tw-ibx-size) * 2);
  height: calc(var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap));
  text-align: center;
  width: auto;
  left: calc(var(--tw-ibx-position) * 1% - var(--tw-ibx-size) * var(--tw-ibx-position) / 100 + var(--tw-ibx-size) / 2);
  transform: translateX(-50%);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-labels,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-labels {
  top: auto;
  bottom: calc(0px - (var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap)) - var(--tw-ibx-size) * 2);
}
/* ------------------------- Labels Horizontal - END ------------------------ */


/* ------------------------ Icon / Dot Box Horizontal ----------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-icon {
  left: calc(var(--tw-ibx-position) * 1% - var(--tw-ibx-size) * var(--tw-ibx-position) / 100);
  top: calc(var(--tw-ibx-size) / 2 - var(--tw-ibx-size) * 2);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-icon,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-icon {
  top: auto;
  bottom: calc(var(--tw-ibx-size) / 2 - var(--tw-ibx-size) * 2);
}
.twae-horizontal-timeline.twae-wrapper .twae-icondot { 
  top: calc(var(--tw-ibx-size) * 0.75 - var(--tw-ibx-size) * 2);
  left: calc(var(--tw-ibx-position) * 1% - var(--tw-ibx-size) * var(--tw-ibx-position) / 100 + var(--tw-ibx-size) / 4);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-icondot,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-icondot {
  top: auto;
  bottom: calc(var(--tw-ibx-size) * 0.75 - var(--tw-ibx-size) * 2);
}
.twae-horizontal-timeline.twae-wrapper .twae-icondot:before,
.twae-horizontal-timeline.twae-wrapper .twae-icondot:after,
.twae-horizontal-timeline.twae-wrapper .twae-icon:before,
.twae-horizontal-timeline.twae-wrapper .twae-icon:after {
    width: calc(var(--tw-ibx-bd-width) + var(--tw-line-width) * 0.1);
    height: calc(var(--tw-line-width) - var(--tw-line-bd-width) * 2px);
    top: calc(50% - (var(--tw-line-width) - var(--tw-line-bd-width) * 2px) / 2);
}
.twae-horizontal-timeline.twae-wrapper .twae-icondot:before,
.twae-horizontal-timeline.twae-wrapper .twae-icon:before {
    left: calc(0px - var(--tw-ibx-bd-width));
}
.twae-horizontal-timeline.twae-wrapper .twae-icondot:after,
.twae-horizontal-timeline.twae-wrapper .twae-icon:after {
    right: calc(0px - var(--tw-ibx-bd-width));
}
/* --------------------- Icon / Dot Box Horizontal - END -------------------- */


/* ----------------------- Story Box Arrow Horizontal ----------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-arrow {
  background: linear-gradient(to bottom right, var(--tw-cbx-title-bg, var(--tw-arw-bg)) 52%, transparent 48%);
  top: calc(var(--tw-ibx-size) / 7 - var(--tw-ibx-size) / 3.5 + var(--tw-cbx-bd-top-width) / 3);
  left: calc(var(--tw-ibx-position) * 1% - var(--tw-ibx-size) * var(--tw-ibx-position) / 100 + var(--tw-ibx-size) / 2 - var(--tw-ibx-size) / 7);
  border-width: var(--tw-cbx-bd-top-width) 0 0 var(--tw-cbx-bd-top-width);
}
.twae-horizontal-timeline.twae-wrapper .twae-story.twae-bg-hover:hover .twae-arrow,
.twae-horizontal-timeline.twae-wrapper.twae-bg-gradient .twae-story.twae-bg-hover:hover .twae-arrow,
.twae-horizontal-timeline.twae-wrapper.twae-bg-multicolor .twae-story.twae-bg-hover:hover .twae-arrow {
  background: linear-gradient(to bottom right, var(--tw-cbx-title-bg, var(--tw-cbx-bg-hover)) 52%, transparent 48%);
}
.twae-horizontal-timeline.twae-wrapper.twae-bg-multicolor .twae-story:nth-child(4n - 2) .twae-arrow {
  background: linear-gradient(to bottom right, var(--tw-arw-bg2, var(--tw-arw-bg)) 52%, transparent 48%);
}
.twae-horizontal-timeline.twae-wrapper.twae-bg-multicolor .twae-story:nth-child(4n - 1) .twae-arrow {
  background: linear-gradient(to bottom right, var(--tw-arw-bg3, var(--tw-arw-bg)) 52%, transparent 48%);
}
.twae-horizontal-timeline.twae-wrapper.twae-bg-multicolor .twae-story:nth-child(4n) .twae-arrow {
  background: linear-gradient(to bottom right, var(--tw-arw-bg4, var(--tw-arw-bg)) 52%, transparent 48%);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-arrow,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-arrow {
  background: linear-gradient(to top left, var(--tw-arw-bg) 52%, transparent 48%);
  top: auto;
  bottom: calc(var(--tw-ibx-size) / 7 - var(--tw-ibx-size) / 3.5 + var(--tw-cbx-bd-top-width) / 3);
  border-width: 0px var(--tw-cbx-bd-bottom-width) var(--tw-cbx-bd-bottom-width) 0px;
}
.twae-horizontal-timeline.twae-wrapper .twae-arrow-line {
  top: calc(0px - var(--tw-ibx-size) * 0.5);
  left: calc(var(--tw-ibx-position) * 1% - var(--tw-ibx-size) * var(--tw-ibx-position) / 100 + var(--tw-ibx-size) / 2 - var(--tw-line-width) / 2);
  height: calc(var(--tw-ibx-size) * 0.5);
  width: var(--tw-line-width);
  border-width: 0px calc(var(--tw-line-bd-width) * 1px) 0px calc(var(--tw-line-bd-width) * 1px);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-arrow-line,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) .twae-arrow-line {
  top: auto;
  bottom: calc(0px - var(--tw-ibx-size) * 0.5);
}
.twae-horizontal-timeline.twae-wrapper .twae-story-no-icon .twae-arrow-line {
  height: calc(var(--tw-ibx-size) * 0.75);
  top: calc(0px - var(--tw-ibx-size) * 0.75);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-story-no-icon .twae-arrow-line,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1).twae-story-no-icon .twae-arrow-line {
  top: auto;
  bottom: calc(0px - var(--tw-ibx-size) * 0.75);
}
.twae-horizontal-timeline.twae-wrapper .twae-story-no-dot .twae-arrow-line {
  height: calc(var(--tw-ibx-size) - var(--tw-line-width) * 0.5);
  top: calc(0px - var(--tw-ibx-size) + var(--tw-line-width) * 0.5);
}
.twae-horizontal-timeline.twae-wrapper .twae-arrow-line:before,
.twae-horizontal-timeline.twae-wrapper .twae-arrow-line:after {
    width: var(--tw-line-width);
    left: calc(0px - calc(var(--tw-line-bd-width) * 1px));
    border-width: 0px calc(var(--tw-line-bd-width) * 1px) 0px calc(var(--tw-line-bd-width) * 1px);
}
.twae-horizontal-timeline.twae-wrapper .twae-arrow-line:before {
    height: calc(var(--tw-ibx-bd-width));
    top: calc(0px - var(--tw-ibx-bd-width));
}
.twae-horizontal-timeline.twae-wrapper .twae-arrow-line:after {
    height: calc(var(--tw-cbx-bd-top-width));
    bottom: calc(0px - var(--tw-cbx-bd-top-width));
}
/* -------------------- Story Box Arrow Horizontal - END -------------------- */


/* -------------------------- Story Box Horizontal -------------------------- */
.twae-horizontal-timeline.twae-wrapper .twae-story {
  margin-bottom: 0;
}

.twae-horizontal-timeline.twae-wrapper .twae-slider-wrapper{
  margin-top: calc(var(--tw-ibx-size) * 2 + var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px);
  margin-bottom: var(--tw-cbx-bottom-margin);
}

.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-story,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) {
  margin-top: 0px;
  margin-bottom: calc(var(--tw-ibx-size) * 2 + var(--tw-lbl-big-size) + var(--tw-lbl-small-size) + var(--tw-lbl-gap) + 20px);
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom .twae-story {
  align-self: flex-end;
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both .twae-story:nth-child(2n + 1) {
  align-self: flex-start;
}
.twae-horizontal-timeline.twae-wrapper .auto-height .twae-story {
  /* align-self: flex-start !Important; */
  height: auto !Important;
}
.twae-horizontal-timeline.twae-wrapper .twae-story.swiper-slide {
  overflow: visible;
}
/* ----------------------- Story Box Horizontal - END ----------------------- */


/* ------------------------ Story Content Horizontal ------------------------ */
.twae-horizontal-timeline.twae-wrapper .twae-content {
  height: 100%;
}
.twae-horizontal-timeline.twae-wrapper.twae-bg-gradient .twae-story .twae-content {
  background-image: linear-gradient(to bottom, var(--tw-cbx-bg) , var(--tw-cbx-bg-gradient));
}
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-bottom.twae-bg-gradient .twae-story .twae-content,
.twae-horizontal-timeline.twae-wrapper.twae-horizontal-both.twae-bg-gradient .twae-story:nth-child(2n + 1) .twae-content {
  background-image: linear-gradient(to top, var(--tw-cbx-bg) , var(--tw-cbx-bg-gradient));
}
/* --------------------- Story Content Horizontal - END --------------------- */