text {
  fill: #fff;
}

/* Tooltip */
.svg-map-tooltip {
  background-color: #fff;
  border: 1px solid #000;
}

.svg-map-tooltip-triangle {
  border-color: #fff transparent transparent transparent;
}

.svg-map-tooltip-title {
  color: #000000;
}

a.svg-map-tooltip-navigation-button {
  background: #288a13;
  color: #fff;
}

a.svg-map-tooltip-detail-button {
  background: #3f3e8a;
  color: #fff;
}

/* INTERACTIVE ELEMENTS */

/* clickable elements */
.svg-map-not-clickable:not(g),
g.svg-map-not-clickable > * {
  fill: #6d6d6d;
}

/* order is important */
/* all stores */
g#stores > * {
  stroke: none;
  fill: #6d6d6d;
}

/* store default colors */
g:not(#services) .svg-map-clickable:not(g),
g:not(#services) g.svg-map-clickable > * {
  fill: #4b4b4b;
  stroke-width: 1px;
}

/* hovered stores */
g:not(#services) .svg-map-clickable:not(g):hover,
g:not(#services) g.svg-map-clickable:hover > * {
  fill: #4b4b4b;
  stroke: #4b4b4b;
}

/* selected store */
g:not(#services) .svg-map-clickable.svg-map-active:not(g),
g:not(#services) g.svg-map-clickable.svg-map-active > * {
  fill: #4b4b4b;
  stroke: #4b4b4b;
}

@keyframes navigation-fill-start {
  0% {
    fill: #208F27;
    stroke: #208F27;
  }
  50% {
    fill: #42A047;
    stroke: rgba(66, 160, 71, 0.8);
    /*fill: #ff0013;*/
  }
  100% {
    fill: #208F27;
    stroke: #208F27;
  }
}

/* active navigate - target color animation */
@keyframes navigation-fill-end {
  0% {

  }
  50% {
    fill: #0794d9;
    stroke: #0794d9;
  }
  100% {
  }
}

/*
------ services -----
*/
/* service default colors */
g:not(#stores) .svg-map-clickable:not(g),
g:not(#stores) g.svg-map-clickable > * {
  fill: #EDEDED;
  stroke-width: 1px;
}

/* hovered service */
g#services .svg-map-clickable:not(g):hover,
g#services g.svg-map-clickable:hover > * {
  fill: #EDEDED;
}

/* selected service animation */
/*@keyframes navigation-fill-services {*/
/*  0% {*/
/*    fill: #ffa965;*/
/*    stroke: #ffa965;*/

/*  }*/
/*  50% {*/
/*    fill: #ff7c11;*/
/*    stroke: #ff7c11;*/
/*  }*/
/*  100% {*/
/*    fill: #ffa965;*/
/*    stroke: #ffa965;*/
/*  }*/
/*}*/

/*
------ navigation animation ------
*/

/*
------ animation type = dot ------
*/
a.circle.walking {
  background-color: #2cc197;
}

a.circle.walking.with-pulse:before {
  border: 2px solid #2cc197;
}

/*
------ animation type = line ------
*/
@keyframes navigation-line-animation {
  0% {
    stroke: #2cc197;
  }
  50% {
    stroke: #8C3753;
  }
  100% {
    stroke: #2cc197;
  }
}