:root {
  --sliderblocks-min-step-width: 160px;
}

.sliderblocks {
    position: relative;
    padding-bottom: 5px;
    user-select: none;
    /*z-index: 2;*/
}

.sliderblocks_inner {
    background-size: cover;
    overflow: hidden;
}

.sliderblocks_nav {
    position: absolute;
    top: 50%;
    left: -40px;
    display: none;
    width: calc(100% + 80px);
    transform: translateY(-50%);
    /*z-index: 2;*/
    pointer-events: none;
}

.sliderblocks__with-nav .sliderblocks_nav {
    display: flex;
    justify-content: space-between;
}

.sliderblocks_nav-item {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    border-radius: 3px;
    font-size: 0;
    background: #eeeeee center no-repeat;
    cursor: pointer;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out, background-color 0.2s ease-in-out;
    pointer-events: auto;
}

.sliderblocks_nav-item:hover {
    background-color: #e0e0e0;
}

.sliderblocks_nav-item__disable {
    opacity: .5;
    pointer-events: none;
}

.sliderblocks_nav-item__left {
    background-image: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><path d="M 17.653 18.006 L 22.927 12.731 C 23.195 12.463 23.329 12.136 23.329 11.749 C 23.329 11.362 23.195 11.035 22.927 10.767 L 22.113 9.953 C 21.845 9.685 21.518 9.551 21.131 9.551 C 20.744 9.551 20.417 9.685 20.149 9.953 L 13.073 17.018 C 12.805 17.286 12.671 17.613 12.671 18 C 12.671 18.387 12.805 18.714 13.073 18.982 L 20.149 26.047 C 20.417 26.315 20.744 26.449 21.131 26.449 C 21.518 26.449 21.845 26.315 22.113 26.047 L 22.927 25.233 C 23.195 24.966 23.328 24.64 23.328 24.257 C 23.328 23.873 23.195 23.544 22.927 23.269 L 17.653 18.006 Z" fill="%23757575"></path></svg>');
}

.sliderblocks_nav-item__right {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><path d="M 18.348 18.005 L 13.074 12.73 C 12.806 12.463 12.672 12.135 12.672 11.748 C 12.672 11.361 12.806 11.034 13.074 10.766 L 13.887 9.952 C 14.155 9.684 14.482 9.551 14.869 9.551 C 15.256 9.551 15.584 9.684 15.852 9.952 L 22.927 17.017 C 23.195 17.285 23.329 17.612 23.329 17.999 C 23.329 18.386 23.195 18.714 22.927 18.981 L 15.852 26.046 C 15.584 26.314 15.256 26.448 14.869 26.448 C 14.482 26.448 14.155 26.314 13.887 26.046 L 13.074 25.233 C 12.806 24.965 12.672 24.639 12.672 24.256 C 12.672 23.872 12.806 23.543 13.074 23.268 L 18.348 18.005 Z" fill="%23757575"></path></svg>');
}

.sliderblocks-step {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    min-width: var(--sliderblocks-min-step-width);
    flex: 1 0;
}

.sliderblocks-step_wrapper {
    display: flex;
    transition: transform 0.5s ease;
    cursor: grab;
}

.sliderblocks-step_wrapper:active {
    cursor: grabbing;
}

.sliderblocks-step_inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}