/*!***************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/moo-timeline-horizontal/style.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************/
/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */
.wp-block-create-block-moo-timeline-horizontal {
  position: relative;
}
.wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper {
  display: flex;
  overflow-x: auto;
  height: 100%;
  -moz-column-gap: var(--horizontal-gap, 20px);
       column-gap: var(--horizontal-gap, 20px);
  -webkit-overflow-scrolling: touch;
  display: flex;
  overflow-x: scroll;
  counter-reset: item;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  -ms-overflow-style: none;
  scrollbar-width: none;
  touch-action: pan-x;
  position: relative;
}
@media (max-width: 781px) {
  .wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper {
    flex-direction: column;
    overflow-x: visible;
    overflow-y: visible;
    scroll-snap-type: none;
    touch-action: none;
    scrollbar-width: auto;
    counter-reset: none;
  }
}
.wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper .wp-block-create-block-moo-timeline-horizontal-item {
  flex: 0 0 calc((100% - (var(--items-to-show, 2) - 1) * var(--horizontal-gap, 20px)) / var(--items-to-show, 2));
  max-width: calc((100% - (var(--items-to-show, 2) - 1) * var(--horizontal-gap, 20px)) / var(--items-to-show, 2));
  color: inherit;
  font: inherit;
  scroll-snap-align: start;
  cursor: pointer;
}
@media (max-width: 781px) {
  .wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper .wp-block-create-block-moo-timeline-horizontal-item {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
.wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper .wp-block-create-block-moo-timeline-horizontal-item .wp-block-group * {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
}
.wp-block-create-block-moo-timeline-horizontal .timeline-prev,
.wp-block-create-block-moo-timeline-horizontal .timeline-next {
  height: 50px;
  position: absolute;
  top: calc(50% - 29px);
  border: 0;
  padding: 10px 0;
  background: transparent;
  outline: none;
  display: block;
  cursor: pointer;
  z-index: 1;
}
@media (max-width: 781px) {
  .wp-block-create-block-moo-timeline-horizontal .timeline-prev,
  .wp-block-create-block-moo-timeline-horizontal .timeline-next {
    display: none;
  }
}
.wp-block-create-block-moo-timeline-horizontal .timeline-prev svg,
.wp-block-create-block-moo-timeline-horizontal .timeline-next svg {
  color: var(--timeline-active-color, #000);
}
.wp-block-create-block-moo-timeline-horizontal .timeline-prev {
  transform: scaleX(-1);
  left: -5px;
}
.wp-block-create-block-moo-timeline-horizontal .timeline-next {
  right: -5px;
}
.wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper:not(.can-swipe-forward) ~ .timeline-next, .wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper.is-at-end ~ .timeline-next {
  display: none;
}
.wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper:not(.can-swipe-backward) ~ .timeline-prev, .wp-block-create-block-moo-timeline-horizontal .moo-timeline-wrapper.is-at-start ~ .timeline-prev {
  display: none;
}

/*# sourceMappingURL=style-index.css.map*/