body {
  margin-bottom: 37px;
}

#track-info {
  display: flex;
  justify-content: left;
  align-items: center;
  font-size: small;
  padding: 10px 0px 0px 10px;
  position: absolute;
  height: 60px;
  width: 100%;
}

#map {
  position: absolute;
  top: 56px;
  bottom: 37px;
  width: 100%;
  z-index: -1;
}

#simplify-track-map {
  position: absolute;
  top: 412px;
  bottom: 60px;
  padding: 0 10px 0 10px;
  min-height: 480px;
  width: 100%;
  z-index: -1;
}

#itinerary-path-map,
#itinerary-route-map,
#itinerary-track-map {
  padding: 10px;
  height: 480px;
  width: 100%;
  z-index: -1;
}

.raw-markdown {
  width: 100%;
  height: 600px;
}

.ol-popup {
  position: absolute;
  background-color: white;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
  padding: 15px;
  border-radius: 10px;
  border: 1px solid #cccccc;
  bottom: 12px;
  left: -50px;
  min-width: 280px;
}
.ol-popup:after, .ol-popup:before {
  top: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.ol-popup:after {
  border-top-color: white;
  border-width: 10px;
  left: 48px;
  margin-left: -10px;
}
.ol-popup:before {
  border-top-color: #cccccc;
  border-width: 11px;
  left: 48px;
  margin-left: -11px;
}
.ol-popup-closer {
  text-decoration: none;
  position: absolute;
  top: 2px;
  right: 8px;
}
.ol-popup-closer:after {
  content: "✖";
}
.select-map-layer {
  top: 4em;
  left: .5em;
}
.select-map-layer button.map-layers-control {
  background-image: url(../icons/map-layers-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
#exit-map-control {
  top: 3em;
  right: .5em;
}
.exit-map-layer button.map-exit-control {
  background-image: url(../icons/map-exit-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
#create-feature-control {
  top: 5.5em;
  right: .5em;
}
.create-feature-layer button.map-route-control
{
  background-image: url(../icons/map-route-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
.create-feature-layer button.map-waypoint-control {
  background-image: url(../icons/map-waypoint-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
#modify-feature-control {
  top: 10em;
  right: .5em;
}
.modify-feature-layer button.map-edit-control {
  background-image: url(../icons/map-edit-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
.modify-feature-layer button.map-delete-control {
  background-image: url(../icons/map-delete-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
.location-sharing-layer button.map-live-control {
  background-image: url(../icons/map-live-btn.svg);
  background-repeat: no-repeat;
  background-position: center center;
}
.modify-feature-option-container {
  position: absolute;
  top: 0px;
  right: 1.4em;
  text-align: right;
  padding-left: 0;
}
.modify-feature-option-container li {
  display: table-cell;
  background-color: #919191;
  border-left: 1px solid #AAA;
  color: #FFF;
  font: 11px/19px "Helvetica Neue",Arial,Helvetica,sans-serif;
  height: 24px;
}
.modify-feature-option-container li:last-child {
  border-radius: 0;
}
.modify-feature-option-container li:first-child {
  border-radius: 4px 0 0 4px;
  border-left: 0;
}
.modify-feature-option-container a:hover {
  background-color: #a0a0a0;
}
.modify-feature-option-container a {
  color: #FFF;
  font: 11px/19px "Helvetica Neue",Arial,Helvetica,sans-serif;
  text-decoration: none;
  padding: 3px 10px 4px 10px;
  display: block;
  height: 24px;
}
.modify-feature-option-container li:first-child a {
  border-radius: 4px 0 0 4px;
  border-left: 0;
}
#location-sharing-control {
  top: 14.5em;
  right: .5em;
}
.location-sharing-modal {
  position: absolute;
  min-width: 300px;
  top: .5em;
  right: .5em;
  padding: 10px;
  background: white;
}
button.live-map-form {
  width: 80px;
}
label.location-sharing-nickname {
  padding-left: 8px;
}
.ol-touch .select-map-layer {
  top: 80px;
}
.map-layer-modal {
  position: absolute;
  top: 0;
  padding: 10px;
  background: white;
}
.exit-map-modal {
  position: absolute;
  top: 0;
  background: white;
  z-index: 1;
}
label.map-provider {
  padding-left: 8px;
}
