+/* boundaries */
+path.line.stroke.tag-boundary {
+ stroke: #fff;
+ stroke-width: 2;
+ stroke-linecap: butt;
+ stroke-dasharray: 20, 5, 5, 5;
+}
+path.line.casing.tag-boundary {
+ stroke: #82b5fe;
+ stroke-width: 6;
+}
+
+path.line.casing.tag-boundary-protected_area,
+path.line.casing.tag-boundary-national_park {
+ stroke: #b0e298;
+}
+
+
+/* barriers and similar */
+path.line.stroke.tag-barrier:not(.tag-barrier-hedge):not(.tag-waterway) {
+ stroke: #ddd;
+}
+.preset-icon-container path.line.stroke.tag-barrier:not(.tag-barrier-hedge) {
+ stroke: rgb(170, 170, 170);
+}
+path.line.casing.tag-natural,
+path.line.casing.tag-barrier:not(.tag-waterway),
+path.line.casing.tag-man_made-groyne,
+path.line.casing.tag-man_made-breakwater {
+ stroke: none;
+}
+path.line.stroke.tag-barrier:not(.tag-waterway),
+path.line.stroke.tag-man_made-groyne,
+path.line.stroke.tag-man_made-breakwater {
+ stroke-width: 3px;
+ stroke-linecap: round;
+ stroke-dasharray: 15, 5, 1, 5;
+}
+.low-zoom path.line.stroke.tag-barrier:not(.tag-waterway),
+.low-zoom path.line.stroke.tag-man_made-groyne,
+.low-zoom path.line.stroke.tag-man_made-breakwater {
+ stroke-width: 2px;
+ stroke-linecap: butt;
+ stroke-dasharray: 8, 2, 2, 2;
+}
+.preset-icon-container path.line.stroke.tag-barrier,
+.preset-icon-container path.line.stroke.tag-man_made-groyne,
+.preset-icon-container path.line.stroke.tag-man_made-breakwater {
+ stroke-dasharray: 1, 4, 6, 4;
+}
+path.line.stroke.tag-barrier.tag-barrier-wall,
+path.line.stroke.tag-barrier.tag-barrier-retaining_wall,
+path.line.stroke.tag-barrier.tag-barrier-city_wall {
+ stroke-linecap: butt;
+ stroke-dasharray: 16, 3, 9, 3;
+}
+.low-zoom path.line.stroke.tag-barrier.tag-barrier-wall,
+.low-zoom path.line.stroke.tag-barrier.tag-barrier-retaining_wall,
+.low-zoom path.line.stroke.tag-barrier.tag-barrier-city_wall,
+.preset-icon-container path.line.stroke.tag-barrier.tag-barrier-wall,
+.preset-icon-container path.line.stroke.tag-barrier.tag-barrier-retaining_wall,
+.preset-icon-container path.line.stroke.tag-barrier.tag-barrier-city_wall {
+ stroke-dasharray: 8, 1, 4, 1;
+}
+
+
+/* bridges */
+path.line.casing.tag-bridge {
+ stroke-opacity: 0.6;
+ stroke: #000 !important;
+ stroke-linecap: butt;
+ stroke-dasharray: none;
+}
+path.line.shadow.tag-bridge {
+ stroke-width: 24;
+}
+path.line.casing.tag-bridge {
+ stroke-width: 16;
+}
+.low-zoom path.line.shadow.tag-bridge {
+ stroke-width: 16;
+}
+.low-zoom path.line.casing.tag-bridge {
+ stroke-width: 10;
+}
+
+path.line.shadow.tag-railway.tag-bridge,
+path.line.shadow.tag-highway-living_street.tag-bridge,
+path.line.shadow.tag-highway-path.tag-bridge,
+path.line.shadow.tag-highway-corridor.tag-bridge,
+path.line.shadow.tag-highway-pedestrian.tag-bridge,
+path.line.shadow.tag-highway-service.tag-bridge,
+path.line.shadow.tag-highway-track.tag-bridge,
+path.line.shadow.tag-highway-steps.tag-bridge,
+path.line.shadow.tag-highway-footway.tag-bridge,
+path.line.shadow.tag-highway-cycleway.tag-bridge,
+path.line.shadow.tag-highway-bridleway.tag-bridge {
+ stroke-width: 18;
+}
+path.line.casing.tag-railway.tag-bridge,
+path.line.casing.tag-highway-living_street.tag-bridge,
+path.line.casing.tag-highway-path.tag-bridge,
+path.line.casing.tag-highway-corridor.tag-bridge,
+path.line.casing.tag-highway-pedestrian.tag-bridge,
+path.line.casing.tag-highway-service.tag-bridge,
+path.line.casing.tag-highway-track.tag-bridge,
+path.line.casing.tag-highway-steps.tag-bridge,
+path.line.casing.tag-highway-footway.tag-bridge,
+path.line.casing.tag-highway-cycleway.tag-bridge,
+path.line.casing.tag-highway-bridleway.tag-bridge {
+ stroke-width: 10;
+}
+
+.low-zoom path.line.shadow.tag-railway.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-living_street.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-path.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-corridor.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-pedestrian.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-service.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-track.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-steps.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-footway.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-cycleway.tag-bridge,
+.low-zoom path.line.shadow.tag-highway-bridleway.tag-bridge {
+ stroke-width: 14;
+}
+.low-zoom path.line.casing.tag-railway.tag-bridge,
+.low-zoom path.line.casing.tag-highway-living_street.tag-bridge,
+.low-zoom path.line.casing.tag-highway-path.tag-bridge,
+.low-zoom path.line.casing.tag-highway-corridor.tag-bridge,
+.low-zoom path.line.casing.tag-highway-pedestrian.tag-bridge,
+.low-zoom path.line.casing.tag-highway-service.tag-bridge,
+.low-zoom path.line.casing.tag-highway-track.tag-bridge,
+.low-zoom path.line.casing.tag-highway-steps.tag-bridge,
+.low-zoom path.line.casing.tag-highway-footway.tag-bridge,
+.low-zoom path.line.casing.tag-highway-cycleway.tag-bridge,
+.low-zoom path.line.casing.tag-highway-bridleway.tag-bridge {
+ stroke-width: 6;
+}
+
+
+/* tunnels */
+path.line.stroke.tag-tunnel,
+path.line.stroke.tag-location-underground,
+path.line.stroke.tag-location-underwater {
+ stroke-opacity: 0.3;
+}
+path.line.casing.tag-tunnel,
+path.line.casing.tag-location-underground,
+path.line.stroke.tag-location-underwater {
+ stroke-opacity: 0.5;
+ stroke-linecap: butt;
+ stroke-dasharray: none;
+}
+
+
+/* embankments / cuttings */
+path.line.shadow.tag-embankment,
+path.line.shadow.tag-cutting {
+ stroke-width: 28;
+}
+path.line.casing.tag-embankment,
+path.line.casing.tag-cutting {
+ stroke-opacity: 0.5;
+ stroke: #000;
+ stroke-width: 22;
+ stroke-dasharray: 2, 4;
+ stroke-linecap: butt;
+}
+
+.low-zoom path.line.shadow.tag-embankment,
+.low-zoom path.line.shadow.tag-cutting {
+ stroke-width: 14;
+}
+.low-zoom path.line.casing.tag-embankment,
+.low-zoom path.line.casing.tag-cutting {
+ stroke-width: 10;
+}
+
+
+/* Surface - unpaved */
+path.line.casing.tag-unpaved {
+ stroke: #ccc;
+ stroke-linecap: butt;
+ stroke-dasharray: 4, 3;
+}
+.low-zoom path.line.casing.tag-unpaved {
+ stroke-dasharray: 3, 2;
+}
+path.line.casing.tag-bridge.tag-unpaved {
+ stroke: #000;
+ stroke-dasharray: 4, 3;
+}
+.low-zoom path.line.casing.tag-bridge.tag-unpaved {
+ stroke: #000;
+ stroke-dasharray: 3, 2;
+}
+
+
+/* Status (e.g. proposed, abandoned) */
+path.area.stroke.tag-status,
+path.line.stroke.tag-status,
+path.area.casing.tag-status,
+path.line.casing.tag-status {
+ stroke-linecap: butt;
+ stroke-dasharray: 7, 3;
+}
+.low-zoom path.area.stroke.tag-status,
+.low-zoom path.line.stroke.tag-status,
+.low-zoom path.area.casing.tag-status,
+.low-zoom path.line.casing.tag-status {
+ stroke-dasharray: 5, 2;
+}
+
+/* Road Closed Status */
+.preset-icon .icon.tag-highway.tag-status-construction {
+ color: #fc6c14;
+ fill: #fff;
+}
+path.line.shadow.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 20;
+}
+path.line.casing.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 10;
+ stroke-linecap: butt;
+ stroke-dasharray: none
+}
+path.line.stroke.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 8;
+ stroke-linecap: butt;
+ stroke-dasharray: 10, 10;
+}
+path.line.casing.tag-highway.tag-status.tag-status-construction,
+.preset-icon-container path.line.stroke.tag-highway.tag-status.tag-status-construction {
+ stroke: #fff;
+}
+path.line.stroke.tag-highway.tag-status.tag-status-construction,
+.preset-icon-container path.line.casing.tag-highway.tag-status.tag-status-construction {
+ stroke: #fc6c14;
+}
+.low-zoom path.line.shadow.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 16;
+}
+.low-zoom path.line.casing.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 7;
+}
+.low-zoom path.line.stroke.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 5;
+ stroke-dasharray: 8, 8;
+}
+
+
+/* Buildings */
+path.stroke.tag-building {
+ stroke: rgb(224, 110, 95);
+}
+path.fill.tag-building {
+ stroke: rgba(224, 110, 95, 0.3);
+ fill: rgba(224, 110, 95, 0.3);
+}
+/* Cursors */
+
+.nope,
+.nope * {
+ cursor: not-allowed !important;
+}
+
+.map-in-map,
+#map {
+ cursor: auto; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-grab.png") %>) 9 9, auto; /* FF */
+}
+
+.mode-browse .point,
+.mode-select .point {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-point.png") %>), pointer; /* FF */
+}
+
+.mode-select .vertex,
+.mode-browse .vertex {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-vertex.png") %>), pointer; /* FF */
+}
+
+.mode-browse .line,
+.mode-select .line {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-line.png") %>), pointer; /* FF */
+}
+
+.mode-select .area,
+.mode-browse .area {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-area.png") %>), pointer; /* FF */
+}
+
+.mode-select .midpoint,
+.mode-browse .midpoint {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-split.png") %>), pointer; /* FF */
+}
+
+.mode-select .behavior-multiselect .point,
+.mode-select .behavior-multiselect .vertex,
+.mode-select .behavior-multiselect .line,
+.mode-select .behavior-multiselect .area {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-add.png") %>), pointer; /* FF */
+}
+
+.mode-select .behavior-multiselect .selected {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-remove.png") %>), pointer; /* FF */
+}
+
+.mode-add-preset #map,
+.mode-draw-line #map,
+.mode-draw-area #map,
+.mode-add-line #map,
+.mode-add-area #map,
+.mode-drag-node #map,
+.mode-drag-note #map {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw.png") %>) 9 9, crosshair; /* FF */
+}
+
+.mode-draw-line .way.target,
+.mode-draw-area .way.target,
+.mode-add-line .way.target,
+.mode-add-area .way.target,
+.mode-drag-node .way.target {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw-connect-line.png") %>) 9 9, crosshair; /* FF */
+}
+
+.mode-draw-line .vertex.target,
+.mode-draw-area .vertex.target,
+.mode-add-line .vertex.target,
+.mode-add-area .vertex.target,
+.mode-drag-node .vertex.target {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw-connect-vertex.png") %>) 9 9, crosshair; /* FF */
+}
+
+.mode-add-point #map,
+.mode-add-note #map,
+.mode-browse.lasso #map,
+.mode-browse.lasso .way,
+.mode-browse.lasso .vertex,
+.mode-browse.lasso .midpoint,
+.mode-select.lasso #map,
+.mode-select.lasso .way,
+.mode-select.lasso .vertex,
+.mode-select.lasso .midpoint {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw.png") %>) 9 9, crosshair; /* FF */
+}
+
+.mode-browse .note,
+.mode-browse .qa_error,
+.mode-select .note,
+.mode-select .qa_error,
+.turn rect,
+.turn circle {
+ cursor: pointer;
+}
+/* photo viewer div */
+#photoviewer {
+ position: relative;
+ flex-shrink: 0;
+ margin-bottom: 10px;
+ width: 330px;
+ height: 250px;
+ padding: 5px;
+ background-color: #fff;
+}
+[dir='ltr'] #photoviewer {
+ margin-left: 10px;
+ margin-right: 2px;
+}
+[dir='rtl'] #photoviewer {
+ margin-right: 10px;
+ margin-left: 2px;
+}
+
+@media screen and (min-width: 1600px) {
+ #photoviewer {
+ width: 490px;
+ height: 370px;
+ }
+}
+
+#photoviewer button.thumb-hide {
+ border-radius: 0;
+ padding: 5px;
+ position: absolute;
+ right: 5px;
+ top: 5px;
+ z-index: 50;
+}
+
+#photoviewer button.resize-handle-xy {
+ border-radius: 0;
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 49;
+ cursor: nesw-resize;
+ height: 25px;
+ width: 25px;
+}
+
+#photoviewer button.resize-handle-x {
+ border-radius: 0;
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 48;
+ cursor: ew-resize;
+ height: auto;
+ width: 6px;
+}
+
+#photoviewer button.resize-handle-y {
+ border-radius: 0;
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 48;
+ cursor: ns-resize;
+ height: 6px;
+ width: 100%;
+}
+
+
+.photo-wrapper,
+.photo-wrapper img {
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ object-fit: cover;
+}
+
+.photo-wrapper .photo-attribution {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ width: 100%;
+ font-size: 10px;
+ text-align: right;
+ line-height: 1.1em;
+ padding: 4px 2px;
+ z-index: 10;
+}
+
+.photo-attribution a,
+.photo-attribution a:visited,
+.photo-attribution span {
+ padding: 4px 2px;
+ color: #fff;
+}
+
+/* markers and sequences */
+.viewfield-group {
+ pointer-events: none;
+}
+.mode-browse .viewfield-group,
+.mode-select .viewfield-group {
+ pointer-events: visible;
+ cursor: pointer;
+}
+
+.viewfield-group.currentView * {
+ fill: #ffee00 !important;
+}
+.viewfield-group.hovered * {
+ fill: #eebb00 !important;
+}
+
+.viewfield-group circle {
+ stroke: #555;
+ stroke-width: 1;
+ stroke-opacity: 0.4;
+ fill-opacity: 0.4;
+}
+.viewfield-group.highlighted circle {
+ stroke: #222;
+ stroke-opacity: 0.9;
+ fill-opacity: 0.9;
+}
+.viewfield-group.highlighted.hovered circle {
+ stroke: #222;
+ stroke-width: 2;
+ stroke-opacity: 0.9;
+ fill-opacity: 0.9;
+}
+.viewfield-group.highlighted.currentView circle {
+ stroke: #222;
+ stroke-width: 2;
+ stroke-opacity: 1;
+ fill-opacity: 1;
+}
+
+.viewfield-group .viewfield {
+ stroke-width: 0;
+ stroke: #222;
+ fill-opacity: 0.4;
+}
+.viewfield-group.highlighted .viewfield {
+ stroke-width: 1;
+ fill-opacity: 0.8;
+}
+.viewfield-group.highlighted.hovered .viewfield {
+ stroke-width: 1;
+ fill-opacity: 0.8;
+}
+.viewfield-group.highlighted.currentView .viewfield {
+ stroke-width: 1;
+ fill-opacity: 0.9;
+}
+
+.viewfield-group.currentView .viewfield-scale {
+ transform: scale(2,2);
+}
+
+.sequence {
+ fill: none;
+ stroke-width: 2;
+ stroke-opacity: 0.4;
+}
+.sequence.highlighted,
+.sequence.currentView {
+ stroke-width: 4;
+ stroke-opacity: 1;
+}
+
+
+/* Streetside Image Layer */
+.layer-streetside-images {
+ pointer-events: none;
+}
+.layer-streetside-images .viewfield-group * {
+ fill: #0fffc4;
+}
+.layer-streetside-images .sequence {
+ stroke: #0fffc4;
+ stroke-opacity: 0.85; /* bump opacity - only one per road */
+}
+
+
+/* Mapillary Image Layer */
+.layer-mapillary {
+ pointer-events: none;
+}
+.layer-mapillary .viewfield-group * {
+ fill: #55ff22;
+}
+.layer-mapillary .sequence {
+ stroke: #55ff22;
+}
+
+
+/* Mapillary Traffic Signs and Map Features Layers */
+.layer-mapillary-signs,
+.layer-mapillary-map-features {
+ pointer-events: none;
+}
+.layer-mapillary-signs .icon-sign,
+.layer-mapillary-map-features .icon-map-feature {
+ outline: 2px solid transparent;
+ pointer-events: visible;
+ cursor: pointer;
+}
+.layer-mapillary-signs .icon-sign:hover,
+.layer-mapillary-map-features .icon-map-feature:hover {
+ outline: 5px solid #eebb00;
+ background-color: #eebb00;
+}
+.layer-mapillary-signs .icon-sign.currentView,
+.layer-mapillary-map-features .icon-map-feature.currentView {
+ outline: 5px solid #ffee00;
+ background-color: #ffee00;
+}
+
+
+/* OpenStreetCam Image Layer */
+.layer-openstreetcam {
+ pointer-events: none;
+}
+.layer-openstreetcam .viewfield-group * {
+ fill: #20c4ff;
+}
+.layer-openstreetcam .sequence {
+ stroke: #20c4ff;
+}
+
+
+/* Streetside Viewer (pannellum) */
+.ms-wrapper .photo-attribution .image-link {
+ display: block;
+}
+.ms-wrapper .photo-attribution .attribution-row {
+ display: flex;
+ flex-flow: row nowrap;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 5px;
+}
+.ms-wrapper .photo-attribution .image-view-link {
+ text-align: left;
+ margin: 0 5px;
+}
+.ms-wrapper .photo-attribution .image-report-link {
+ text-align: right;
+}
+
+.ms-wrapper .photo-attribution a:active,
+.ms-wrapper .photo-attribution a:hover {
+ color: #0fffc4;
+}
+
+.ms-wrapper .pnlm-compass.pnlm-control {
+ width: 26px;
+ height: 26px;
+ left: 4px;
+ top: 60px;
+ background-size: contain;
+ background-repeat: no-repeat no-repeat;
+}
+
+label.streetside-hires {
+ cursor: pointer;
+}
+.streetside-hires span {
+ margin-top: 2px;
+}
+.streetside-hires input[type="checkbox"] {
+ float: left;
+ width: 12px;
+ height: 12px;
+ margin: 0 5px;
+}
+
+
+/* Mapillary viewer */
+#mly .domRenderer .TagSymbol {
+ font-size: 10px;
+ background-color: rgba(0,0,0,0.4);
+ padding: 0 4px;
+ border-radius: 4px;
+ top: -25px;
+}
+#mly .domRenderer .Attribution {
+ /* we will roll our own to avoid async update issues like #4526 */
+ display: none;
+}
+
+.mly-wrapper .photo-attribution a:active,
+.mly-wrapper .photo-attribution a:hover {
+ color: #35af6d;
+}
+
+.mly-wrapper .mapillary-js-dom {
+ z-index: 9;
+}
+
+
+/* OpenStreetCam viewer */
+.osc-wrapper {
+ position: relative;
+ background-color: #000;
+ background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+ background-position: center;
+ background-repeat: no-repeat;
+}
+
+.osc-wrapper .photo-attribution a:active,
+.osc-wrapper .photo-attribution a:hover {
+ color: #20c4ff;
+}
+
+.osc-image-wrap {
+ width: 100%;
+ height: 100%;
+ transform-origin:0 0;
+ -ms-transform-origin:0 0;
+ -webkit-transform-origin:0 0;
+ -moz-transform-origin:0 0;
+ -o-transform-origin:0 0;
+}
+
+
+/* photo-controls (step forward, back, rotate) */
+.photo-controls-wrap {
+ text-align: center;
+ position: absolute;
+ top: 10px;
+ width: 100%;
+ z-index: 10;
+}
+
+.photo-controls {
+ display: inline-block;
+ z-index: 10;
+}
+
+.photo-controls button,
+.photo-controls button:focus {
+ height: 18px;
+ width: 18px;
+ background: rgba(0,0,0,0.65);
+ color: #eee;
+ border-radius: 0;
+}
+.photo-controls button:first-of-type {
+ border-radius: 3px 0 0 3px;
+}
+.photo-controls button:last-of-type {
+ border-radius: 0 3px 3px 0;
+}
+.photo-controls button:hover,
+.photo-controls button:active {
+ background: rgba(0,0,0,0.85);
+ color: #fff;
+}
+
+/* OSM Notes and KeepRight Layers */
+
+.error-header-icon .qa_error-fill,
+.layer-keepRight .qa_error .qa_error-fill,
+.layer-improveOSM .qa_error .qa_error-fill {
+ stroke: #333;
+ stroke-width: 1.3px; /* NOTE: likely a better way to scale the icon stroke */
+}
+
+.note-header-icon .note-fill,
+.layer-notes .note .note-fill {
+ color: #f30;
+ stroke: #333;
+ stroke-width: 40px;
+}
+.note-header-icon.new .note-fill,
+.layer-notes .note.new .note-fill {
+ color: #fe0;
+ stroke: #333;
+ stroke-width: 40px;
+}
+.note-header-icon.closed .note-fill,
+.layer-notes .note.closed .note-fill {
+ color: #5d0;
+ stroke: #333;
+ stroke-width: 40px;
+}
+
+/* slight adjustments to preset icon for note icons */
+.note-header-icon .preset-icon-28 {
+ top: 18px;
+}
+.note-header-icon .note-icon-annotation {
+ position: absolute;
+ top: 22px;
+ left: 22px;
+ margin: auto;
+}
+.note-header-icon .note-icon-annotation .icon {
+ width: 15px;
+ height: 15px;
+}
+
+/* adjustment for error icon */
+
+.error-header-icon .preset-icon-28 {
+ top: auto;
+ left: auto;
+}
+
+.error-header-icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+/* Keep Right Errors
+------------------------------------------------------- */
+.keepRight.error_type-20, /* multiple nodes on same spot */
+.keepRight.error_type-40, /* impossible oneways */
+.keepRight.error_type-210, /* self intersecting ways */
+.keepRight.error_type-270, /* unusual motorway connection */
+.keepRight.error_type-310, /* roundabout issues */
+.keepRight.error_type-320, /* improper _link */
+.keepRight.error_type-350 { /* improper bridge tag */
+ color: #ff9;
+}
+
+.keepRight.error_type-50 { /* almost junctions */
+ color: #88f;
+}
+
+.keepRight.error_type-60, /* deprecated tags */
+.keepRight.error_type-70, /* tagging issues */
+.keepRight.error_type-90, /* motorway without ref */
+.keepRight.error_type-100, /* place of worship without religion */
+.keepRight.error_type-110, /* poi without name */
+.keepRight.error_type-150, /* railway crossing without tag */
+.keepRight.error_type-220, /* misspelled tag */
+.keepRight.error_type-380 { /* non-physical sport tag */
+ color: #5d0;
+}
+
+.keepRight.error_type-130 { /* disconnected ways */
+ color: #fa3;
+}
+
+.keepRight.error_type-170 { /* FIXME tag */
+ color: #ff0;
+}
+
+.keepRight.error_type-190 { /* intersection without junction */
+ color: #f33;
+}
+
+.keepRight.error_type-200 { /* overlapping ways */
+ color: #fdbf6f;
+}
+
+.keepRight.error_type-160, /* railway layer conflict */
+.keepRight.error_type-230 { /* layer conflict */
+ color: #b60;
+}
+
+.keepRight.error_type-280 { /* boundary issues */
+ color: #5f47a0;
+}
+
+.keepRight.error_type-180, /* relation without type */
+.keepRight.error_type-290 { /* turn restriction issues */
+ color: #ace;
+}
+
+.keepRight.error_type-300, /* missing maxspeed */
+.keepRight.error_type-390 { /* missing tracktype */
+ color: #090;
+}
+
+.keepRight.error_type-360, /* language unknown */
+.keepRight.error_type-370, /* doubled places */
+.keepRight.error_type-410 { /* website issues */
+ color: #f9b;
+}
+
+.keepRight.error_type-120, /* way without nodes */
+.keepRight.error_type-400 { /* geometry / turn angles */
+ color: #c35;
+}
+
+/* ImproveOSM Errors
+------------------------------------------------------- */
+
+.improveOSM.error_type-ow { /* missing one way */
+ color: #1E90FF;
+}
+
+.improveOSM.error_type-mr-road { /* missing road */
+ color: #B452CD;
+}
+.improveOSM.error_type-mr-path { /* missing path */
+ color: #A0522D;
+}
+.improveOSM.error_type-mr-parking { /* missing parking */
+ color: #EEEE00;
+}
+.improveOSM.error_type-mr-both { /* missing road+parking */
+ color: #FFA500;
+}
+
+.improveOSM.error_type-tr { /* missing turn restriction */
+ color: #EC1C24;
+}
+
+
+/* Custom Map Data (geojson, gpx, kml, vector tile) */
+.layer-mapdata {
+ pointer-events: none;
+}
+
+.layer-mapdata path.shadow {
+ pointer-events: stroke;
+ stroke: #f6634f;
+ stroke-width: 16;
+ stroke-opacity: 0;
+ fill: none;
+}
+.layer-mapdata path.MultiPoint.shadow,
+.layer-mapdata path.Point.shadow {
+ pointer-events: fill;
+ fill: #f6634f;
+ fill-opacity: 0;
+}
+.layer-mapdata path.shadow.hover:not(.selected) {
+ stroke-opacity: 0.4;
+}
+.layer-mapdata path.shadow.selected {
+ stroke-opacity: 0.7;
+}
+
+.layer-mapdata path.stroke {
+ stroke: #ff26d4;
+ stroke-width: 2;
+ fill: none;
+}
+
+.layer-mapdata path.fill {
+ stroke-width: 0;
+ stroke-opacity: 0.3;
+ stroke: #ff26d4;
+ fill: #ff26d4;
+ fill-opacity: 0.3;
+ fill-rule: evenodd;
+}
+
+.layer-mapdata text.label-halo,
+.layer-mapdata text.label {
+ font-size: 10px;
+ font-weight: bold;
+ dominant-baseline: middle;
+}
+.layer-mapdata text.label {
+ fill: #ff26d4;
+}
+.layer-mapdata text.label.hover,
+.layer-mapdata text.label.selected {
+ fill: #f6634f;
+}
+.layer-mapdata text.label-halo {
+ opacity: 0.7;
+ stroke: #000;
+ stroke-width: 5px;
+ stroke-miterlimit: 1;
+}
+/* Fill Styles */
+
+.low-zoom.fill-wireframe path.stroke,
+.fill-wireframe path.stroke {
+ stroke-width: 1 !important;
+ stroke-opacity: 0.5 !important;
+ stroke-dasharray: none !important;
+ fill: none !important;
+}
+.low-zoom.fill-wireframe .layer-mapdata path.stroke,
+.fill-wireframe .layer-mapdata path.stroke {
+ stroke-width: 2 !important;
+ stroke-opacity: 1 !important;
+}
+
+.low-zoom.fill-wireframe path.shadow,
+.fill-wireframe path.shadow {
+ stroke-width: 12;
+}
+
+.fill-wireframe path.shadow.related:not(.selected),
+.fill-wireframe path.shadow.hover:not(.selected) {
+ stroke-opacity: 0.4;
+}
+.fill-wireframe path.shadow.selected {
+ stroke-opacity: 0.6;
+}
+
+.fill-wireframe .point,
+.fill-wireframe .areaicon,
+.fill-wireframe .areaicon-halo,
+.fill-wireframe path.casing,
+.fill-wireframe path.fill,
+.fill-wireframe path.oneway {
+ display: none !important;
+}
+
+.fill-partial path.area.fill {
+ fill-opacity: 0;
+ stroke-width: 60px;
+ pointer-events: none;
+}
+.fill-partial path.area.fill.tag-building_part {
+ stroke-width: 40px;
+}
+.fill-partial path.area.fill.tag-indoor {
+ stroke-width: 20px;
+}
+.mode-browse .fill-partial path.area.fill,
+.mode-select .fill-partial path.area.fill {
+ pointer-events: visibleStroke;
+}
+/* Basics
+------------------------------------------------------- */
+/*
+ Opera misbehaves when the window is resized vertically unless 100% width + height are
+ applied to both html and body. https://gist.github.com/jfirebaugh/bd225bcfdd3a633850c4
+*/
+html, body {
+ width: 100%;
+ height: 100%;
+}
+
+body {
+ font: normal 12px/1.6667 "-apple-system", BlinkMacSystemFont,
+ "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+ "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
+ sans-serif;
+ margin: 0;
+ padding: 0;
+ color: #333;
+ overflow: hidden;
+ -ms-user-select: none;
+ -ms-content-zooming: none;
+}
+
+.unsupported {
+ text-align: center;
+ vertical-align: middle;
+ padding-top: 100px;
+ font-size: 15px;
+}
+
+.id-container {
+ height: 100%;
+ width: 100%;
+}
+
+#content {
+ position: relative;
+ overflow: hidden;
+ height: 100%;
+}
+
+#content.active {
+ -webkit-filter: none !important;
+ filter: none !important;
+ -webkit-duration: 200ms;
+ transition-duration: 200ms;
+}
+
+#content.inactive {
+ -webkit-filter: grayscale(80%) brightness(80%);
+ filter: grayscale(80%) brightness(80%);
+ -webkit-duration: 200ms;
+ transition-duration: 200ms;
+}
+
+#defs {
+ /* Can't be display: none or the clippaths are ignored. */
+ position: absolute;
+ width: 0;
+ height: 0;
+}
+
+div, textarea, label, input, form, span, ul, li, ol, a, button, h1, h2, h3, h4, h5, p, img {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+a, button, input, textarea {
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+ -webkit-touch-callout: none;
+}
+
+ul li {
+ list-style: none;
+}
+
+a,
+button,
+.radial-menu-item {
+ cursor: pointer;
+}
+
+h2 {
+ font-size: 25px;
+ line-height: 1.25;
+ font-weight: bold;
+ margin-bottom: 20px;
+}
+
+h3:last-child,
+h2:last-child,
+h4:last-child { margin-bottom: 0;}
+
+h3 {
+ font-size: 16px;
+ line-height: 1.25;
+ font-weight: bold;
+ margin-bottom: 10px;
+}
+h4, h5 {
+ font-size: 12px;
+ font-weight: bold;
+ padding-bottom: 10px;
+}
+
+:focus {
+ outline-color: transparent;
+ outline-style: none;
+}
+
+::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
+ color: #aaa;
+ opacity: 1; /* Firefox */
+}
+:-ms-input-placeholder { /* Internet Explorer 10-11 */
+ color: #aaa;
+}
+::-ms-input-placeholder { /* Microsoft Edge */
+ color: #aaa;
+}
+
+p {
+ font-size: 12px;
+ margin: 0;
+ padding: 0;
+}
+p:last-child {
+ padding-bottom: 0;
+}
+em {
+ font-style: italic;
+}
+strong {
+ font-weight: bold;
+}
+a:visited, a {
+ color: #7092ff;
+}
+a:hover {
+ color: #597be7;
+}
+
+/* Forms
+------------------------------------------------------- */
+textarea {
+ resize: vertical;
+ font:normal 12px/20px "-apple-system", BlinkMacSystemFont,
+ "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+ "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
+ sans-serif;
+}
+
+textarea,
+input[type=text],
+input[type=search],
+input[type=number],
+input[type=url],
+input[type=tel],
+input[type=email] {
+ background-color: #fff;
+ color: #333;
+ border: 1px solid #ccc;
+ padding: 5px 20px 5px 10px;
+ height: 30px;
+ border-radius: 4px;
+ text-overflow: ellipsis;
+}
+[dir='rtl'] textarea,
+[dir='rtl'] input[type=text],
+[dir='rtl'] input[type=search],
+[dir='rtl'] input[type=number],
+[dir='rtl'] input[type=url],
+[dir='rtl'] input[type=tel],
+[dir='rtl'] input[type=email] {
+ padding: 5px 10px 5px 20px;
+}
+
+textarea:focus,
+input:focus {
+ background-color: #f1f1f1;
+}
+
+textarea.disabled,
+input.disabled {
+ color: #777;
+ background-color: #eee;
+ cursor: not-allowed;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+ float: left;
+ width: 14px;
+ height: 14px;
+ margin-right: 5px;
+ margin-top: 3px;
+ cursor: pointer;
+}
+[dir='rtl'] input[type="checkbox"],
+[dir='rtl'] input[type="radio"] {
+ float: right;
+ margin-left: 5px;
+ margin-right: 0;
+}
+
+/* tables */
+table {
+ background-color: #fff;
+ border-collapse: collapse;
+ width: 100%;
+ border-spacing: 0;
+}
+table th {
+ text-align: left;
+}
+table.tags, table.tags td, table.tags th {
+ border: 1px solid #ccc;
+ padding: 4px;
+}
+
+::-ms-clear {
+ display: none;
+}
+
+/* Grid
+------------------------------------------------------- */
+.col6 { float: left; width: 50.0000%; max-width: 600px; }
+.col12 { float: left; width: 100.0000%; }
+
+
+/* Utility Classes
+------------------------------------------------------- */