Every map has its own Custom CSS box. Anything you put there applies to this map only, and because it's injected after the company brand style and this map's own theme, it wins over both. Reach for it when a single map needs a tweak your other maps shouldn't inherit.
Where to find it
-
Open the map in the editor
Go to map.au, sign in, and open the map you want to style.
-
Go to the Styles tab
Select the Styles tab, then scroll to Map colours.
-
Find the Custom CSS box
At the bottom of that panel is a Custom CSS heading with a code box beneath it. Type your CSS straight in.
-
Watch the live preview
The preview on the right updates as you type, so you can see each rule land before you commit.
Nothing goes live until you save and re-publish the map.
The cascade — what beats what
Your styles are stacked in this order, later layers overriding earlier ones. Knowing the order tells you why a rule does (or doesn't) take effect:
| Layer | Set where | Scope |
|---|---|---|
| 1. Mapvera default | built in | every map |
| 2. Company brand style | Team Settings → Brand style | all your maps |
| 3. This map's theme | Styles → Map colours + Panel & sheet theme | this map |
| 4. This map's Custom CSS | Styles → Custom CSS | this map — wins over all above |
!important. If a rule still won't stick, your selector is probably too weak — make it more specific rather than reaching for !important.Useful selectors
The visitor UI (bottom sheet, side panel, buttons and place cards) is built from .mvw classes. A few you'll use often:
| Selector | Targets |
|---|---|
.mvw | the whole wayfinding UI wrapper — a good place to set shared variables |
.mvw-btn | the Directions / Share / More buttons |
.mvw-thumb | the logo / thumbnail slot in the sheet header |
.mapvera-pin | the pins on the map |
Examples to copy
-
Square off the buttons
.mvw-btn{ border-radius:4px }— the same example shown in the editor's tooltip. -
Recolour via a variable
Some elements read a CSS variable, so setting it on
.mvwcascades cleanly:.mvw{ --mvw-accent:#c0392b }.Setting the variable is gentler than overriding each element by hand.
-
Nudge one thing on mobile only
Wrap the rule in a media query:
@media (max-width:640px){ .mvw-btn{ font-size:15px } }.
Save and check
The preview is a guide, not the final word. Save the map, Publish it, then open the public map (and a phone) to confirm the change looks right on the real page. If something looks off, come back and refine — Custom CSS is safe to edit as often as you like.