mapeo-id-bmf/dist/iD.css

iD Editor for osm-p2p & mapeo-desktop changed to meet requirements of Bruno Manser Fonds

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a { text-decoration: none;}
/*
 * 1. Corrects font family not being inherited in all browsers.
 * 2. Corrects font size not being inherited in all browsers.
 * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
 */

button,
input,
select,
textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 2 */
    margin: 0; /* 3 */
    padding: 0;
}

/*
 * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}

/* Hide default number spinner controls */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
display: none;
}

/*
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
}

/*
 * Re-set default cursor for disabled elements.
 */

button[disabled],
input[disabled] {
    cursor: default;
}

/*
 * 1. Addresses box sizing set to `content-box` in IE 8/9.
 * 2. Removes excess padding in IE 8/9.
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}

/*
 * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; /* 2 */
    box-sizing: border-box;
}

/*
 * Removes inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/*
 * Removes inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*
** Markup free clearing
** Details: http://www.positioniseverything.net/easyclearing.html
*/
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}
/* base styles */
.layer-osm path:not(.oneway-marker-path) {                /* IE/Edge needs :not(.oneway) */
    fill: none;
}
.layer-osm path.viewfield-marker-path {                   /* IE/Edge rule for <use> marker style */
    fill: #333;
    fill-opacity: 0.75;
    stroke: #fff;
    stroke-width: 0.5px;
    stroke-opacity: 0.75;
}
.fill-wireframe .layer-osm path.viewfield-marker-path {   /* IE/Edge rule for <use> marker style */
    fill: none;
}

