.nw-sectioncarousel {
  justify-content: center;
  margin: 0;
  width: 100%;
}
  
.nw-sectioncarousel-container {
  padding: 0;
  @media screen and (max-width:$screen-max-xs) {
    width: 100%;
  }
}
  
.nw-sectioncarouselenclose {
  flex-wrap: nowrap;
  display: flex;
  overflow: hidden;
  width: 100%;
 
  @media screen and (min-width: $screen-min-sm) {
    &.is-noscroll {
      justify-content: center;
    }
  }
  
  @media screen and (max-width:$screen-max-xs) {
    &.is-multiple {
      flex-wrap: wrap;
      overflow: auto; 
    }

    &.is-cut {
      overflow-x: auto; 
    }
  }
}
  
.nw-sectioncarouselitem {
  @media screen and (min-width: $screen-min-sm) {
    &.is-multiple {
      padding: 0 8px;
    }

    &.is-cut {
      padding: 0 8px;
    }
  }
  
  @media screen and (max-width:$screen-max-xs) {
    &.is-multiple {
      flex: auto;
      width: 100%;
      padding: 12px 0;
    }

    &.is-single {
      flex: 0 0 auto;
      width: 100%;
    }

    &.is-cut {
      flex: 0 0 auto;
      width: 75%;
      padding: 0  10px;
    }
  }
}

.nw-sectioncarousel-button-container {
  z-index: 1;
  justify-content: center;
  align-items: center;
  display: flex;
  max-width: 50px;
  padding: 0;

  &.is-single {
    position: absolute;
    height: 100%;

    &.is-left {
      left: 0;
    }

    &.is-right {
      right: 0;
    }
  }

  @media screen and (max-width:$screen-max-xs) {
    &.is-multiple {
      display: none;
    }
    
    &.is-cut {
      display: none;
    }
  }
}

.nw-sectioncarousel-button {
  border: 0;
  font-size: $banner-carousel-arrow-font-size;

  &:disabled {
    border: 0 !important;
  }
}

.nw-storycarousel-dotswrapper {
  @extend %nwc-centeralign-items;
  margin-top: 15px;
}

.nw-storycarousel-dots {
  margin: 0 5px;
  border: 0;
  border-radius: 100%;
  width: 8px;
  height: 8px;
  background: $banner-carousel-dots-color;

  &.is-active {
    background: $banner-carousel-dotsactive-color;
  }
}