image.tile { } /* base styles */ path { fill: none; } g.point circle { fill:#fff; } g.point.hover circle, g.point.selected circle { fill:#ffff00; stroke-width:4; stroke:#fff } /* interactive elements */ circle.vertex { fill:white; stroke:#333; fill-opacity:1; stroke-width:2; stroke-opacity: 1; } circle.vertex.shared { fill:#aff; } circle.vertex.hover { } circle.vertex.selected { fill: #ffff00; } circle.accuracy-handle { fill:#aaa; stroke:#333; fill-opacity:1; stroke-width:1; } circle.teaser-point { stroke-width: 2; stroke:#1DCAFF; fill:#D3F5FF; } path.casing { stroke: #111; stroke-linecap:round; stroke-linejoin:bevel; stroke-width: 3; -webkit-transition: stroke 100ms linear; } path.casing.hover { stroke:#FF0F0F !important; opacity:0.8; } path.casing.selected { stroke:#E96666 !important; opacity:1 !important; stroke-width:10 !important; } path.stroke { stroke: #555; stroke-linecap:round; stroke-linejoin:bevel; stroke-width: 2; } path.stroke.railway-rail { stroke: white; stroke-width: 3; stroke-dasharray: 12,12; } path.stroke.railway-subway { stroke: #444; stroke-width: 3; stroke-dasharray: 8,8; } path.area { stroke-width:2; stroke:red; fill:#fff; fill-opacity:0.3; } path.area.selected { stroke-width:3 !important; } path.area.natural { stroke: #ADD6A5; fill: #ADD6A5; stroke-width:1; } path.area.natural.natural-water { stroke: #6382FF; fill: #ADBEFF; } path.area.building { stroke: #9E176A; stroke-width: 1; fill: #ff6ec7; } path.area.landuse, path.area.natural.natural-wood, path.area.natural.natural-tree, path.area.natural.natural-grassland { stroke: #006B34; stroke-width: 1; fill: #189E59; fill-opacity:0.2; } /* highways */ path.stroke.highway-residential { stroke:#E8E8E8; stroke-width:4; } path.casing.highway-residential { stroke:#E8E8E8; stroke-width:10; opacity:0.4; } path.stroke.highway-unclassified, path.stroke.highway-tertiary, path.stroke.highway-tertiary_link { stroke:#FEFECB; stroke-width:6; } path.casing.highway-unclassified, path.casing.highway-tertiary, path.casing.highway-tertiary_link { stroke-width:8; } path.stroke.highway-service { stroke:#fff; stroke-width:4; } path.casing.highway-service { stroke-width:6; } path.stroke.highway-footway, path.stroke.highway-cycleway, path.stroke.highway-steps { stroke: #ff6257; stroke-width: 3; stroke-dasharray: 6, 6; } path.casing.highway-footway, path.casing.highway-cycleway, path.casing.highway-steps { stroke-width: 3; stroke: #fff; } path.stroke.highway-motorway, path.stroke.highway-motorway_link { stroke:#809BC0; stroke-width:3; } path.casing.highway-motorway, path.casing.highway-motorway_link { stroke:#809BC0; stroke-width:9; opacity:0.4; } path.stroke.highway-trunk, path.stroke.highway-trunk_link { stroke-width:7; opacity:0.4; stroke:#7FC97F; } path.casing.highway-trunk, path.casing.highway-trunk_link { stroke-width:4; stroke:#7FC97F; } path.stroke.highway-primary, path.stroke.highway-primary_link { stroke:#FD969A; stroke-width:5; } path.casing.highway-primary, path.casing.highway-primary_link { stroke:#FF6363; opacity:0.4; stroke-width:12; } path.stroke.highway-secondary, path.stroke.highway-secondary_link { stroke:#FDBF6F; stroke-width:4; } path.casing.highway-secondary, path.casing.highway-secondary_link { opacity:0.4; stroke:#FDBF6F; stroke-width:11; } path.stroke.bridge-yes { stroke:#eee; stroke-width:7; } path.stroke.waterway { stroke: #10539a; stroke-width: 3; } text { font-size:10px; } text.oneway { fill:#91CFFF; stroke:#2C6B9B; stroke-width:1; pointer-events:none; } /* Cursors */ #map:hover { cursor:url(../img/cursor-grab.png) 9 9, auto; } #map:active { cursor:url(../img/cursor-grabbing.png) 9 9, auto; } .mode-browse .point, .mode-select .point { cursor: url(../img/cursor-select-point.png), pointer; } .mode-select .vertex, .mode-browse .vertex { cursor: url(../img/cursor-select-vertex.png), pointer; } .mode-browse .line, .mode-select .line { cursor: url(../img/cursor-select-line.png), pointer; } .mode-select .area, .mode-browse .area { cursor: url(../img/cursor-select-area.png), pointer; } .mode-select .accuracy-handle, .mode-browse .accuracy-handle { cursor: url(../img/cursor-select-split.png), pointer; } .point:active, .vertex:active, .line:active, .area:active, .accuracy-handle:active, .mode-select .selected { cursor: url(../img/cursor-select-acting.png), pointer; } .mode-draw-line #map:hover, .mode-draw-area #map:hover, .mode-add-line #map:hover, .mode-add-area #map:hover { cursor:url(../img/cursor-draw.png) 9 9, auto; } .mode-add-point #map:hover { cursor:url(../img/cursor-draw-point.png) 18 18, auto; } #map.finish-area:hover { cursor:url(../img/cursor-draw-finish.png) 9 9, auto; }