iD/css/30_highways.css

/* highways */

/* highway areas */
path.stroke.area.tag-highway {
    stroke:#fff;
    stroke-dasharray: none;
    stroke-width: 2;
}

/* wide highways */

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

path.shadow.tag-highway {
    stroke-width:16;
}
path.casing.tag-highway {
    stroke:#444;
    stroke-width:10;
}
path.stroke.tag-highway {
    stroke:#ccc;
    stroke-width:8;
}

.low-zoom path.shadow.tag-highway {
    stroke-width:12;
}
.low-zoom path.casing.tag-highway {
    stroke-width:6;
}
.low-zoom path.stroke.tag-highway {
    stroke-width:4;
}

.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.stroke.tag-highway-living_street,
path.stroke.tag-highway-service,
path.stroke.tag-highway-track,
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-highway-road,
path.stroke.tag-living_street,
path.stroke.tag-service,
path.stroke.tag-track,
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,
path.stroke.tag-road {
    stroke-width:4;
}
path.casing.tag-highway-living_street,
path.casing.tag-highway-service,
path.casing.tag-highway-track,
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-highway-road,
path.casing.tag-living_street,
path.casing.tag-service,
path.casing.tag-track,
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,
path.casing.tag-road {
    stroke-width:6;
}

.low-zoom path.stroke.tag-highway-living_street,
.low-zoom path.stroke.tag-highway-service,
.low-zoom path.stroke.tag-highway-track,
.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-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-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,
.low-zoom path.stroke.tag-road {
    stroke-width:2;
}
.low-zoom path.casing.tag-highway-living_street,
.low-zoom path.casing.tag-highway-service,
.low-zoom path.casing.tag-highway-track,
.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-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-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,
.low-zoom path.casing.tag-road {
    stroke-width:4;
}

.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;
}
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;
}

.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;
}

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;
}

.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;
}
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;
}