/* the above fill: none rule affects paths in <use> shadow dom only in Firefox */
.layer-osm use.icon path { fill: #333; }                       /* FF svg Maki icons */
.layer-osm .turn use path { fill: #000; }                      /* FF turn restriction icons */
#turn-only-shape2, #turn-only-u-shape2 { fill: #7092ff; }      /* FF turn-only, turn-only-u */
#turn-no-shape2, #turn-no-u-shape2     { fill: #e06d5f; }      /* FF turn-no, turn-no-u */
#turn-yes-shape2, #turn-yes-u-shape2   { fill: #8cd05f; }      /* FF turn-yes, turn-yes-u */


/* No interactivity except what we specifically allow */
.layer-osm * {
    pointer-events: none;
}

.lasso #map {
    pointer-events: visibleStroke;
}


/* `.target` objects are interactive */
/* They can be picked up, clicked, hovered, or things can connect to them */
.node.target {
    pointer-events: fill;
    fill-opacity: 0.8;
    fill: currentColor;
    stroke: none;
}

.way.target {
    pointer-events: stroke;
    fill: none;
    stroke-width: 12;
    stroke-opacity: 0.8;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* `.target-nope` objects are explicitly forbidden to join to */
.surface:not(.nope-disabled) .node.target.target-nope,
.surface:not(.nope-disabled) .way.target.target-nope {
    cursor: not-allowed;
}


/* `.active` objects (currently being drawn or dragged) are not interactive */
/* This is important to allow the events to drop through to whatever is */
/* below them on the map, so you can still hover and connect to other things. */
.layer-osm .active {
    pointer-events: none !important;
}


/* points */

g.point .stroke {
    stroke: #444;
    stroke-width: 1;
    fill: #fff;
}

g.point .shadow {
    fill: none;
    stroke: #f6634f;
    stroke-width: 16;
    stroke-opacity: 0;
}

g.point.related:not(.selected) .shadow,
g.point.hover:not(.selected) .shadow {
    stroke-opacity: 0.5;
}

g.point.selected .shadow {
    stroke-opacity: 0.7;
}

g.point ellipse.stroke {
    display: none;
}

.mode-drag-node g.point.active ellipse.stroke {
    display: block;
}


/* vertices and midpoints */

g.vertex .fill {
    fill: #000;
}

g.vertex .stroke {
    stroke: #666;
    stroke-width: 1;
    fill: white;
}

g.vertex.shared .stroke {
    fill: #bbb;
}

g.midpoint .fill {
    fill: #eee;
    stroke: #444;
    stroke-opacity: .6;
    opacity: .7;
}

g.vertex .shadow,
g.midpoint .shadow {
    stroke-width: 6;
    fill: #f6634f;
    fill-opacity: 0;
}

g.vertex.related:not(.selected) .shadow,
g.vertex.hover:not(.selected) .shadow,
g.midpoint.related:not(.selected) .shadow,
g.midpoint.hover:not(.selected) .shadow {
    fill-opacity: 0.5;
}

g.vertex.selected .shadow {
    fill-opacity: 0.7;
}


/* lines */

.preset-icon .icon.other-line {
    color: #fff;
    fill: #777;
}

path.line {
    stroke-linecap: round;
    stroke-linejoin: round;
}

path.stroke {
    stroke: #000;
    stroke-width: 4;
}

path.shadow {
    stroke: #f6634f;
    stroke-width: 16;
    stroke-opacity: 0;
}

path.shadow.related:not(.selected),
path.shadow.hover:not(.selected) {
    stroke-opacity: 0.4;
}

path.shadow.selected {
    stroke-opacity: 0.7;
}

path.line.stroke {
    stroke: #fff;
    stroke-width: 2;
}


/* Labels / Markers */

text {
    font-size: 10px;
    color: #222;
    opacity: 1;
}

.oneway .textpath.tag-waterway {
    fill: #002F35;
}

.onewaygroup path.oneway,
.viewfieldgroup path.viewfield {
    stroke-width: 6px;
}

text.arealabel-halo,
text.linelabel-halo,
text.pointlabel-halo,
text.arealabel,
text.linelabel,
text.pointlabel {
    dominant-baseline: middle;
    text-anchor: middle;
    font-size: 12px;
    font-weight: bold;
    fill: #333;
    -webkit-transition: opacity 100ms linear;
    transition: opacity 100ms linear;
    -moz-transition: opacity 100ms linear;
}

/* Opera doesn't support dominant-baseline. See #715 */
/* Safari 10 seems to have regressed too */
.linelabel-halo .textpath,
.linelabel .textpath {
  baseline-shift: -33%;
  dominant-baseline: auto;
}

.layer-labels-halo text {
    opacity: 0.7;
    stroke: #fff;
    stroke-width: 5px;
    stroke-miterlimit: 1;
}

text.nolabel {
    opacity: 0;
}

text.point {
    font-size: 10px;
}

.icon.areaicon-halo {
    opacity: 0.6;
    stroke: #999;
    stroke-width: 2px;
    stroke-miterlimit: 1;
}

.icon.areaicon {
    fill: #222;
    opacity: 0.8;
}


/* Turn Restrictions */

g.turn rect,
g.turn circle {
    fill: none;
    pointer-events: all;
}

.form-field-restrictions .vertex {
    cursor: auto !important;
    pointer-events: none;
}

/* Turn restriction paths and vertices */
.surface.tr .way.target,
.surface.tr path.shadow.selected,
.surface.tr path.shadow.related {
    stroke-width: 25px;
}

.surface.tr path.shadow.selected,
.surface.tr path.shadow.related,
.surface.tr g.vertex.selected .shadow,
.surface.tr g.vertex.related .shadow {
    stroke-opacity: 0.7;
    stroke: #777;
}
.surface.tr path.shadow.related.allow,
.surface.tr g.vertex.related.allow .shadow {
    stroke: #5b3;
}
.surface.tr path.shadow.related.restrict,
.surface.tr g.vertex.related.restrict .shadow {
    stroke: #d53;
}
.surface.tr path.shadow.related.only,
.surface.tr g.vertex.related.only .shadow {
    stroke: #68f;
}


/* GPX Paths */

.layer-gpx {
    pointer-events: none;
}

path.gpx {
    stroke: #ff26d4;
    stroke-width: 2;
    fill: none;
}

text.gpxlabel-halo,
text.gpxlabel {
    font-size: 10px;
    font-weight: bold;
    dominant-baseline: middle;
}

text.gpxlabel {
    fill: #ff26d4;
}

text.gpxlabel-halo {
    opacity: 0.7;
    stroke: #000;
    stroke-width: 5px;
    stroke-miterlimit: 1;
}


/* Default - light gray */
path.area.stroke {
    stroke: #ddd;
    stroke-width: 1;
}
path.area.fill {
    stroke-width: 0;
    stroke: rgba(255, 255, 255, 0.3);
    fill: rgba(255, 255, 255, 0.3);
    fill-rule: evenodd;
}
.preset-icon-fill-area {
    border: 1px solid rgb(170, 170, 170);
    background-color: rgba(170, 170, 170, 0.3);
}

path.shadow.old-multipolygon,
path.stroke.old-multipolygon {
    stroke-dasharray: 100, 5;
    stroke-linecap: butt;
}

/* Green things */
path.stroke.tag-landuse,
path.stroke.tag-natural,
path.stroke.tag-leisure-nature_reserve,
path.stroke.tag-leisure-pitch,
path.stroke.tag-leisure-park {
    stroke: rgb(140, 208, 95);
}
path.fill.tag-landuse,
path.fill.tag-natural,
path.fill.tag-leisure-nature_reserve,
path.fill.tag-leisure-pitch,
path.fill.tag-leisure-park {
    stroke: rgba(140, 208, 95, 0.3);
    fill: rgba(140, 208, 95, 0.3);
}
.preset-icon-fill-area.tag-landuse,
.preset-icon-fill-area.tag-natural,
.preset-icon-fill-area.tag-leisure-nature_reserve,
.preset-icon-fill-area.tag-leisure-pitch,
.preset-icon-fill-area.tag-leisure-park {
    border-color: rgb(140, 208, 95);
    background-color: rgba(140, 208, 95, 0.3);
}

/* Blue things */
path.stroke.tag-amenity-swimming_pool,
path.stroke.tag-leisure-swimming_pool,
path.stroke.tag-natural-water,
path.stroke.tag-landuse-aquaculture,
path.stroke.tag-landuse-basin,
path.stroke.tag-landuse-harbour,
path.stroke.tag-landuse-reservoir {
    stroke: rgb(119, 211, 222);
}
path.fill.tag-amenity-swimming_pool,
path.fill.tag-leisure-swimming_pool,
path.fill.tag-landuse-aquaculture,
path.fill.tag-landuse-basin,
path.fill.tag-landuse-harbour,
path.fill.tag-landuse-reservoir,
path.fill.tag-natural-water {
    stroke: rgba(119, 211, 222, 0.3);
    fill: rgba(119, 211, 222, 0.3);
}
.preset-icon-fill-area.tag-amenity-swimming_pool,
.preset-icon-fill-area.tag-leisure-swimming_pool,
.preset-icon-fill-area.tag-landuse-aquaculture,
.preset-icon-fill-area.tag-landuse-basin,
.preset-icon-fill-area.tag-landuse-harbour,
.preset-icon-fill-area.tag-landuse-reservoir,
.preset-icon-fill-area.tag-natural-water {
    border-color: rgb(119, 211, 222);
    background-color: rgba(119, 211, 222, 0.3);
}

/* Yellow things */
.pattern-color-beach,
.pattern-color-sand,
.pattern-color-scrub {
    fill: rgba(255, 255, 148, 0.2);
}
path.stroke.tag-leisure-pitch.tag-sport-beachvolleyball,
path.stroke.tag-natural-beach,
path.stroke.tag-natural-sand,
path.stroke.tag-natural-scrub,
path.stroke.tag-amenity-childcare,
path.stroke.tag-amenity-kindergarten,
path.stroke.tag-amenity-school,
path.stroke.tag-amenity-college,
path.stroke.tag-amenity-university {
    stroke: rgba(255, 255, 148, 0.75);
}
path.fill.tag-leisure-pitch.tag-sport-beachvolleyball,
path.fill.tag-natural-beach,
path.fill.tag-natural-sand,
path.fill.tag-natural-scrub,
path.fill.tag-amenity-childcare,
path.fill.tag-amenity-kindergarten,
path.fill.tag-amenity-school,
path.fill.tag-amenity-college,
path.fill.tag-amenity-university {
    stroke: rgba(255, 255, 148, 0.15);
    fill: rgba(255, 255, 148, 0.15);
}
.preset-icon-fill-area.tag-leisure-pitch.tag-sport-beachvolleyball,
.preset-icon-fill-area.tag-natural-beach,
.preset-icon-fill-area.tag-natural-sand,
.preset-icon-fill-area.tag-natural-scrub,
.preset-icon-fill-area.tag-amenity-childcare,
.preset-icon-fill-area.tag-amenity-kindergarten,
.preset-icon-fill-area.tag-amenity-school,
.preset-icon-fill-area.tag-amenity-college,
.preset-icon-fill-area.tag-amenity-university {
    border-color: rgb(232, 232, 0);
    background-color: rgba(255, 255, 148, 0.15);
}

/* Gold things */
.pattern-color-construction {
    fill: rgba(196, 189, 25, 0.3);
}
path.stroke.tag-landuse-residential,
path.stroke.tag-landuse.tag-status,
path.stroke.tag-landuse-construction {
    stroke: rgb(196, 189, 25);
}
path.fill.tag-landuse-residential {
    stroke: rgba(196, 189, 25, 0.3);
    fill: rgba(196, 189, 25, 0.3);
}
.preset-icon-fill-area.tag-landuse-residential,
.preset-icon-fill-area.tag-landuse.tag-status,
.preset-icon-fill-area.tag-landuse-construction {
    border-color: rgb(196, 189, 25);
    background: rgba(196, 189, 25, 0.3);
}

/* Orange things */
path.stroke.tag-landuse-retail,
path.stroke.tag-landuse-commercial,
path.stroke.tag-landuse-landfill,
path.stroke.tag-military,
path.stroke.tag-landuse-military {
    stroke: rgb(214, 136, 26);
}
path.fill.tag-landuse-retail,
path.fill.tag-landuse-commercial,
path.fill.tag-landuse-landfill,
path.fill.tag-military,
path.fill.tag-landuse-military {
    stroke: rgba(214, 136, 26, 0.3);
    fill: rgba(214, 136, 26, 0.3);
}
.preset-icon-fill-area.tag-landuse-retail,
.preset-icon-fill-area.tag-landuse-commercial,
.preset-icon-fill-area.tag-landuse-landfill,
.preset-icon-fill-area.tag-military,
.preset-icon-fill-area.tag-landuse-military {
    border-color: rgb(214, 136, 26);
    background-color: rgba(214, 136, 26, 0.3);
}

/* Pink things */
path.stroke.tag-landuse-industrial,
path.stroke.tag-power-plant {
    stroke: rgb(228, 164, 245);
}
path.fill.tag-landuse-industrial,
path.fill.tag-power-plant {
    stroke: rgba(228, 164, 245, 0.3);
    fill: rgba(228, 164, 245, 0.3);
}
.preset-icon-fill-area.tag-landuse-industrial,
.preset-icon-fill-area.tag-power-plant {
    border-color: rgb(228, 164, 245);
    background-color: rgba(228, 164, 245, 0.3);
}

/* Teal things */
.pattern-color-wetland {
    fill: rgba(153, 225, 170, 0.3);
}
path.stroke.tag-natural-wetland {
    stroke: rgb(153, 225, 170);
}
.preset-icon-fill-area.tag-natural-wetland {
    border-color: rgb(153, 225, 170);
    background-color: rgba(153, 225, 170, 0.2);
}

/* Light Green things */
.pattern-color-cemetery,
.pattern-color-orchard,
.pattern-color-meadow,
.pattern-color-farm,
.pattern-color-farmland {
    fill: rgba(191, 232, 63, 0.2);
}
path.stroke.tag-landuse-cemetery,
path.stroke.tag-landuse-orchard,
path.stroke.tag-landuse-meadow,
path.stroke.tag-landuse-farm,
path.stroke.tag-landuse-farmland {
    stroke: rgb(191, 232, 63);
}
.preset-icon-fill-area.tag-landuse-cemetery,
.preset-icon-fill-area.tag-landuse-orchard,
.preset-icon-fill-area.tag-landuse-meadow,
.preset-icon-fill-area.tag-landuse-farm,
.preset-icon-fill-area.tag-landuse-farmland {
    background-color: rgba(191, 232, 63, 0.2);
}

/* Tan things */
path.stroke.tag-landuse-farmyard {
    stroke: rgb(245, 220, 186);
}
path.fill.tag-landuse-farmyard {
    stroke: rgba(245, 220, 186, 0.3);
    fill: rgba(245, 220, 186, 0.3);
}
.preset-icon-fill-area.tag-landuse-farmyard {
    border-color: rgb(226, 177, 111);
    background: rgba(245, 220, 186, 0.3);
}

/* Dark Gray things */
path.stroke.tag-amenity-parking,
path.stroke.tag-leisure-pitch.tag-sport-basketball,
path.stroke.tag-leisure-pitch.tag-sport-skateboard,
path.stroke.tag-natural-bare_rock,
path.stroke.tag-natural-scree,
path.stroke.tag-landuse-railway,
path.stroke.tag-landuse-quarry {
    stroke: #bbb;
}
path.fill.tag-amenity-parking,
path.fill.tag-leisure-pitch.tag-sport-basketball,
path.fill.tag-leisure-pitch.tag-sport-skateboard,
path.fill.tag-natural-bare_rock,
path.fill.tag-natural-scree,
path.fill.tag-landuse-railway,
path.fill.tag-landuse-quarry {
    stroke: rgba(140, 140, 140, 0.5);
    fill: rgba(140, 140, 140, 0.5);
}
.preset-icon-fill-area.tag-amenity-parking,
.preset-icon-fill-area.tag-leisure-pitch.tag-sport-basketball,
.preset-icon-fill-area.tag-leisure-pitch.tag-sport-skateboard,
.preset-icon-fill-area.tag-natural-bare_rock,
.preset-icon-fill-area.tag-natural-scree,
.preset-icon-fill-area.tag-landuse-railway,
.preset-icon-fill-area.tag-landuse-quarry {
    border-color: rgb(170, 170, 170);
    background-color: rgba(140, 140, 140, 0.5);
}

/* Light gray overrides */
path.stroke.tag-natural-cave_entrance,
path.stroke.tag-natural-glacier {
    stroke: #ddd;
}
path.fill.tag-natural-cave_entrance,
path.fill.tag-natural-glacier {
    stroke: rgba(255, 255, 255, 0.3);
    fill: rgba(255, 255, 255, 0.3);
}
.preset-icon-fill-area.tag-natural-cave_entrance,
.preset-icon-fill-area.tag-natural-glacier {
    border-color: rgb(170, 170, 170);
    background: rgba(170, 170, 170, 0.3);
}

/* highways */

.preset-icon .icon.tag-highway.other-line {
    color: #fff;
    fill: #777;
}
path.casing.tag-highway {
    stroke: #444;
}
path.stroke.tag-highway {
    stroke: #ccc;
}

/* highway areas */

path.stroke.area.tag-highway,
.low-zoom path.stroke.area.tag-highway {
    stroke: #fff;
    stroke-dasharray: none;
    stroke-width: 1;
}

/* wide highways */

path.shadow.tag-highway {
    stroke-width: 20;
}
path.casing.tag-highway {
    stroke-width: 10;
}
path.stroke.tag-highway {
    stroke-width: 8;
}

.low-zoom path.shadow.tag-highway {
    stroke-width: 16;
}
.low-zoom path.casing.tag-highway {
    stroke-width: 7;
}
.low-zoom path.stroke.tag-highway {
    stroke-width: 5;
}

.preset-icon .icon.highway-motorway,
.preset-icon .icon.highway-motorway-link {
    color: #CF2081;
    fill: #70372f;
}
path.stroke.tag-highway-motorway,
path.stroke.tag-highway-motorway_link,
path.stroke.tag-motorway {
    stroke:#CF2081;
}
path.casing.tag-highway-motorway,
path.casing.tag-highway-motorway_link,
path.casing.tag-motorway {
    stroke:#70372f;
}

.preset-icon .icon.highway-trunk,
.preset-icon .icon.highway-trunk-link {
    color: #DD2F22;
    fill: #70372f;
}
path.stroke.tag-highway-trunk,
path.stroke.tag-highway-trunk_link,
path.stroke.tag-trunk {
    stroke:#DD2F22;
}
path.casing.tag-highway-trunk,
path.casing.tag-highway-trunk_link,
path.casing.tag-trunk {
    stroke:#70372f;
}

.preset-icon .icon.highway-primary,
.preset-icon .icon.highway-primary-link {
    color: #F99806;
    fill: #70372f;
}
path.stroke.tag-highway-primary,
path.stroke.tag-highway-primary_link,
path.stroke.tag-primary {
    stroke:#F99806;
}
path.casing.tag-highway-primary,
path.casing.tag-highway-primary_link,
path.casing.tag-primary {
    stroke:#70372f;
}

.preset-icon .icon.highway-secondary,
.preset-icon .icon.highway-secondary-link {
    color: #F3F312;
    fill: #70372f;
}
path.stroke.tag-highway-secondary,
path.stroke.tag-highway-secondary_link,
path.stroke.tag-secondary {
    stroke:#F3F312;
}
path.casing.tag-highway-secondary,
path.casing.tag-highway-secondary_link,
path.casing.tag-secondary {
    stroke:#70372f;
}

.preset-icon .icon.highway-tertiary,
.preset-icon .icon.highway-tertiary-link {
    color: #FFF9B3;
    fill: #70372f;
}
path.stroke.tag-highway-tertiary,
path.stroke.tag-highway-tertiary_link,
path.stroke.tag-tertiary {
    stroke:#FFF9B3;
}
path.casing.tag-highway-tertiary,
path.casing.tag-highway-tertiary_link,
path.casing.tag-tertiary {
    stroke:#70372f;
}

.legacy-carto .preset-icon .icon.highway-motorway,
.legacy-carto .preset-icon .icon.highway-motorway-link {
    color: #58a9ed;
    fill: #2c5476;
}
.legacy-carto path.stroke.tag-highway-motorway,
.legacy-carto path.stroke.tag-highway-motorway_link,
.legacy-carto path.stroke.tag-motorway {
    stroke:#58a9ed;
}
.legacy-carto path.casing.tag-highway-motorway,
.legacy-carto path.casing.tag-highway-motorway_link,
.legacy-carto path.casing.tag-motorway {
    stroke:#2c5476;
}

.legacy-carto .preset-icon .icon.highway-trunk,
.legacy-carto .preset-icon .icon.highway-trunk-link {
    color: #8cd05f;
    fill: #46682f;
}
.legacy-carto path.stroke.tag-highway-trunk,
.legacy-carto path.stroke.tag-highway-trunk_link,
.legacy-carto path.stroke.tag-trunk {
    stroke:#8cd05f;
}
.legacy-carto path.casing.tag-highway-trunk,
.legacy-carto path.casing.tag-highway-trunk_link,
.legacy-carto path.casing.tag-trunk {
    stroke:#46682f;
}

.legacy-carto .preset-icon .icon.highway-primary,
.legacy-carto .preset-icon .icon.highway-primary-link {
    color: #e06d5f;
    fill: #70372f;
}
.legacy-carto path.stroke.tag-highway-primary,
.legacy-carto path.stroke.tag-highway-primary_link,
.legacy-carto path.stroke.tag-primary {
    stroke:#e06d5f;
}
.legacy-carto path.casing.tag-highway-primary,
.legacy-carto path.casing.tag-highway-primary_link,
.legacy-carto path.casing.tag-primary {
    stroke:#70372f;
}

.legacy-carto .preset-icon .icon.highway-secondary,
.legacy-carto .preset-icon .icon.highway-secondary-link {
    color: #eab056;
    fill: #75582b;
}
.legacy-carto path.stroke.tag-highway-secondary,
.legacy-carto path.stroke.tag-highway-secondary_link,
.legacy-carto path.stroke.tag-secondary {
    stroke:#eab056;
}
.legacy-carto path.casing.tag-highway-secondary,
.legacy-carto path.casing.tag-highway-secondary_link,
.legacy-carto path.casing.tag-secondary {
    stroke:#75582b;
}

.legacy-carto .preset-icon .icon.highway-tertiary,
.legacy-carto .preset-icon .icon.highway-tertiary-link {
    color: #ffff7e;
    fill: #7f7f3f;
}
.legacy-carto path.stroke.tag-highway-tertiary,
.legacy-carto path.stroke.tag-highway-tertiary_link,
.legacy-carto path.stroke.tag-tertiary {
    stroke:#ffff7e;
}
.legacy-carto path.casing.tag-highway-tertiary,
.legacy-carto path.casing.tag-highway-tertiary_link,
.legacy-carto path.casing.tag-tertiary {
    stroke:#7f7f3f;
}

.preset-icon .icon.highway-residential {
    color: #fff;
    fill: #444;
}
path.stroke.tag-highway-residential,
path.stroke.tag-residential {
    stroke:#fff;
}
path.casing.tag-highway-residential,
path.casing.tag-residential {
    stroke:#444;
}

.preset-icon .icon.highway-unclassified {
    color: #dcd9b9;
    fill: #444;
}
path.stroke.tag-highway-unclassified,
path.stroke.tag-unclassified {
    stroke:#dcd9b9;
}
path.casing.tag-highway-unclassified,
path.casing.tag-unclassified {
    stroke:#444;
}


/* narrow highways */

path.shadow.tag-highway-living_street,
path.shadow.tag-highway-bus_guideway,
path.shadow.tag-highway-service,
path.shadow.tag-highway-track,
path.shadow.tag-highway-road,
path.shadow.tag-living_street,
path.shadow.tag-service,
path.shadow.tag-track,
path.shadow.tag-road {
    stroke-width: 16;
}
path.casing.tag-highway-living_street,
path.casing.tag-highway-bus_guideway,
path.casing.tag-highway-service,
path.casing.tag-highway-track,
path.casing.tag-highway-road,
path.casing.tag-living_street,
path.casing.tag-service,
path.casing.tag-track,
path.casing.tag-road {
    stroke-width: 7;
}
path.stroke.tag-highway-living_street,
path.stroke.tag-highway-bus_guideway,
path.stroke.tag-highway-service,
path.stroke.tag-highway-track,
path.stroke.tag-highway-road,
path.stroke.tag-living_street,
path.stroke.tag-service,
path.stroke.tag-track,
path.stroke.tag-road {
    stroke-width: 5;
}

path.shadow.tag-highway-path,
path.shadow.tag-highway-footway,
path.shadow.tag-highway-cycleway,
path.shadow.tag-highway-bridleway,
path.shadow.tag-highway-corridor,
path.shadow.tag-highway-pedestrian,
path.shadow.tag-highway-steps,
path.shadow.tag-path,
path.shadow.tag-footway,
path.shadow.tag-cycleway,
path.shadow.tag-bridleway,
path.shadow.tag-corridor,
path.shadow.tag-pedestrian,
path.shadow.tag-steps {
    stroke-width: 16;
}
path.casing.tag-highway-path,
path.casing.tag-highway-footway,
path.casing.tag-highway-cycleway,
path.casing.tag-highway-bridleway,
path.casing.tag-highway-corridor,
path.casing.tag-highway-pedestrian,
path.casing.tag-highway-steps,
path.casing.tag-path,
path.casing.tag-footway,
path.casing.tag-cycleway,
path.casing.tag-bridleway,
path.casing.tag-corridor,
path.casing.tag-pedestrian,
path.casing.tag-steps {
    stroke-width: 5;
}
path.stroke.tag-highway-path,
path.stroke.tag-highway-footway,
path.stroke.tag-highway-cycleway,
path.stroke.tag-highway-bridleway,
path.stroke.tag-highway-corridor,
path.stroke.tag-highway-pedestrian,
path.stroke.tag-highway-steps,
path.stroke.tag-path,
path.stroke.tag-footway,
path.stroke.tag-cycleway,
path.stroke.tag-bridleway,
path.stroke.tag-corridor,
path.stroke.tag-pedestrian,
path.stroke.tag-steps {
    stroke-width: 3;
}

.low-zoom path.shadow.tag-highway-living_street,
.low-zoom path.shadow.tag-highway-bus_guideway,
.low-zoom path.shadow.tag-highway-service,
.low-zoom path.shadow.tag-highway-track,
.low-zoom path.shadow.tag-highway-road,
.low-zoom path.shadow.tag-living_street,
.low-zoom path.shadow.tag-service,
.low-zoom path.shadow.tag-track,
.low-zoom path.shadow.tag-road {
    stroke-width: 12;
}
.low-zoom path.casing.tag-highway-living_street,
.low-zoom path.casing.tag-highway-bus_guideway,
.low-zoom path.casing.tag-highway-service,
.low-zoom path.casing.tag-highway-track,
.low-zoom path.casing.tag-highway-road,
.low-zoom path.casing.tag-living_street,
.low-zoom path.casing.tag-service,
.low-zoom path.casing.tag-track,
.low-zoom path.casing.tag-road {
    stroke-width: 5;
}
.low-zoom path.stroke.tag-highway-living_street,
.low-zoom path.stroke.tag-highway-bus_guideway,
.low-zoom path.stroke.tag-highway-service,
.low-zoom path.stroke.tag-highway-track,
.low-zoom path.stroke.tag-highway-road,
.low-zoom path.stroke.tag-living_street,
.low-zoom path.stroke.tag-service,
.low-zoom path.stroke.tag-track,
.low-zoom path.stroke.tag-road {
    stroke-width: 3;
}

.low-zoom path.shadow.tag-highway-path,
.low-zoom path.shadow.tag-highway-footway,
.low-zoom path.shadow.tag-highway-cycleway,
.low-zoom path.shadow.tag-highway-bridleway,
.low-zoom path.shadow.tag-highway-corridor,
.low-zoom path.shadow.tag-highway-pedestrian,
.low-zoom path.shadow.tag-highway-steps,
.low-zoom path.shadow.tag-path,
.low-zoom path.shadow.tag-footway,
.low-zoom path.shadow.tag-cycleway,
.low-zoom path.shadow.tag-bridleway,
.low-zoom path.shadow.tag-corridor,
.low-zoom path.shadow.tag-pedestrian,
.low-zoom path.shadow.tag-steps {
    stroke-width: 12;
}
.low-zoom path.casing.tag-highway-path,
.low-zoom path.casing.tag-highway-footway,
.low-zoom path.casing.tag-highway-cycleway,
.low-zoom path.casing.tag-highway-bridleway,
.low-zoom path.casing.tag-highway-corridor,
.low-zoom path.casing.tag-highway-pedestrian,
.low-zoom path.casing.tag-highway-steps,
.low-zoom path.casing.tag-path,
.low-zoom path.casing.tag-footway,
.low-zoom path.casing.tag-cycleway,
.low-zoom path.casing.tag-bridleway,
.low-zoom path.casing.tag-corridor,
.low-zoom path.casing.tag-pedestrian,
.low-zoom path.casing.tag-steps {
    stroke-width: 3;
}
.low-zoom path.stroke.tag-highway-path,
.low-zoom path.stroke.tag-highway-footway,
.low-zoom path.stroke.tag-highway-cycleway,
.low-zoom path.stroke.tag-highway-bridleway,
.low-zoom path.stroke.tag-highway-corridor,
.low-zoom path.stroke.tag-highway-pedestrian,
.low-zoom path.stroke.tag-highway-steps,
.low-zoom path.stroke.tag-path,
.low-zoom path.stroke.tag-footway,
.low-zoom path.stroke.tag-cycleway,
.low-zoom path.stroke.tag-bridleway,
.low-zoom path.stroke.tag-corridor,
.low-zoom path.stroke.tag-pedestrian,
.low-zoom path.stroke.tag-steps {
    stroke-width: 1;
}


.preset-icon .icon.highway-living-street {
    color: #bbb;
    fill: #ddd;
}
path.stroke.tag-highway-living_street,
path.stroke.tag-living_street {
    stroke: #ccc;
}
path.casing.tag-highway-living_street,
path.casing.tag-living_street {
    stroke: #fff;
}

.preset-icon .icon.highway-footway.tag-highway-corridor,
.preset-icon .icon.highway-footway.tag-highway-pedestrian {
    color: #8cd05f;
    fill: #fff;
}
path.stroke.tag-highway-corridor,
path.stroke.tag-highway-pedestrian,
path.stroke.tag-corridor,
path.stroke.tag-pedestrian {
    stroke:#fff;
    stroke-dasharray: 2, 8;
}
.low-zoom path.stroke.tag-highway-corridor,
.low-zoom path.stroke.tag-highway-pedestrian,
.low-zoom path.stroke.tag-corridor,
.low-zoom path.stroke.tag-pedestrian {
    stroke-dasharray: 1, 4;
}
path.casing.tag-highway-corridor,
path.casing.tag-highway-pedestrian,
path.casing.tag-corridor,
path.casing.tag-pedestrian,
path.casing.tag-highway-corridor.tag-unpaved,
path.casing.tag-highway-pedestrian.tag-unpaved,
path.casing.tag-corridor.tag-unpaved,
path.casing.tag-pedestrian.tag-unpaved {
    stroke: #8cd05f;
    stroke-linecap: round;
    stroke-dasharray: none;
}

.preset-icon .icon.highway-road {
    color: #9e9e9e;
    fill: #666;
}
path.stroke.tag-highway-road,
path.stroke.tag-road {
    stroke:#9e9e9e;
}
path.casing.tag-highway-road,
path.casing.tag-road {
    stroke:#666;
}

.preset-icon .icon.highway-service {
    color: #fff;
    fill: #666;
}
path.stroke.tag-highway-service,
path.stroke.tag-service {
    stroke:#fff;
}
path.casing.tag-highway-service,
path.casing.tag-service {
    stroke:#666;
}

/* special service roads and bus guideways */
/* with `service=* tag`  (e.g. parking_aisle, alley, drive-through */
.preset-icon .icon.highway-bus_guideway,
.preset-icon .icon.highway-service.tag-service {
    color: #dcd9b9;
    fill: #666;
}
path.stroke.tag-highway-bus_guideway,
path.stroke.tag-highway-service.tag-service,
path.stroke.tag-service.tag-service {
    stroke: #dcd9b9;
}
path.casing.tag-highway-bus_guideway,
path.casing.tag-highway-service.tag-service,
path.casing.tag-service.tag-service {
    stroke: #666;
}

.preset-icon .icon.highway-track {
    color: #eaeaea;
    fill: #c5b59f;
}
path.stroke.tag-highway-track,
path.stroke.tag-track {
    stroke: #c5b59f;
}
path.casing.tag-highway-track,
path.casing.tag-track {
    stroke: #746f6f;
}

path.stroke.tag-highway-path,
path.stroke.tag-highway-footway,
path.stroke.tag-highway-cycleway,
path.stroke.tag-highway-bridleway {
    stroke-linecap: butt;
    stroke-dasharray: 6, 6;
}
.low-zoom path.stroke.tag-highway-path,
.low-zoom path.stroke.tag-highway-footway,
.low-zoom path.stroke.tag-highway-cycleway,
.low-zoom path.stroke.tag-highway-bridleway {
    stroke-linecap: butt;
    stroke-dasharray: 3, 3;
}

path.casing.tag-highway-path,
path.casing.tag-highway-path.tag-unpaved {
    stroke: #c5b59f;
    stroke-linecap: round;
    stroke-dasharray: none;
}
path.casing.tag-highway-footway,
path.casing.tag-highway-cycleway,
path.casing.tag-highway-bridleway,
path.casing.tag-highway-footway.tag-unpaved,
path.casing.tag-highway-cycleway.tag-unpaved,
path.casing.tag-highway-bridleway.tag-unpaved {
    stroke: #fff;
    stroke-linecap: round;
    stroke-dasharray: none;
}

.preset-icon .icon.category-path,
.preset-icon .icon.highway-path {
    color: #746f6f;
    fill: #c5b59f;
}
path.stroke.tag-highway-path {
    stroke: #746f6f;
}

.preset-icon .icon.tag-route-foot,
.preset-icon .icon.tag-route-hiking,
.preset-icon .icon.highway-footway {
    color: #ae8681;
    fill: #fff;
}
path.stroke.tag-highway-footway {
    stroke: #ae8681;
}

.preset-icon .icon.highway-footway.tag-crossing {
    color: #444;
}
path.stroke.tag-highway-footway.tag-crossing {
    stroke: #444;
    stroke-dasharray: 6, 4;
}
.low-zoom path.stroke.tag-highway-footway.tag-crossing {
    stroke-dasharray: 3, 2;
}

.preset-icon .icon.tag-route-bicycle,
.preset-icon .icon.highway-cycleway {
    color: #58a9ed;
    fill: #fff;
}
path.stroke.tag-highway-cycleway {
    stroke: #58a9ed;
}

.preset-icon .icon.tag-route-horse,
.preset-icon .icon.highway-bridleway {
    color: #e06d5f;
    fill: #fff;
}
path.stroke.tag-highway-bridleway {
    stroke: #e06d5f;
}

.preset-icon .icon.highway-steps {
    color: #81d25c;
    fill: #fff;
}
path.stroke.tag-highway-steps {
    stroke: #81d25c;
    stroke-linecap: butt;
    stroke-dasharray: 3, 3;
}
.low-zoom path.stroke.tag-highway-steps {
    stroke-dasharray: 2, 2;
}
path.casing.tag-highway-steps,
path.casing.tag-highway-steps.tag-unpaved {
    stroke: #fff;
    stroke-linecap: round;
    stroke-dasharray: none;
}

/* highway midpoints */

g.midpoint.tag-highway-corridor .fill,
g.midpoint.tag-highway-pedestrian .fill,
g.midpoint.tag-highway-steps .fill,
g.midpoint.tag-highway-path .fill,
g.midpoint.tag-highway-footway .fill,
g.midpoint.tag-highway-cycleway .fill,
g.midpoint.tag-highway-bridleway .fill {
    fill: #fff;
    stroke: #333;
    stroke-opacity: .8;
    opacity: .8;
}
/* aeroways */

/* areas */
path.stroke.area.tag-aeroway,
.low-zoom path.stroke.area.tag-aeroway {
    stroke: #fff;
    stroke-dasharray: none;
    stroke-width: 1;
}

/* narrow aeroways (taxiway) */

path.shadow.tag-aeroway-taxiway,
path.shadow.tag-taxiway {
    stroke-width: 16;
}
path.casing.tag-aeroway-taxiway,
path.casing.tag-taxiway {
    stroke-width: 7;
}
path.stroke.tag-aeroway-taxiway,
path.stroke.tag-taxiway {
    stroke-width: 5;
}

.low-zoom path.shadow.tag-aeroway-taxiway,
.low-zoom path.shadow.tag-taxiway {
    stroke-width: 12;
}
.low-zoom path.casing.tag-aeroway-taxiway,
.low-zoom path.casing.tag-taxiway {
    stroke-width: 5;
}
.low-zoom path.stroke.tag-aeroway-taxiway,
.low-zoom path.stroke.tag-taxiway {
    stroke-width: 3;
}

.preset-icon .icon.tag-aeroway-taxiway,
.preset-icon .icon.tag-taxiway {
    color: #ff0;
    fill: #666;
}
path.stroke.tag-aeroway-taxiway,
path.stroke.tag-taxiway {
    stroke: #ff0;
}
path.casing.tag-aeroway-taxiway,
path.casing.tag-taxiway {
    stroke: #666;
}


/* wide aeroways (runway) */

.preset-icon .icon.tag-aeroway-runway,
.preset-icon .icon.tag-runway {
    color: #444;
    fill: #000;
}
path.shadow.tag-aeroway-runway {
    stroke-width: 20;
}
path.casing.tag-aeroway-runway {
    stroke-width: 10;
    stroke: #000;
    stroke-linecap: square;
}
path.stroke.tag-aeroway-runway {
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: butt;
    stroke-dasharray: 24, 48;
}

.low-zoom path.shadow.tag-aeroway-runway {
    stroke-width: 16;
}
.low-zoom path.casing.tag-aeroway-runway {
    stroke-width: 7;
}
.low-zoom path.stroke.tag-aeroway-runway {
    stroke-width: 2;
    stroke-dasharray: 12, 24;
}

path.fill.tag-aeroway-runway {
    stroke: rgba(0, 0, 0, 0.6);
    fill: rgba(0, 0, 0, 0.6);
}

/* railways */

.preset-icon .icon.tag-railway.other-line {
    color: #fff;
    fill: #777;
}
.preset-icon .icon.tag-railway {
    color: #555;
    fill: #eee;
}

/* railway areas */

path.stroke.area.tag-railway,
.low-zoom path.stroke.area.tag-railway {
    stroke: white;
    stroke-width: 1;
    stroke-dasharray: none;
}

path.casing.area.tag-railway,
.low-zoom path.casing.area.tag-railway {
    stroke: none;
}

/* narrow widths */

path.shadow.tag-railway {
    stroke-width: 16;
}
path.casing.tag-railway {
    stroke-width: 7;
}
path.stroke.tag-railway {
    stroke-width: 2;
    stroke-linecap: butt;
    stroke-dasharray: 12,12;
}

.low-zoom path.shadow.tag-railway {
    stroke-width: 12;
}
.low-zoom path.casing.tag-railway {
    stroke-width: 5;
}
.low-zoom path.stroke.tag-railway {
    stroke-width: 2;
    stroke-dasharray: 6,6;
}


/* styles */

path.casing.tag-railway {
    stroke: #555;
}
path.stroke.tag-railway {
    stroke: #eee;
}


.preset-icon .icon.tag-railway-disused,
.preset-icon .icon.tag-railway-abandoned {
    color: #999;
    fill: #eee;
}
path.casing.tag-railway-abandoned {
    stroke: #999;
}
path.stroke.tag-railway-abandoned {
    stroke: #eee;
}


.preset-icon .icon.tag-railway-subway {
    color: #222;
    fill: #bbb;
}
path.casing.tag-railway-subway {
    stroke: #222;
}
path.stroke.tag-railway-subway {
    stroke: #bbb;
}


/* railway platforms - like sidewalks */

.preset-icon .icon.highway-footway.tag-railway-platform {
    color: #ae8681;
    fill: #dcd9b9;
}
path.shadow.tag-railway-platform {
    stroke-width: 16;
}
path.casing.tag-railway-platform {
    stroke: #dcd9b9;
    stroke-width: 5;
    stroke-linecap: round;
    stroke-dasharray: none;
}
path.stroke.tag-railway-platform {
    stroke: #ae8681;
    stroke-width: 3;
    stroke-linecap: butt;
    stroke-dasharray: 6, 6;
}

.low-zoom path.shadow.tag-railway-platform {
    stroke-width: 12;
}
.low-zoom path.casing.tag-railway-platform {
    stroke-width: 3;
}
.low-zoom path.stroke.tag-railway-platform {
    stroke-width: 1;
    stroke-linecap: butt;
    stroke-dasharray: 3, 3;
}

g.midpoint.tag-railway-platform .fill {
    fill: #fff;
    stroke: #333;
    stroke-opacity: .8;
    opacity: .8;
}
/* waterways */

.preset-icon .icon.tag-waterway.other-line {
    color: #77d3de;
    fill: #77d3de;
}
.preset-icon .icon.category-water,
.preset-icon .icon.tag-route-ferry,
.preset-icon .icon.tag-type-waterway,
.preset-icon .icon.tag-waterway {
    color: #77d3de;
    fill: #fff;
}

path.fill.tag-waterway {
    stroke: rgba(119, 211, 222, 0.3);
    fill: rgba(119, 211, 222, 0.3);
}
path.casing.tag-waterway {
    stroke: #3d6c71;
}
path.stroke.tag-waterway {
    stroke: #77d3de;
}


/* narrow waterways (default) */

path.shadow.tag-waterway {
    stroke-width: 16;
}
path.casing.tag-waterway {
    stroke-width: 7;
}
path.stroke.tag-waterway {
    stroke-width: 5;
}

.low-zoom path.shadow.tag-waterway {
    stroke-width: 12;
}
.low-zoom path.casing.tag-waterway {
    stroke-width: 5;
}
.low-zoom path.stroke.tag-waterway {
    stroke-width: 3;
}


/* wide waterways (river) */

path.shadow.tag-waterway-river {
    stroke-width: 20;
}
path.casing.tag-waterway-river {
    stroke-width: 10;
}
path.stroke.tag-waterway-river {
    stroke-width: 8;
}

.low-zoom path.shadow.tag-waterway-river {
    stroke-width: 16;
}
.low-zoom path.casing.tag-waterway-river {
    stroke-width: 7;
}
.low-zoom path.stroke.tag-waterway-river {
    stroke-width: 5;
}


/* ditch */

.preset-icon .icon.tag-waterway-ditch {
    color: #8eabf3;
}
path.stroke.tag-waterway-ditch {
    stroke: #8eabf3;
}


/* waterway areas */

path.area.stroke.tag-waterway-dock,
path.area.stroke.tag-waterway-boatyard,
path.area.stroke.tag-waterway-fuel {
    stroke: white;
    stroke-width: 1;
}
path.area.casing.tag-waterway-dock,
path.area.casing.tag-waterway-boatyard,
path.area.casing.tag-waterway-fuel {
    stroke: none;
}
path.area.fill.tag-waterway-dock,
path.area.fill.tag-waterway-boatyard,
path.area.fill.tag-waterway-fuel {
    stroke: rgba(255, 255, 255, 0.3);
    fill: rgba(255, 255, 255, 0.3);
}

/* power */
.preset-icon .icon.tag-man_made-pipeline,
.preset-icon .icon.tag-power {
    color: #939393;
    fill: #939393;
}

path.stroke.tag-power {
    stroke: #939393;
    stroke-width: 2;
}
path.casing.tag-power {
    stroke: none;
}


/* boundaries */
path.stroke.tag-boundary {
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: butt;
    stroke-dasharray: 20, 5, 5, 5;
}
path.casing.tag-boundary {
    stroke: #82B5FE;
    stroke-width: 6;
}

path.casing.tag-boundary-protected_area,
path.casing.tag-boundary-national_park {
    stroke: #b0e298;
}


/* Tree Rows */
path.shadow.tag-natural-tree_row {
    stroke-width: 16;
}
path.casing.tag-natural-tree_row {
    stroke-width: 7;
}
path.stroke.tag-natural-tree_row {
    stroke-width: 5;
}

.low-zoom path.shadow.tag-natural-tree_row {
    stroke-width: 12;
}
.low-zoom path.casing.tag-natural-tree_row {
    stroke-width: 5;
}
.low-zoom path.stroke.tag-natural-tree_row {
    stroke-width: 3;
}


/* barriers */
path.stroke.tag-barrier {
    stroke: #ddd;
    stroke-width: 3px;
    stroke-linecap: round;
    stroke-dasharray: 15, 5, 1, 5;
}
.low-zoom path.stroke.tag-barrier {
    stroke-width: 2px;
    stroke-linecap: butt;
    stroke-dasharray: 8, 2, 2, 2;
}


/* bridges */
path.casing.tag-bridge {
    stroke-opacity: 0.6;
    stroke: #000;
    stroke-linecap: butt;
    stroke-dasharray: none;
}

path.shadow.tag-bridge {
    stroke-width: 24;
}
path.casing.tag-bridge {
    stroke-width: 16;
}
.low-zoom path.shadow.tag-bridge {
    stroke-width: 16;
}
.low-zoom path.casing.tag-bridge {
    stroke-width: 10;
}

path.shadow.line.tag-railway.tag-bridge,
path.shadow.tag-highway-living_street.tag-bridge,
path.shadow.tag-highway-path.tag-bridge,
path.shadow.tag-highway-corridor.tag-bridge,
path.shadow.line.tag-highway-pedestrian.tag-bridge,
path.shadow.tag-highway-service.tag-bridge,
path.shadow.tag-highway-track.tag-bridge,
path.shadow.tag-highway-steps.tag-bridge,
path.shadow.tag-highway-footway.tag-bridge,
path.shadow.tag-highway-cycleway.tag-bridge,
path.shadow.tag-highway-bridleway.tag-bridge {
    stroke-width: 18;
}
path.casing.line.tag-railway.tag-bridge,
path.casing.tag-highway-living_street.tag-bridge,
path.casing.tag-highway-path.tag-bridge,
path.casing.tag-highway-corridor.tag-bridge,
path.casing.line.tag-highway-pedestrian.tag-bridge,
path.casing.tag-highway-service.tag-bridge,
path.casing.tag-highway-track.tag-bridge,
path.casing.tag-highway-steps.tag-bridge,
path.casing.tag-highway-footway.tag-bridge,
path.casing.tag-highway-cycleway.tag-bridge,
path.casing.tag-highway-bridleway.tag-bridge {
    stroke-width: 10;
}

.low-zoom path.shadow.line.tag-railway.tag-bridge,
.low-zoom path.shadow.tag-highway-living_street.tag-bridge,
.low-zoom path.shadow.tag-highway-path.tag-bridge,
.low-zoom path.shadow.tag-highway-corridor.tag-bridge,
.low-zoom path.shadow.line.tag-highway-pedestrian.tag-bridge,
.low-zoom path.shadow.tag-highway-service.tag-bridge,
.low-zoom path.shadow.tag-highway-track.tag-bridge,
.low-zoom path.shadow.tag-highway-steps.tag-bridge,
.low-zoom path.shadow.tag-highway-footway.tag-bridge,
.low-zoom path.shadow.tag-highway-cycleway.tag-bridge,
.low-zoom path.shadow.tag-highway-bridleway.tag-bridge {
    stroke-width: 14;
}
.low-zoom path.casing.line.tag-railway.tag-bridge,
.low-zoom path.casing.tag-highway-living_street.tag-bridge,
.low-zoom path.casing.tag-highway-path.tag-bridge,
.low-zoom path.casing.tag-highway-corridor.tag-bridge,
.low-zoom path.casing.line.tag-highway-pedestrian.tag-bridge,
.low-zoom path.casing.tag-highway-service.tag-bridge,
.low-zoom path.casing.tag-highway-track.tag-bridge,
.low-zoom path.casing.tag-highway-steps.tag-bridge,
.low-zoom path.casing.tag-highway-footway.tag-bridge,
.low-zoom path.casing.tag-highway-cycleway.tag-bridge,
.low-zoom path.casing.tag-highway-bridleway.tag-bridge {
    stroke-width: 6;
}


/* tunnels */
path.stroke.tag-tunnel {
    stroke-opacity: 0.3;
}
path.casing.tag-tunnel {
    stroke-opacity: 0.5;
    stroke-linecap: butt;
    stroke-dasharray: none;
}


/* embankments / cuttings */
path.shadow.tag-embankment,
path.shadow.tag-cutting {
    stroke-width: 28;
}
path.casing.tag-embankment,
path.casing.tag-cutting {
    stroke-opacity: 0.5;
    stroke: #000;
    stroke-width: 22;
    stroke-dasharray: 2, 4;
    stroke-linecap: butt;
}

.low-zoom path.shadow.tag-embankment,
.low-zoom path.shadow.tag-cutting {
    stroke-width: 14;
}
.low-zoom path.casing.tag-embankment,
.low-zoom path.casing.tag-cutting {
    stroke-width: 10;
}


/* Surface - unpaved */
path.casing.tag-unpaved {
    stroke: #ccc;
    stroke-linecap: butt;
    stroke-dasharray: 4, 3;
}
.low-zoom path.casing.tag-unpaved {
    stroke-dasharray: 3, 2;
}
path.casing.tag-bridge.tag-unpaved {
    stroke: #000;
    stroke-dasharray: 4, 3;
}
.low-zoom path.casing.tag-bridge.tag-unpaved {
    stroke: #000;
    stroke-dasharray: 3, 2;
}


/* Status (e.g. construction, proposed, abandoned) */
path.stroke.tag-status,
path.casing.tag-status {
    stroke-linecap: butt;
    stroke-dasharray: 7, 3;
}
.low-zoom path.stroke.tag-status,
.low-zoom path.casing.tag-status {
    stroke-dasharray: 5, 2;
}


/* Buildings */
path.stroke.tag-building,
path.stroke.tag-amenity-shelter {
    stroke: rgb(224, 110, 95);
}
path.fill.tag-building,
path.fill.tag-amenity-shelter {
    stroke: rgba(224, 110, 95, 0.3);
    fill: rgba(224, 110, 95, 0.3);
}
.preset-icon-fill-area.tag-building,
.preset-icon-fill-area.tag-amenity-shelter {
    border-color: rgb(224, 110, 95);
    background-color: rgba(224, 110, 95, 0.3);
}
/* Cursors */

.nope,
.nope * {
    cursor: not-allowed !important;
}

.map-in-map,
#map {
    cursor: auto; /* Opera */
    cursor: url(img/cursor-grab.png) 9 9, auto; /* FF */
}

.mode-browse .point,
.mode-select .point {
    cursor: pointer; /* Opera */
    cursor: url(img/cursor-select-point.png), pointer; /* FF */
}

.mode-select .vertex,
.mode-browse .vertex {
    cursor: pointer; /* Opera */
    cursor: url(img/cursor-select-vertex.png), pointer; /* FF */
}

.mode-browse .line,
.mode-select .line {
    cursor: pointer; /* Opera */
    cursor: url(img/cursor-select-line.png), pointer; /* FF */
}

.mode-select .area,
.mode-browse .area {
    cursor: pointer; /* Opera */
    cursor: url(img/cursor-select-area.png), pointer; /* FF */
}

.mode-select .midpoint,
.mode-browse .midpoint {
    cursor: pointer; /* Opera */
    cursor: url(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(img/cursor-select-add.png), pointer; /* FF */
}

.mode-select .behavior-multiselect .selected {
    cursor: pointer; /* Opera */
    cursor: url(img/cursor-select-remove.png), pointer; /* FF */
}

.mode-draw-line #map,
.mode-draw-area #map,
.mode-add-line  #map,
.mode-add-area  #map,
.mode-drag-node #map {
    cursor: crosshair; /* Opera */
    cursor: url(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(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(img/cursor-draw-connect-vertex.png) 9 9, crosshair; /* FF */
}

.mode-add-point #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(img/cursor-draw.png) 9 9, crosshair; /* FF */
}

.turn rect,
.turn circle {
    cursor: pointer;
}
/* photo viewer div */
#photoviewer {
    position: absolute;
    bottom: 30px;
    width: 330px;
    height: 250px;
    padding: 5px;
    background-color: #fff;
}

#photoviewer button.thumb-hide {
    border-radius: 0;
    padding: 5px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 48;
}

.photo-wrapper,
.photo-wrapper img {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.photo-wrapper .photo-attribution {
    width: 100%;
    font-size: 10px;
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
    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: visible;
    cursor: pointer;
}

.viewfield-group.selected * {