#map, #map-page{
  height: 500px;
}
#map .self, #map-page .self {
  background-size: cover;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0 15px #f3c739;
	animation: pulse 1s infinite;
}
#map .offer-marker, #map-page .offer-marker {
  font-family: "Roboto Condensed", serif !important;
  cursor: pointer;
  font-size: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#map .summ, #map-page .summ{
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  position: absolute;
  bottom: 10px;
  left: 12px;
  font-size: 18px;
  font-family: "Gotham-Bold";
}
#map .money, #map-page .money{
  height: 25px;
  width: 25px;
  background: url(../img/coins.svg) no-repeat;
}
#map .location, #map-page .location{
  background: url(../img/shower-logo.svg) no-repeat;
  height: 50px;
  width: 50px;
  box-shadow: 0 0 10px #74c1ea;
  border-radius: 50%;
  opacity: .8;

}
#map .geocoder, #map-page .geocoder  {
     position:absolute;
     z-index:1;
     width:50%;
     left:50%;
     margin-left:-25%;
     top:70px;
 }
#map .mapboxgl-ctrl-geocoder, #map-page .mapboxgl-ctrl-geocoder {
  min-width:100% !important;
}

@keyframes pulse {


0% {
    -moz-box-shadow: 0 0 3px rgba(250,200, 57, .5);
    box-shadow: 0 0 3px rgba(250,200, 57, .5);
    height: 60px;
    width: 60px;
}

50% {
  -moz-box-shadow: 0 0 0 10px rgba(250,200, 57, .8);
  box-shadow: 0 0 10px rgba(250,200, 57, .8);
  height: 65px;
  width: 65px;
}

100% {
    -moz-box-shadow: 0 0 3px rgba(250,200, 57, .5);
    box-shadow: 0 0 3px rgba(250,200, 57, .5);
    height: 60px;
    width: 60px;
}

}

#map .show-me-block, #map-page .show-me-block{
height: 32px;
width: 32px;
position: absolute;
right: 9px;
top: 175px;
padding: 7px;
background-color: #fff;
border: 2px solid #ccc;
border-radius: 5px;
cursor: pointer;
}

#map .show-me-block:hover, #map-page .show-me-block:hover{
background-color: #f7f7f7;
}

#map .show-me-block .locator, #map-page .show-me-block .locator{
background: url(../img/mylocation.png);
background-size: 50%;
position: absolute;
background-repeat: no-repeat;
width: 30px;
height: 30px;
}
#map .mapboxgl-popup, #map-page .mapboxgl-popup{
width: 250px;
z-index: 5;
font-family: "Roboto Condensed", serif !important;
}

#map .mapboxgl-popup-content, #map-page .mapboxgl-popup-content{
padding: 0;
background: none !important;
}

#map .card-wrapper, #map-page .card-wrapper{
margin: 0 !important;
width: auto !important;
background: #fff;
border-radius: 5px;
}


#map .card-wrapper a, #map-page .card-wrapper a{
display: block;
font-family: "Gotham-Regular";
margin: 15px;
text-decoration: none;
color: #555;
font-size: 14px;
}


#map .card-wrapper .icon, #map-page .card-wrapper .icon{
width: 25px;
height: 25px;
}

#map .card-wrapper .icon-star, #map-page .card-wrapper .icon-star{
color: #ffe5a5 !important;
}

#map .card-wrapper .icon-star:hover, #map-page .card-wrapper .icon-star:hover{
color: #ffcf59 !important;
}

#map .card-wrapper .icon:hover, #map-page .card-wrapper .icon:hover{
transform: none !important;
}


#map .card-wrapper .header .map .location, #map-page .card-wrapper .header .map .location{
box-shadow: none;
}

#map .icon, #map-page .icon{
font-family: "fontello";
color: #356771 !important;
margin: 0;
text-decoration: none !important;
}