styles/zoom.css

.mapillary-zoom-container {
    position: absolute;
    bottom: 90px;
    right: 14px;
    height: 66px;
    width: 32px;
    pointer-events: none;
    z-index: 10;
}

.mapillary-zoom-in-button,
.mapillary-zoom-in-button-inactive,
.mapillary-zoom-out-button,
.mapillary-zoom-out-button-inactive {
    width: 100%;
    height: 32px;
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.mapillary-zoom-in-button,
.mapillary-zoom-in-button-inactive {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.mapillary-zoom-out-button,
.mapillary-zoom-out-button-inactive {
    margin-top: 2px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.mapillary-zoom-in-button-inactive,
.mapillary-zoom-out-button-inactive {
    cursor: default;
}

.mapillary-zoom-in-icon,
.mapillary-zoom-out-icon {
    position: relative;
    top: 0;
    left: 0;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1;
    width: 32px;
    height: 32px;
}

.mapillary-zoom-compact.mapillary-zoom-container {
    height: 34px;
    width: 16px;
    bottom: 58px;
}

.mapillary-zoom-compact .mapillary-zoom-in-button,
.mapillary-zoom-compact .mapillary-zoom-in-button-inactive,
.mapillary-zoom-compact .mapillary-zoom-out-button,
.mapillary-zoom-compact .mapillary-zoom-out-button-inactive,
.mapillary-zoom-compact .mapillary-zoom-in-icon,
.mapillary-zoom-compact .mapillary-zoom-out-icon {
    width: 16px;
    height: 16px;
}

.mapillary-zoom-compact .mapillary-zoom-in-button,
.mapillary-zoom-compact .mapillary-zoom-in-button-inactive {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.mapillary-zoom-compact .mapillary-zoom-out-button,
.mapillary-zoom-compact .mapillary-zoom-out-button-inactive {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.mapillary-zoom-in-icon {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgdmlld0JveD0iMCAwIDMwIDMwIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgPHBhdGggZmlsbD0iI0ZGRiIgZD0iTTE2LDE0IEwyMSwxNCBDMjEuNTUyMjg0NywxNCAyMiwxNC40NDc3MTUzIDIyLDE1IEMyMiwxNS41NTIyODQ3IDIxLjU1MjI4NDcsMTYgMjEsMTYgTDE2LDE2IEwxNiwyMSBDMTYsMjEuNTUyMjg0NyAxNS41NTIyODQ3LDIyIDE1LDIyIEMxNC40NDc3MTUzLDIyIDE0LDIxLjU1MjI4NDcgMTQsMjEgTDE0LDE2IEw5LDE2IEM4LjQ0NzcxNTI1LDE2IDgsMTUuNTUyMjg0NyA4LDE1IEM4LDE0LjQ0NzcxNTMgOC40NDc3MTUyNSwxNCA5LDE0IEwxNCwxNCBMMTQsOSBDMTQsOC40NDc3MTUyNSAxNC40NDc3MTUzLDggMTUsOCBDMTUuNTUyMjg0Nyw4IDE2LDguNDQ3NzE1MjUgMTYsOSBMMTYsMTQgWiIvPjwvZz4gIDwvc3ZnPiAg');
}

.mapillary-zoom-out-icon {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgdmlld0JveD0iMCAwIDMwIDMwIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgPHBhdGggZmlsbD0iI0ZGRiIgZD0iTTIyLDE1IEMyMiwxNS41NTIyODQ3IDIxLjU1MjI4NDcsMTYgMjEsMTYgTDksMTYgQzguNDQ3NzE1MjUsMTYgOCwxNS41NTIyODQ3IDgsMTUgQzgsMTQuNDQ3NzE1MyA4LjQ0NzcxNTI1LDE0IDksMTQgTDIxLDE0IEMyMS41NTIyODQ3LDE0IDIyLDE0LjQ0NzcxNTMgMjIsMTUgWiIvPjwvZz4gIDwvc3ZnPiAg');
}

.mapillary-zoom-in-button-inactive .mapillary-zoom-in-icon,
.mapillary-zoom-out-button-inactive .mapillary-zoom-out-icon {
    opacity: 0.35;
}