.ispin-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 0;
    vertical-align: middle
}
.ispin-wrapper .ispin-button {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 0;
    min-width: 0;
    width: 18px;
    height: 12px;
    padding: 0;
    margin: 0;
    right: 4px;
    border: none;
    cursor: pointer;
    border-radius: 3px;
    background-color: transparent;
}

.ispin-wrapper .ispin-button::before {
    content: '';
    display: block;
    width: 9px;
    height: 6px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}

.ispin-button-inc {
    top: 4px;
}

.ispin-button-inc::before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAYAAAARx7TFAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB9SURBVHgBbcyxDcJQDATQO8MAjECFlI4VXIBEmREYgYkyQkb4jJCaihEyQL6duHAURXFzOvvJxGZK+d3ryXurbJ96G3LPHSgOXJY6eqUm5AHIWSG3wB1/mr1dpCNxTSjT2bsE1Uwf2nwjoyM+i/eCyT4JXtrEAZHR4RhgbGef61Sao9TXmAAAAABJRU5ErkJggg==);
}

.ispin-button-dec {
    bottom: 4px;
}

.ispin-button-dec::before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAYAAAARx7TFAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACASURBVHgBVc2xDcJQDATQO38GYIRUSHQZgd/QZwQmYgRGoIfCK9BFosoILBCbOIqjxKXvnc239heI3A9mXa3nAcuo9s1YRH20m7DIA0Qbiwh2AGjiAF/6bVlcp+xIYIhmFGfg+LmxMppbmO8SXOvpw9zt4AZEtqKEEH/C2CWI+QMHcEMQb3YadAAAAABJRU5ErkJggg==);
}

.ispin-wrapper .ispin-button:hover::before {
    filter: brightness(0) invert(1);
}