+
+/* power */
+.ideditor path.line.stroke.tag-power {
+ stroke: #939393;
+ stroke-width: 2;
+}
+.ideditor path.line.casing.tag-power {
+ stroke: none;
+}
+
+
+/* pipeline */
+.ideditor path.line.stroke.tag-man_made-pipeline {
+ stroke: #cbd0d8;
+ stroke-linecap: butt;
+ stroke-dasharray: 80, 1.25;
+}
+.ideditor path.line.casing.tag-man_made-pipeline {
+ stroke: #666;
+}
+.ideditor .low-zoom path.line.stroke.tag-man_made-pipeline {
+ stroke-dasharray: 40, 1;
+}
+.ideditor .preset-icon-container path.line.stroke.tag-man_made-pipeline {
+ stroke-dasharray: 19, 1;
+}
+
+
+/* boundaries */
+.ideditor path.line.stroke.tag-boundary {
+ stroke: #fff;
+ stroke-width: 2;
+ stroke-linecap: butt;
+ stroke-dasharray: 20, 5, 5, 5;
+}
+.ideditor path.line.casing.tag-boundary {
+ stroke: #82b5fe;
+ stroke-width: 6;
+}
+
+.ideditor path.line.casing.tag-boundary-protected_area,
+.ideditor path.line.casing.tag-boundary-national_park {
+ stroke: #b0e298;
+}
+
+
+/* barriers and similar */
+.ideditor path.line.stroke.tag-barrier:not(.tag-barrier-hedge):not(.tag-waterway) {
+ stroke: #ddd;
+}
+.ideditor .preset-icon-container path.line.stroke.tag-barrier:not(.tag-barrier-hedge) {
+ stroke: rgb(170, 170, 170);
+}
+.ideditor path.line.casing.tag-natural,
+.ideditor path.line.casing.tag-barrier:not(.tag-waterway),
+.ideditor path.line.casing.tag-man_made-groyne,
+.ideditor path.line.casing.tag-man_made-breakwater {
+ stroke: none;
+}
+.ideditor path.line.stroke.tag-barrier:not(.tag-waterway),
+.ideditor path.line.stroke.tag-man_made-groyne,
+.ideditor path.line.stroke.tag-man_made-breakwater {
+ stroke-width: 3px;
+ stroke-linecap: round;
+ stroke-dasharray: 15, 5, 1, 5;
+}
+.ideditor .low-zoom path.line.stroke.tag-barrier:not(.tag-waterway),
+.ideditor .low-zoom path.line.stroke.tag-man_made-groyne,
+.ideditor .low-zoom path.line.stroke.tag-man_made-breakwater {
+ stroke-width: 2px;
+ stroke-linecap: butt;
+ stroke-dasharray: 8, 2, 2, 2;
+}
+.ideditor .preset-icon-container path.line.stroke.tag-barrier,
+.ideditor .preset-icon-container path.line.stroke.tag-man_made-groyne,
+.ideditor .preset-icon-container path.line.stroke.tag-man_made-breakwater {
+ stroke-dasharray: 1, 4, 6, 4;
+}
+.ideditor path.line.stroke.tag-barrier.tag-barrier-wall,
+.ideditor path.line.stroke.tag-barrier.tag-barrier-retaining_wall,
+.ideditor path.line.stroke.tag-barrier.tag-barrier-city_wall {
+ stroke-linecap: butt;
+ stroke-dasharray: 16, 3, 9, 3;
+}
+.ideditor .low-zoom path.line.stroke.tag-barrier.tag-barrier-wall,
+.ideditor .low-zoom path.line.stroke.tag-barrier.tag-barrier-retaining_wall,
+.ideditor .low-zoom path.line.stroke.tag-barrier.tag-barrier-city_wall,
+.ideditor .preset-icon-container path.line.stroke.tag-barrier.tag-barrier-wall,
+.ideditor .preset-icon-container path.line.stroke.tag-barrier.tag-barrier-retaining_wall,
+.ideditor .preset-icon-container path.line.stroke.tag-barrier.tag-barrier-city_wall {
+ stroke-dasharray: 8, 1, 4, 1;
+}
+
+
+/* bridges */
+.ideditor path.line.casing.tag-bridge {
+ stroke-opacity: 0.6;
+ stroke: #000 !important;
+ stroke-width: 16;
+ stroke-linecap: butt;
+ stroke-dasharray: none;
+}
+.ideditor path.line.shadow.tag-bridge {
+ stroke-width: 24;
+}
+.ideditor .low-zoom path.line.shadow.tag-bridge {
+ stroke-width: 16;
+}
+.ideditor .low-zoom path.line.casing.tag-bridge {
+ stroke-width: 10;
+}
+
+.ideditor path.line.shadow.tag-railway.tag-bridge,
+.ideditor path.line.shadow.tag-highway-living_street.tag-bridge,
+.ideditor path.line.shadow.tag-highway-path.tag-bridge,
+.ideditor path.line.shadow.tag-highway-corridor.tag-bridge,
+.ideditor path.line.shadow.tag-highway-pedestrian.tag-bridge,
+.ideditor path.line.shadow.tag-highway-service.tag-bridge,
+.ideditor path.line.shadow.tag-highway-track.tag-bridge,
+.ideditor path.line.shadow.tag-highway-steps.tag-bridge,
+.ideditor path.line.shadow.tag-highway-footway.tag-bridge,
+.ideditor path.line.shadow.tag-highway-cycleway.tag-bridge,
+.ideditor path.line.shadow.tag-highway-bridleway.tag-bridge {
+ stroke-width: 18;
+}
+.ideditor path.line.casing.tag-railway.tag-bridge,
+.ideditor path.line.casing.tag-highway-living_street.tag-bridge,
+.ideditor path.line.casing.tag-highway-path.tag-bridge,
+.ideditor path.line.casing.tag-highway-corridor.tag-bridge,
+.ideditor path.line.casing.tag-highway-pedestrian.tag-bridge,
+.ideditor path.line.casing.tag-highway-service.tag-bridge,
+.ideditor path.line.casing.tag-highway-track.tag-bridge,
+.ideditor path.line.casing.tag-highway-steps.tag-bridge,
+.ideditor path.line.casing.tag-highway-footway.tag-bridge,
+.ideditor path.line.casing.tag-highway-cycleway.tag-bridge,
+.ideditor path.line.casing.tag-highway-bridleway.tag-bridge {
+ stroke-width: 10;
+}
+
+.ideditor .low-zoom path.line.shadow.tag-railway.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-living_street.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-path.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-corridor.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-pedestrian.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-service.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-track.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-steps.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-footway.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-cycleway.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-bridleway.tag-bridge {
+ stroke-width: 14;
+}
+.ideditor .low-zoom path.line.casing.tag-railway.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-living_street.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-path.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-corridor.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-pedestrian.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-service.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-track.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-steps.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-footway.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-cycleway.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-bridleway.tag-bridge {
+ stroke-width: 6;
+}
+
+
+/* tunnels */
+.ideditor path.line.stroke.tag-tunnel,
+.ideditor path.line.stroke.tag-location-underground,
+.ideditor path.line.stroke.tag-location-underwater {
+ stroke-opacity: 0.3;
+}
+.ideditor path.line.casing.tag-tunnel,
+.ideditor path.line.casing.tag-location-underground,
+.ideditor path.line.stroke.tag-location-underwater {
+ stroke-opacity: 0.5;
+ stroke-linecap: butt;
+ stroke-dasharray: none;
+}
+
+
+/* embankments / cuttings */
+.ideditor path.line.shadow.tag-embankment,
+.ideditor path.line.shadow.tag-cutting {
+ stroke-width: 28;
+}
+.ideditor path.line.casing.tag-embankment,
+.ideditor path.line.casing.tag-cutting {
+ stroke-opacity: 0.5;
+ stroke: #000;
+ stroke-width: 22;
+ stroke-dasharray: 2, 4;
+ stroke-linecap: butt;
+}
+
+.ideditor .low-zoom path.line.shadow.tag-embankment,
+.ideditor .low-zoom path.line.shadow.tag-cutting {
+ stroke-width: 14;
+}
+.ideditor .low-zoom path.line.casing.tag-embankment,
+.ideditor .low-zoom path.line.casing.tag-cutting {
+ stroke-width: 10;
+}
+
+
+/* Surface - unpaved */
+.ideditor path.line.casing.tag-unpaved {
+ stroke: #ccc;
+ stroke-linecap: butt;
+ stroke-dasharray: 4, 4;
+}
+.ideditor .low-zoom path.line.casing.tag-unpaved {
+ stroke-dasharray: 3, 3;
+}
+.ideditor path.line.casing.tag-bridge.tag-unpaved {
+ stroke: #000;
+}
+/* Surface - semipaved */
+.ideditor path.line.casing.tag-semipaved {
+ stroke-linecap: butt;
+ stroke-dasharray: 6, 2;
+}
+.ideditor .low-zoom path.line.casing.tag-semipaved {
+ stroke-dasharray: 5, 2;
+}
+.ideditor path.line.casing.tag-bridge.tag-semipaved {
+ stroke: #000;
+}
+
+
+/* Status (e.g. proposed, abandoned) */
+.ideditor path.area.stroke.tag-status:not(.tag-status-disused),
+.ideditor path.line.stroke.tag-status:not(.tag-status-disused),
+.ideditor path.area.casing.tag-status:not(.tag-status-disused),
+.ideditor path.line.casing.tag-status:not(.tag-status-disused) {
+ stroke-linecap: butt;
+ stroke-dasharray: 7, 3;
+}
+.ideditor .low-zoom path.area.stroke.tag-status:not(.tag-status-disused),
+.ideditor .low-zoom path.line.stroke.tag-status:not(.tag-status-disused),
+.ideditor .low-zoom path.area.casing.tag-status:not(.tag-status-disused),
+.ideditor .low-zoom path.line.casing.tag-status:not(.tag-status-disused) {
+ stroke-dasharray: 5, 2;
+}
+
+/* Road Closed Status */
+.ideditor .preset-icon .icon.tag-highway.tag-status-construction {
+ color: #fc6c14;
+ fill: #fff;
+}
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 20;
+}
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 10;
+ stroke-linecap: butt;
+ stroke-dasharray: none
+}
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 8;
+ stroke-linecap: butt;
+ stroke-dasharray: 10, 10;
+}
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction,
+.ideditor .preset-icon-container path.line.stroke.tag-highway.tag-status.tag-status-construction {
+ stroke: #fff;
+}
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction,
+.ideditor .preset-icon-container path.line.casing.tag-highway.tag-status.tag-status-construction {
+ stroke: #fc6c14;
+}
+.ideditor .low-zoom path.line.shadow.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 16;
+}
+.ideditor .low-zoom path.line.casing.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 7;
+}
+.ideditor .low-zoom path.line.stroke.tag-highway.tag-status.tag-status-construction {
+ stroke-width: 5;
+ stroke-dasharray: 8, 8;
+}
+
+/** Closed Paths */
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-path,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-footway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-cycleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-bridleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-steps {
+ stroke-width: 15;
+}
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-path,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-footway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-cycleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-bridleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-steps {
+ stroke-width: 5;
+ stroke-linecap: butt;
+ stroke-dasharray: none
+}
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-path,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-footway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-cycleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-bridleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-steps {
+ stroke-width: 4;
+ stroke-linecap: butt;
+ stroke-dasharray: 10, 10;
+}
+
+/** Proposed Paths */
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-steps {
+ stroke-width: 15;
+}
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-steps {
+ stroke-width: 4.5;
+}
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-steps {
+ stroke-width: 10;
+}
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-steps {
+ stroke-width: 3;
+}
+
+/* Buildings */
+.ideditor path.stroke.tag-building {
+ stroke: rgb(224, 110, 95);
+}
+.ideditor path.fill.tag-building {
+ stroke: rgba(224, 110, 95, 0.3);
+ fill: rgba(224, 110, 95, 0.3);
+}
+/* Cursors */
+
+.ideditor .nope,
+.ideditor .nope * {
+ cursor: not-allowed !important;
+}
+
+.ideditor .map-in-map,
+.ideditor .main-map {
+ cursor: auto; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-grab.png") %>) 9 9, auto; /* FF */
+}
+
+.ideditor.mode-browse .point,
+.ideditor.mode-select .point,
+.ideditor.mode-select-data .point,
+.ideditor.mode-select-error .point,
+.ideditor.mode-select-note .point {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-point.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-browse .vertex,
+.ideditor.mode-select .vertex,
+.ideditor.mode-select-data .vertex,
+.ideditor.mode-select-error .vertex,
+.ideditor.mode-select-note .vertex {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-vertex.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-browse .line,
+.ideditor.mode-select .line,
+.ideditor.mode-select-data .line,
+.ideditor.mode-select-error .line,
+.ideditor.mode-select-note .line {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-line.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-browse .area,
+.ideditor.mode-select .area,
+.ideditor.mode-select-data .area,
+.ideditor.mode-select-error .area,
+.ideditor.mode-select-note .area {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-area.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-browse .midpoint,
+.ideditor.mode-select .midpoint,
+.ideditor.mode-select-data .midpoint,
+.ideditor.mode-select-error .midpoint,
+.ideditor.mode-select-note .midpoint {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-split.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-select .behavior-multiselect .point,
+.ideditor.mode-select .behavior-multiselect .vertex,
+.ideditor.mode-select .behavior-multiselect .line,
+.ideditor.mode-select .behavior-multiselect .area {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-add.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-select .behavior-multiselect .selected {
+ cursor: pointer; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-select-remove.png") %>), pointer; /* FF */
+}
+
+.ideditor.mode-add-preset .main-map,
+.ideditor.mode-draw-line .main-map,
+.ideditor.mode-draw-area .main-map,
+.ideditor.mode-add-line .main-map,
+.ideditor.mode-add-area .main-map,
+.ideditor.mode-drag-node .main-map,
+.ideditor.mode-drag-note .main-map {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw.png") %>) 9 9, crosshair; /* FF */
+}
+
+.ideditor.mode-draw-line .way.target,
+.ideditor.mode-draw-area .way.target,
+.ideditor.mode-add-line .way.target,
+.ideditor.mode-add-area .way.target,
+.ideditor.mode-drag-node .way.target {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw-connect-line.png") %>) 9 9, crosshair; /* FF */
+}
+
+.ideditor.mode-draw-line .vertex.target,
+.ideditor.mode-draw-area .vertex.target,
+.ideditor.mode-add-line .vertex.target,
+.ideditor.mode-add-area .vertex.target,
+.ideditor.mode-drag-node .vertex.target {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw-connect-vertex.png") %>) 9 9, crosshair; /* FF */
+}
+
+.ideditor.mode-add-point .main-map,
+.ideditor.mode-add-note .main-map,
+.ideditor.mode-browse.lasso .main-map,
+.ideditor.mode-browse.lasso .way,
+.ideditor.mode-browse.lasso .vertex,
+.ideditor.mode-browse.lasso .midpoint,
+.ideditor.mode-select.lasso .main-map,
+.ideditor.mode-select.lasso .way,
+.ideditor.mode-select.lasso .vertex,
+.ideditor.mode-select.lasso .midpoint {
+ cursor: crosshair; /* Opera */
+ cursor: url(<%= asset_path("iD/img/cursor-draw.png") %>) 9 9, crosshair; /* FF */
+}
+
+.ideditor.mode-browse .note,
+.ideditor.mode-select .note,
+.ideditor.mode-select-data .note,
+.ideditor.mode-select-error .note,
+.ideditor.mode-select-note .note {
+ cursor: pointer;
+}
+
+.ideditor.mode-browse .qaItem,
+.ideditor.mode-select .qaItem,
+.ideditor.mode-select-data .qaItem,
+.ideditor.mode-select-error .qaItem,
+.ideditor.mode-select-note .qaItem {
+ cursor: pointer;
+}
+
+/* turn restriction editor */
+.ideditor .turn rect,
+.ideditor .turn circle {
+ cursor: pointer;
+}
+/* photo viewer div */
+.ideditor .photoviewer {
+ position: relative;
+ flex-shrink: 0;
+ margin-bottom: 10px;
+ width: 330px;
+ height: 250px;
+ padding: 5px;
+ background-color: #fff;
+}
+.ideditor[dir='ltr'] .photoviewer {
+ margin-left: 10px;
+ margin-right: 2px;
+}
+.ideditor[dir='rtl'] .photoviewer {
+ margin-right: 10px;
+ margin-left: 2px;
+}
+
+@media screen and (min-width: 1600px) {
+ .ideditor .photoviewer {
+ width: 490px;
+ height: 370px;
+ }
+}
+
+.ideditor .photoviewer button.thumb-hide {
+ border-radius: 0;
+ padding: 5px;
+ position: absolute;
+ right: 5px;
+ top: 5px;
+ z-index: 50;
+}
+
+.ideditor .photoviewer button.resize-handle-xy {
+ border-radius: 0;
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 49;
+ cursor: nesw-resize;
+ height: 25px;
+ width: 25px;
+}
+
+.ideditor .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;
+}
+
+.ideditor .photoviewer button.resize-handle-y {
+ border-radius: 0;
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 48;
+ cursor: ns-resize;
+ height: 6px;
+ width: 100%;
+}
+
+
+.ideditor .photo-wrapper {
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+}
+
+.ideditor .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;
+}
+.ideditor .photo-attribution-dual {
+ display: flex;
+ justify-content: space-between;
+}
+
+.ideditor .photo-attribution a,
+.ideditor .photo-attribution a:visited,
+.ideditor .photo-attribution span {
+ padding: 4px 2px;
+ color: #fff;
+}
+
+/* markers and sequences */
+.ideditor .viewfield-group {
+ pointer-events: none;
+}
+.ideditor.mode-browse .viewfield-group,
+.ideditor.mode-select .viewfield-group,
+.ideditor.mode-select-data .viewfield-group,
+.ideditor.mode-select-error .viewfield-group,
+.ideditor.mode-select-note .viewfield-group {
+ pointer-events: visible;
+ cursor: pointer;
+}
+
+.ideditor .viewfield-group.currentView * {
+ fill: #ffee00 !important;
+}
+.ideditor .viewfield-group.hovered * {
+ fill: #eebb00 !important;
+}
+
+.ideditor .viewfield-group circle {
+ stroke: #555;
+ stroke-width: 1;
+ stroke-opacity: 0.4;
+ fill-opacity: 0.4;
+}
+.ideditor .viewfield-group.highlighted circle {
+ stroke: #222;
+ stroke-opacity: 0.9;
+ fill-opacity: 0.9;
+}
+.ideditor .viewfield-group.highlighted.hovered circle {
+ stroke: #222;
+ stroke-width: 2;
+ stroke-opacity: 0.9;
+ fill-opacity: 0.9;
+}
+.ideditor .viewfield-group.highlighted.currentView circle {
+ stroke: #222;
+ stroke-width: 2;
+ stroke-opacity: 1;
+ fill-opacity: 1;
+}
+
+.ideditor .viewfield-group .viewfield {
+ stroke-width: 0;
+ stroke: #222;
+ fill-opacity: 0.4;
+}
+.ideditor .viewfield-group.highlighted .viewfield {
+ stroke-width: 1;
+ fill-opacity: 0.8;
+}
+.ideditor .viewfield-group.highlighted.hovered .viewfield {
+ stroke-width: 1;
+ fill-opacity: 0.8;
+}
+.ideditor .viewfield-group.highlighted.currentView .viewfield {
+ stroke-width: 1;
+ fill-opacity: 0.9;
+}
+
+.ideditor .viewfield-group.currentView .viewfield-scale {
+ transform: scale(2,2);
+}
+
+.ideditor .sequence {
+ fill: none;
+ stroke-width: 2;
+ stroke-opacity: 0.4;
+}
+.ideditor .sequence.highlighted,
+.ideditor .sequence.currentView {
+ stroke-width: 4;
+ stroke-opacity: 1;
+}
+
+
+/* Streetside Image Layer */
+.ideditor .layer-streetside-images {
+ pointer-events: none;
+}
+.ideditor .layer-streetside-images .viewfield-group * {
+ fill: #0fffc4;
+}
+.ideditor .layer-streetside-images .sequence {
+ stroke: #0fffc4;
+ stroke-opacity: 0.85; /* bump opacity - only one per road */
+}
+
+/* Vegbilder Image Layer */
+.ideditor .layer-vegbilder {
+ pointer-events: none;
+}
+.ideditor .layer-vegbilder .viewfield-group * {
+ fill: #ed9300;
+}
+.ideditor .layer-vegbilder .sequence {
+ stroke: #ed9300;
+ stroke-opacity: 0.85; /* bump opacity - only one per road */
+}
+
+
+/* Mapillary Image Layer */
+.ideditor .layer-mapillary {
+ pointer-events: none;
+}
+.ideditor .layer-mapillary .viewfield-group * {
+ fill: #55ff22;
+}
+.ideditor .layer-mapillary .sequence {
+ stroke: #55ff22;
+}
+
+
+/* Mapillary Traffic Signs and Map Features Layers */
+.ideditor .layer-mapillary-detections {
+ pointer-events: none;
+}
+.ideditor .layer-mapillary-detections .icon-detected {
+ outline: 2px solid transparent;
+ pointer-events: visible;
+ cursor: pointer;
+ opacity: 0.75;
+}
+.ideditor .layer-mapillary-detections .icon-detected rect {
+ fill: none;
+}
+.ideditor .layer-mapillary-detections .icon-detected:active {
+ opacity: 1;
+}
+.ideditor .layer-mapillary-detections .icon-detected:active rect {
+ outline: 3px solid rgba(255, 238, 0, 0.6);
+}
+@media (hover: hover) {
+ .ideditor .layer-mapillary-detections .icon-detected:hover {
+ opacity: 1;
+ }
+ .ideditor .layer-mapillary-detections .icon-detected:hover rect {
+ outline: 3px solid rgba(255, 238, 0, 0.6);
+ }
+}
+.ideditor .layer-mapillary-detections .icon-detected.currentView {
+ opacity: 1;
+}
+.ideditor .layer-mapillary-detections .icon-detected.currentView rect {
+ outline: 3px solid rgba(255, 238, 0, 1);
+}
+
+
+/* KartaView Image Layer */
+.ideditor .layer-kartaview {
+ pointer-events: none;
+}
+.ideditor .layer-kartaview .viewfield-group * {
+ fill: #20c4ff;
+}
+.ideditor .layer-kartaview .sequence {
+ stroke: #20c4ff;
+}
+
+
+/* Mapilio Image Layer */
+.ideditor .layer-mapilio {
+ pointer-events: none;
+}
+.ideditor .layer-mapilio .viewfield-group * {
+ fill: #0056f1;
+ stroke: #ffffff;
+ stroke-opacity: .6;
+ fill-opacity: .6;
+}
+.ideditor .layer-mapilio .sequence {
+ stroke: #0056f1;
+}
+.ideditor .photo-controls-mapilio {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 4px;
+}
+.ideditor .photo-controls-mapilio button {
+ padding:0 6px;
+ pointer-events: initial;
+}
+.ideditor .mapilio-wrapper {
+ position: relative;
+ background-color: #000;
+ background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+ background-position: center;
+ background-repeat: no-repeat;
+}
+.ideditor #ideditor-viewer-mapilio-simple-wrap {
+ height: 100%;
+}
+.ideditor #ideditor-viewer-mapilio-simple {
+ width: 100%;
+ height: 100%;
+ transform-origin: 0 0;
+}
+.ideditor #ideditor-viewer-mapilio-simple img {
+ width: 100%;
+ height: 100%;
+ -o-object-fit: cover;
+ object-fit: cover;
+ overflow: hidden
+}
+
+
+/* Streetside Viewer (pannellum) */
+.ideditor .ms-wrapper .photo-attribution .image-link {
+ display: block;
+}
+.ideditor .ms-wrapper .photo-attribution .attribution-row {
+ display: flex;
+ flex-flow: row nowrap;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 5px;
+}
+.ideditor .ms-wrapper .photo-attribution .image-view-link {
+ text-align: left;
+ margin: 0 5px;
+}
+.ideditor .ms-wrapper .photo-attribution .image-report-link {
+ text-align: right;
+}
+
+.ideditor .ms-wrapper .photo-attribution a:active {
+ color: #0fffc4;
+}
+@media (hover: hover) {
+ .ideditor .ms-wrapper .photo-attribution a:hover {
+ color: #0fffc4;
+ }
+}
+
+.ideditor .ms-wrapper .pnlm-compass.pnlm-control,
+.ideditor .vegbilder-wrapper .pnlm-compass.pnlm-control {
+ width: 26px;
+ height: 26px;
+ left: 4px;
+ top: 60px;
+ background-size: contain;
+ background-repeat: no-repeat no-repeat;
+}
+
+.ideditor label.streetside-hires {
+ cursor: pointer;
+}
+.ideditor .streetside-hires span {
+ margin-top: 2px;
+}
+.ideditor .streetside-hires input[type="checkbox"] {
+ float: left;
+ width: 12px;
+ height: 12px;
+ margin: 0 5px;
+}
+
+.ideditor .pnlm-zoom-controls {
+ margin-top: 6px;
+}
+
+
+/* Mapillary viewer */
+.ideditor #ideditor-mly .domRenderer .TagSymbol {
+ font-size: 10px;
+ background-color: rgba(0,0,0,0.4);
+ padding: 0 4px;
+ border-radius: 4px;
+ top: -25px;
+}
+
+.ideditor .mly-wrapper .mapillary-attribution-container {
+ display: flex;
+ align-items: center;
+}
+
+.ideditor .mly-wrapper .mapillary-attribution-container .mapillary-attribution-icon-container {
+ display: flex;
+ align-items: center;
+}
+
+.ideditor .mly-wrapper .mapillary-attribution-container .mapillary-attribution-username {
+ display: none;
+}
+
+.ideditor .mly-wrapper .mapillary-attribution-container .mapillary-attribution-date {
+ margin-right: 6px;
+}
+
+/* KartaView viewer */
+.ideditor .kartaview-wrapper {
+ position: relative;
+ background-color: #000;
+ background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+ background-position: center;
+ background-repeat: no-repeat;
+}
+
+.ideditor .kartaview-wrapper img {
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ -o-object-fit: cover;
+ object-fit: cover;
+}
+
+.ideditor .kartaview-wrapper .photo-attribution a:active {
+ color: #20c4ff;
+}
+@media (hover: hover) {
+ .ideditor .kartaview-wrapper .photo-attribution a:hover {
+ color: #20c4ff;
+ }
+}
+
+.ideditor .kartaview-image-wrap {
+ width: 100%;
+ height: 100%;
+ transform-origin: 0 0;
+}
+
+.ideditor .photo-wrapper {
+ position: relative;
+ background-color: #000;
+}
+
+.ideditor .photoviewer .plane-frame {
+ display: block;
+ overflow: hidden;
+ height: 100%;
+ width: 100%;
+ background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+ background-position: center;
+ background-repeat: no-repeat;
+}
+
+.ideditor .photoviewer .plane-frame > img.plane-photo{
+ width: auto;
+ height: 100%;
+ transform-origin: 0 0;
+}
+
+/* photo-controls (step forward, back, rotate) */
+.ideditor .photo-controls-wrap {
+ text-align: center;
+ position: absolute;
+ top: 10px;
+ width: 100%;
+ z-index: 10;
+ pointer-events: none;
+}
+
+.ideditor .photo-controls {
+ display: inline-block;
+ z-index: 10;
+ pointer-events: initial;
+}
+
+.ideditor .photo-controls button,
+.ideditor .photo-controls button:focus {
+ height: 18px;
+ width: 18px;
+ line-height: 18px;
+ background: rgba(0,0,0,0.65);
+ color: #eee;
+ border-radius: 0;
+}
+.ideditor .photo-controls button:first-of-type {
+ border-radius: 3px 0 0 3px;
+}
+.ideditor .photo-controls button:last-of-type {
+ border-radius: 0 3px 3px 0;
+}
+.ideditor .photo-controls button:active {
+ background: rgba(0,0,0,0.85);
+ color: #fff;
+}
+@media (hover: hover) {
+ .ideditor .photo-controls button:hover {
+ background: rgba(0,0,0,0.85);
+ color: #fff;
+ }
+}
+
+/* local georeferenced photos */
+.ideditor .layer-local-photos {
+ pointer-events: none;
+}
+.ideditor .layer-local-photos .viewfield-group * {
+ fill: #ed00d9;
+}
+.ideditor .local-photos {
+ display: flex;
+}
+.ideditor .local-photos > div {
+ width: 50%;
+}
+.ideditor .local-photos > div:first-child {
+ margin-right: 20px;
+}
+
+.ideditor .list-local-photos {
+ max-height: 40vh;
+ overflow-y: scroll;
+ overflow-x: auto;
+ /* workaround for something like "overflow-x: visible"
+ see https://stackoverflow.com/a/39554003 */
+ margin-left: -100px;
+ padding-left: 100px;
+ margin-top: -20px;
+ padding-top: 20px;
+ min-height: 100px;
+}
+.ideditor .list-local-photos::-webkit-scrollbar {
+ border-left: none;
+}
+.ideditor .list-local-photos li {
+ list-style: none;
+ display: flex;
+ justify-content: space-between;
+ height: 30px;
+}
+.ideditor .list-local-photos span.filename {
+ display: block;
+ width: 100%;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ line-height: 30px;
+ padding-left: 8px;
+ border-bottom: 1px solid #ccc;
+ border-left: 1px solid #ccc;
+ border-right: 1px solid #ccc;
+}
+.ideditor .list-local-photos li:first-child span.filename {
+ border-top: 1px solid #ccc;
+ border-top-left-radius: 4px;
+}
+.ideditor .list-local-photos li:first-child button {
+ border-top: 1px solid #ccc;
+}
+.ideditor .list-local-photos li:first-child button.remove {
+ border-top-right-radius: 4px;
+}
+.ideditor .list-local-photos li:last-child span.filename {
+ border-bottom-left-radius: 4px;
+}
+.ideditor .list-local-photos li:last-child button.remove {
+ border-bottom-right-radius: 4px;
+}
+.ideditor .list-local-photos li.invalid button.zoom-to-data {
+ display: none;
+}
+.ideditor .list-local-photos li button.no-geolocation {
+ display: none;
+}
+.ideditor .list-local-photos li.invalid button.no-geolocation {
+ display: block;
+ color: red;
+}
+.ideditor .list-local-photos .placeholder div {
+ display: block;
+ height: 40px;
+ width: 40px;
+ background-position: center;
+ background-size: cover;
+ background-repeat: no-repeat;
+ background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+ filter: invert(1);
+}
+.ideditor .local-photos label.button {
+ background: #7092ff;
+ color: #fff;
+ font-weight: bold;
+ padding: 10px 25px;
+ text-align: center;
+ font-size: 12px;
+ display: inline-block;
+ border-radius: 4px;
+ cursor: pointer;
+}
+
+/* OSM Notes and QA Layers */
+
+.ideditor .qa-header-icon .qaItem-fill,
+.ideditor .layer-keepRight .qaItem .qaItem-fill,
+.ideditor .layer-improveOSM .qaItem .qaItem-fill,
+.ideditor .layer-osmose .qaItem .qaItem-fill {
+ stroke: #333;
+ stroke-width: 1.3px; /* NOTE: likely a better way to scale the icon stroke */
+}
+
+.ideditor .note-header-icon .note-fill,
+.ideditor .layer-notes .note .note-fill {
+ color: #f30;
+ stroke: #333;
+ stroke-width: 40px;
+}
+.ideditor .note-header-icon.new .note-fill,
+.ideditor .layer-notes .note.new .note-fill {
+ color: #fe0;
+ stroke: #333;
+ stroke-width: 40px;
+}
+.ideditor .note-header-icon.closed .note-fill,
+.ideditor .layer-notes .note.closed .note-fill {
+ color: #5d0;
+ stroke: #333;
+ stroke-width: 40px;
+}
+
+/* slight adjustments to preset icon for note icons */
+.ideditor .note-header-icon .preset-icon-28 {
+ top: 18px;
+}
+.ideditor .note-header-icon .note-icon-annotation {
+ position: absolute;
+ top: 22px;
+ left: 22px;
+ margin: auto;
+}
+.ideditor .note-header-icon .note-icon-annotation .icon {
+ width: 15px;
+ height: 15px;
+}
+
+/* adjustment to center QA icons */
+.ideditor .qa-header-icon .preset-icon-28 {
+ top: auto;
+ left: auto;
+}
+.ideditor .qa-header-icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+/* Keep Right Issues
+------------------------------------------------------- */
+.ideditor .keepRight.itemType-20,
+.ideditor .keepRight.itemType-40,
+.ideditor .keepRight.itemType-210,
+.ideditor .keepRight.itemType-270,
+.ideditor .keepRight.itemType-310,
+.ideditor .keepRight.itemType-320,
+.ideditor .keepRight.itemType-350 { /* improper bridge tag */
+ color: #ff9;
+}
+
+.ideditor .keepRight.itemType-50 { /* almost junctions */
+ color: #88f;
+}
+
+.ideditor .keepRight.itemType-60,
+.ideditor .keepRight.itemType-70,
+.ideditor .keepRight.itemType-90,
+.ideditor .keepRight.itemType-100,
+.ideditor .keepRight.itemType-110,
+.ideditor .keepRight.itemType-150,
+.ideditor .keepRight.itemType-220,
+.ideditor .keepRight.itemType-380 { /* non-physical sport tag */
+ color: #5d0;
+}
+
+.ideditor .keepRight.itemType-130 { /* disconnected ways */
+ color: #fa3;
+}
+
+.ideditor .keepRight.itemType-170 { /* FIXME tag */
+ color: #ff0;
+}
+
+.ideditor .keepRight.itemType-190 { /* intersection without junction */
+ color: #f33;
+}
+
+.ideditor .keepRight.itemType-200 { /* overlapping ways */
+ color: #fdbf6f;
+}
+
+.ideditor .keepRight.itemType-160,
+.ideditor .keepRight.itemType-230 { /* layer conflict */
+ color: #b60;
+}
+
+.ideditor .keepRight.itemType-280 { /* boundary issues */
+ color: #5f47a0;
+}
+
+.ideditor .keepRight.itemType-180,
+.ideditor .keepRight.itemType-290 { /* turn restriction issues */
+ color: #ace;
+}
+
+.ideditor .keepRight.itemType-300,
+.ideditor .keepRight.itemType-390 { /* missing tracktype */
+ color: #090;
+}
+
+.ideditor .keepRight.itemType-360,
+.ideditor .keepRight.itemType-370,
+.ideditor .keepRight.itemType-410 { /* website issues */
+ color: #f9b;
+}
+
+.ideditor .keepRight.itemType-120,
+.ideditor .keepRight.itemType-400 { /* geometry / turn angles */
+ color: #c35;
+}
+
+/* ImproveOSM Issues
+------------------------------------------------------- */
+
+.ideditor .improveOSM.itemType-ow { /* missing one way */
+ color: #1E90FF;
+}
+
+.ideditor .improveOSM.itemType-mr-road { /* missing road */
+ color: #B452CD;
+}
+.ideditor .improveOSM.itemType-mr-path { /* missing path */
+ color: #A0522D;
+}
+.ideditor .improveOSM.itemType-mr-parking { /* missing parking */
+ color: #EEEE00;
+}
+.ideditor .improveOSM.itemType-mr-both { /* missing road+parking */
+ color: #FFA500;
+}
+
+.ideditor .improveOSM.itemType-tr { /* missing turn restriction */
+ color: #EC1C24;
+}
+
+/* Custom Map Data (geojson, gpx, kml, vector tile) */
+.ideditor .layer-mapdata {
+ pointer-events: none;
+}
+
+.ideditor .layer-mapdata path.shadow {
+ pointer-events: stroke;
+ stroke: #f6634f;
+ stroke-width: 16;
+ stroke-opacity: 0;
+ fill: none;
+}
+.ideditor .layer-mapdata path.MultiPoint.shadow,
+.ideditor .layer-mapdata path.Point.shadow {
+ pointer-events: fill;
+ fill: #f6634f;
+ fill-opacity: 0;
+}
+.ideditor .layer-mapdata path.shadow.hover:not(.selected) {
+ stroke-opacity: 0.4;
+}
+.ideditor .layer-mapdata path.shadow.selected {
+ stroke-opacity: 0.7;
+}
+
+.ideditor .layer-mapdata path.stroke {
+ stroke: #ff26d4;
+ stroke-width: 2;
+ fill: none;
+}
+
+.ideditor .layer-mapdata path.fill {
+ stroke-width: 0;
+ stroke-opacity: 0.3;
+ stroke: #ff26d4;
+ fill: #ff26d4;
+ fill-opacity: 0.3;
+ fill-rule: evenodd;
+}
+
+.ideditor .layer-mapdata text.label-halo,
+.ideditor .layer-mapdata text.label {
+ font-size: 10px;
+ font-weight: bold;
+ dominant-baseline: middle;
+}
+.ideditor .layer-mapdata text.label {
+ fill: #ddd;
+}
+.ideditor .layer-mapdata text.label.hover,
+.ideditor .layer-mapdata text.label.selected {
+ fill: #fff;
+}
+.ideditor .layer-mapdata text.label-halo {
+ opacity: 0.7;
+ stroke: #000;
+ stroke-width: 5px;
+ stroke-miterlimit: 1;
+}
+/* Fill Styles */
+
+.ideditor .low-zoom.fill-wireframe path.stroke,
+.ideditor .fill-wireframe path.stroke {
+ stroke-width: 1 !important;
+ stroke-opacity: 0.5 !important;
+ stroke-dasharray: none !important;
+ fill: none !important;
+}
+.ideditor .low-zoom.fill-wireframe .layer-mapdata path.stroke,
+.ideditor .fill-wireframe .layer-mapdata path.stroke {
+ stroke-width: 2 !important;
+ stroke-opacity: 1 !important;
+}
+
+.ideditor .low-zoom.fill-wireframe path.shadow,
+.ideditor .fill-wireframe path.shadow {
+ stroke-width: 12;
+}
+
+.ideditor .fill-wireframe path.shadow.related:not(.selected),
+.ideditor .fill-wireframe path.shadow.hover:not(.selected) {
+ stroke-opacity: 0.4;
+}
+.ideditor .fill-wireframe path.shadow.selected {
+ stroke-opacity: 0.6;
+}
+
+.ideditor .fill-wireframe .point,
+.ideditor .fill-wireframe .areaicon,
+.ideditor .fill-wireframe .areaicon-halo,
+.ideditor .fill-wireframe path.casing,
+.ideditor .fill-wireframe path.fill,
+.ideditor .fill-wireframe path.oneway {
+ display: none !important;
+}
+
+.ideditor .fill-partial path.area.fill {
+ fill-opacity: 0;
+ stroke-width: 60px;
+ pointer-events: none;
+}
+.ideditor .fill-partial path.area.fill.tag-building_part {
+ stroke-width: 40px;
+}
+.ideditor .fill-partial path.area.fill.tag-indoor {
+ stroke-width: 20px;
+}
+.ideditor.mode-browse .fill-partial path.area.fill,
+.ideditor.mode-select .fill-partial path.area.fill,
+.ideditor.mode-select-data .fill-partial path.area.fill,
+.ideditor.mode-select-error .fill-partial path.area.fill,
+.ideditor.mode-select-note .fill-partial path.area.fill {
+ pointer-events: visibleStroke;
+}
+.ideditor svg.preset-icon-category-border path {
+ stroke-width: 1;
+ stroke: rgb(170, 170, 170);
+ fill: rgba(170, 170, 170, 0.3);
+}
+
+.ideditor .preset-category-barrier svg.preset-icon-category-border path {
+ stroke: rgb(200, 144, 144);
+ fill: rgba(200, 144, 144, 0.3);
+}
+
+.ideditor .preset-category-building svg.preset-icon-category-border path {
+ stroke: rgb(224, 110, 95);
+ fill: rgba(224, 110, 95, 0.3);
+}
+
+.ideditor .preset-category-landuse svg.preset-icon-category-border path {
+ stroke: rgb(196, 189, 25);
+ fill: rgba(196, 189, 25, 0.3);
+}
+
+.ideditor .preset-category-natural svg.preset-icon-category-border path,
+.ideditor .preset-category-playground svg.preset-icon-category-border path,
+.ideditor .preset-category-golf svg.preset-icon-category-border path {
+ stroke: rgb(140, 208, 95);
+ fill: rgba(140, 208, 95, 0.3);
+}
+
+.ideditor .preset-category-water svg.preset-icon-category-border path,
+.ideditor .preset-category-waterway svg.preset-icon-category-border path {
+ stroke: rgb(119, 211, 222);
+ fill: rgba(119, 211, 222, 0.3);
+}
+
+.ideditor .preset-category-utility svg.preset-icon-category-border path {
+ stroke: rgb(125, 125, 125);
+ fill: rgba(219, 219, 125, 0.3);
+}
+
+.ideditor .preset-category-path svg.preset-icon-category-border path {
+ stroke: rgb(221, 221, 204);
+ fill: rgba(221, 221, 204, 0.3);
+}
+
+.ideditor .preset-category-road_service svg.preset-icon-category-border path,
+.ideditor .preset-category-road_minor svg.preset-icon-category-border path,
+.ideditor .preset-category-road_major svg.preset-icon-category-border path {
+ stroke: #999;
+}
+
+.ideditor .preset-category-rail svg.preset-icon-category-border path {
+ stroke: #555;
+}
+/* Basics
+------------------------------------------------------- */
+/* the root element of iD */
+.ideditor {
+ height: 100%;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ border: 0;
+ overflow: hidden;
+
+ /* Establish a local stacking context so all elements within iD are on the
+ same layer relative to elements outside iD - #7457.
+ https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
+ */
+ position: relative;
+ z-index: 0;
+
+ font: normal 12px/1.6667 ui-sans-serif, "-apple-system", BlinkMacSystemFont,
+ "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+ "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
+ sans-serif;
+ color: #333;
+
+ touch-action: none;
+ -ms-user-select: none;
+ -ms-content-zooming: none;
+}
+.ideditor div {
+ /* disable pinch-to-zoom of the UI on touch devices */
+ touch-action: pan-x pan-y;
+}
+
+.ideditor .main-content {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ height: 100%;
+ touch-action: none;
+}
+
+.ideditor .main-content.active {
+ filter: none !important;
+ transition-duration: 200ms;
+}
+
+.ideditor .main-content.inactive {
+ filter: grayscale(80%) brightness(80%);
+ transition-duration: 200ms;
+}
+
+.ideditor #ideditor-defs {
+ /* Can't be display: none or the clippaths are ignored. */
+ position: absolute;
+ width: 0;
+ height: 0;
+}
+
+.ideditor div, .ideditor textarea, .ideditor label, .ideditor input, .ideditor form, .ideditor span, .ideditor ul, .ideditor li, .ideditor ol, .ideditor a, .ideditor button, .ideditor h1, .ideditor h2, .ideditor h3, .ideditor h4, .ideditor h5, .ideditor p, .ideditor img {
+ box-sizing: border-box;
+}
+
+.ideditor a, .ideditor button, .ideditor input, .ideditor textarea {
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+ -webkit-touch-callout: none;
+}
+
+.ideditor ul li {
+ list-style: none;
+}
+
+.ideditor a,
+.ideditor button {
+ cursor: pointer;
+}
+
+.ideditor h2 {
+ font-size: 25px;
+ line-height: 1.25;
+ font-weight: bold;
+ margin-bottom: 20px;
+}
+.ideditor .header h2 {
+ font-size: 20px;
+ line-height: 1.25;
+ font-weight: bold;
+ margin-bottom: 0px;
+}
+
+.ideditor h3:last-child,
+.ideditor h4:last-child { margin-bottom: 0;}
+
+.ideditor h3 {
+ font-size: 16px;
+ line-height: 1.25;
+ font-weight: bold;
+ margin-bottom: 10px;
+}
+.ideditor h4, .ideditor h5 {
+ font-size: 12px;
+ font-weight: bold;
+ padding-bottom: 10px;
+}
+
+.ideditor button:focus,
+.ideditor textarea:focus,
+.ideditor input[type=text]:focus,
+.ideditor input[type=search]:focus,
+.ideditor input[type=number]:focus,
+.ideditor input[type=url]:focus,
+.ideditor input[type=tel]:focus,
+.ideditor input[type=email]:focus,
+.ideditor input[type=date]:focus {
+ outline-color: transparent;
+ outline-style: none;
+}
+
+.ideditor ::-moz-placeholder {
+ color: #aaa;
+ opacity: 1; /* Firefox */
+}
+
+.ideditor ::placeholder {
+ color: #aaa;
+ opacity: 1; /* Firefox */
+}
+
+.ideditor p {
+ font-size: 12px;
+ margin: 0;
+ padding: 0;
+}
+.ideditor p:last-child {
+ padding-bottom: 0;
+}
+.ideditor em {
+ font-style: italic;
+}
+.ideditor strong {
+ font-weight: bold;
+}
+.ideditor a,
+.ideditor a:visited,
+.ideditor a:active {
+ color: #7092ff;
+}
+.ideditor a:focus {
+ color: #597be7;
+}
+@media (hover: hover) {
+ .ideditor a:hover {
+ color: #597be7;
+ }
+}
+.ideditor kbd {
+ display: inline-block;
+ text-align: center;
+ padding: 3px 5px;
+ font-size: 11px;
+ line-height: 1.3;
+ min-width: 0.9em;
+ vertical-align: baseline;
+ background-color: #fcfcfc;
+ border: solid 1px #ccc;
+ margin: 0 2px;
+ border-bottom-color: #bbb;
+ border-radius: 3px;
+ box-shadow: inset 0 -1px 0 #bbb;
+}
+
+.ideditor code {
+ font-family: ui-monospace, monospace, monospace;
+ background: rgba(174, 174, 174, 0.25);
+ padding: 1px 2px;
+}
+
+/* Forms
+------------------------------------------------------- */
+.ideditor textarea,
+.ideditor input[type=text],
+.ideditor input[type=search],
+.ideditor input[type=number],
+.ideditor input[type=url],
+.ideditor input[type=tel],
+.ideditor input[type=email],
+.ideditor input[type=date] {
+ background-color: #fff;
+ color: #333;
+ border: 1px solid #ccc;
+ padding: 0px 10px 0px 10px;
+ border-radius: 4px;
+ text-overflow: ellipsis;
+ overflow: auto;
+}
+.ideditor input[type=text],
+.ideditor input[type=search],
+.ideditor input[type=number],
+.ideditor input[type=url],
+.ideditor input[type=tel],
+.ideditor input[type=email],
+.ideditor input[type=date],
+.ideditor input[type=color] {
+ /* need this since line-height interpretation may vary by font or browser */
+ height: 2.585em;
+}
+.ideditor textarea {
+ min-height: 2em;
+ padding-top: 5px;
+ padding-bottom: 5px;
+ resize: vertical;
+ font:normal 12px/20px "-apple-system", BlinkMacSystemFont,
+ "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+ "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
+ sans-serif;
+}
+
+.ideditor textarea:active,
+.ideditor input:active,
+.ideditor textarea:focus,
+.ideditor input:focus {
+ background-color: #f1f1f1;
+}
+
+.ideditor textarea.disabled,
+.ideditor input.disabled {
+ color: #777;
+ background-color: #eee;
+ cursor: not-allowed;
+}
+
+.ideditor input[type="checkbox"],
+.ideditor input[type="radio"] {
+ width: 14px;
+ height: 14px;
+ margin-right: 6px;
+ cursor: pointer;
+ vertical-align: middle;
+}
+.ideditor[dir='rtl'] input[type="checkbox"],
+.ideditor[dir='rtl'] input[type="radio"] {
+ margin-left: 6px;
+ margin-right: 0;
+}
+
+.ideditor input.mixed::-moz-placeholder, .ideditor textarea.mixed::-moz-placeholder {
+ font-style: italic;
+}
+
+.ideditor input.mixed::placeholder,
+.ideditor textarea.mixed::placeholder {
+ font-style: italic;
+}
+
+/* keytraps need to be invisible yet not be display:none or visibility:hidden */
+.ideditor .keytrap {
+ width: 0;
+ height: 0;
+ padding: 0;
+ margin: 0;
+ border: 0;
+}
+
+/* tables */
+.ideditor table {
+ background-color: #fff;
+ border-collapse: collapse;
+ width: 100%;
+ border-spacing: 0;
+}
+.ideditor table th {
+ text-align: left;
+}
+.ideditor table.tags, .ideditor table.tags td, .ideditor table.tags th {
+ border: 1px solid #ccc;
+ padding: 4px;
+}
+
+.ideditor ::-ms-clear {
+ display: none;
+}
+
+/* Grid
+------------------------------------------------------- */
+.ideditor .col6 { float: left; width: 50.0000%; max-width: 600px; }
+.ideditor .col12 { float: left; width: 100.0000%; }
+
+
+/* Utility Classes
+------------------------------------------------------- */
+.ideditor .fillL {
+ background: #fff;
+ color: #333;
+}
+.ideditor .fillL2 {
+ background: #f6f6f6;
+ color: #333;
+}
+.ideditor .fillL3 {
+ background: #ececec;
+ color: #333;
+}
+.ideditor .fillD {
+ background: rgba(0,0,0,.5);
+ color: #fff;
+}
+.ideditor .fillD2 {
+ background: rgba(0,0,0,.75);
+ color: #fff;
+}
+
+.ideditor .fl { float: left;}
+.ideditor .fr { float: right;}
+.ideditor .al { left: 0; }
+.ideditor .ar { right: 0; }
+
+.ideditor input.hide,
+.ideditor textarea.hide,
+.ideditor div.hide,
+.ideditor form.hide,
+.ideditor button.hide,
+.ideditor a.hide,
+.ideditor ul.hide,
+.ideditor li.hide {
+ display: none;
+}
+
+.ideditor .deemphasize {
+ color: #a9a9a9;
+}
+.ideditor .content {
+ box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.25);
+}
+.ideditor .loading {
+ background: url(<%= asset_path("iD/img/loader_bg.gif") %>);
+ background-size: 5px 5px;
+}
+
+
+/* Buttons
+------------------------------------------------------- */
+.ideditor button {
+ text-align: center;
+ border: 0;
+ background: #fff;
+ color: #333;
+ font-size: 12px;
+ display: inline-block;
+ border-radius: 4px;
+}
+
+.ideditor button:focus,
+.ideditor button:active,
+.ideditor button.hover {
+ background-color: #ececec;
+}
+@media (hover: hover) {
+ .ideditor button:hover {
+ background-color: #ececec;
+ }
+}
+.ideditor button.active {
+ background: #7092ff;
+}
+.ideditor button.disabled {
+ background-color: rgba(255,255,255,.25);
+ color: rgba(0,0,0,.4);
+ cursor: not-allowed;
+}
+
+.ideditor .joined > * {
+ border-radius: 0;
+ border-right: 1px solid rgba(0,0,0,.5);
+}
+.ideditor[dir='rtl'] .joined > * {
+ border-left: 1px solid rgba(0,0,0,.5);
+ border-right: none;
+}
+
+.ideditor .fillL .joined > * {
+ border-right: 1px solid #fff;
+}
+.ideditor .joined > *:first-child {
+ border-radius: 4px 0 0 4px;
+}
+.ideditor[dir='rtl'] .joined > *:first-child {
+ border-radius: 0 4px 4px 0;
+}
+.ideditor .joined > *:last-child {
+ border-right-width: 0;
+ border-radius: 0 4px 4px 0;
+}
+.ideditor[dir='rtl'] .joined > *.bar-button:last-child {
+ border-radius: 4px 0 0 4px;
+}
+
+
+/* Action buttons */
+.ideditor button.action {
projects / rails.git / blobdiff