.map {
  position: relative;
  display: inline-block;
}

.map img {
  max-width: 115%;
  display: block;
}

#pin-passo-fundo {
  width: 10%;
  height: 12%;
  background-image: url('../img/passo-fundo.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 22%;
  left: 63%;
}

#pin-rio-grande {
  width: 10%;
  height: 11%;
  background-image: url('../img/rio-grande.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 72%;
  left: 60%;
}

#pin-santa-maria {
  width: 10%;
  height: 12%;
  background-image: url('../img/santa-maria.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 35%;
  left: 50%;
}

#pin-venancio {
  width: 10%;
  height: 11%;
  background-image: url('../img/venancio.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 42%;
  left: 61%;
}

#pin-bage {
  width: 10%;
  height: 10%;
  background-image: url('../img/bage.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 62%;
  left: 37%;
}

#pin-bento {
  width: 10%;
  height: 10%;
  background-image: url('../img/bento.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 32%;
  left: 71%;
}

#pin-camaqua {
  width: 10%;
  height: 8%;
  background-image: url('../img/camaqua.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 60%;
  left: 68%;
}

#pin-camboriu {
  width: 10%;
  height: 10%;
  background-image: url('../img/camboriu.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 10%;
  left: 103%;
}

#pin-cangucu {
  width: 10%;
  height: 9%;
  background-image: url('../img/cangucu.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 58%;
  left: 52%;
}

#pin-pelotas {
  width: 10%;
  height: 8%;
  background-image: url('../img/pelotas.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 63%;
  left: 60%;
}

#pin-guaiba {
  width: 10%;
  height: 8%;
  background-image: url('../img/guaiba.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 73%;
}

#pin-jaguarao {
  width: 10%;
  height: 8%;
  background-image: url('../img/jaguarao.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 80%;
  left: 50%;
}

#pin-lajeado {
  width: 10%;
  height: 8%;
  background-image: url('../img/lajeado.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 35%;
  left: 65%;
}

#pin-santa-vitoria {
  width: 10%;
  height: 8%;
  background-image: url('../img/santa-vitoria.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 90%;
  left: 50%;
}

#pin-sao-lourenco {
  width: 10%;
  height: 8%;
  background-image: url('../img/sao-lourenco.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 56%;
  left: 63%;
}

#list {
  left: 12%;
  font-size: 12px;
}