#map_home {
  position: relative;
  width: 300px;
  height: 280px;
  margin: 0 auto;
  background-image: url(../images/map/map_home.png);
  background-repeat: no-repeat;
  background-size:contain;
}
.navigation {
  margin: 0px auto;
}
.navigation .city {
  position: absolute;
}
.perth {
  top: 38%;
  left: 3%;
}
.sydney {
  top: 40%;
  left: 67%;
}
.melbourne {
  top: 55%;
  left: 56%;
}
.auckland {
  top: 40%;
  left: 89%;
}
a.icon {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 0px;
  left: 0px;
  cursor: pointer;
  background: transparent url(../images/map/s_circle.png) no-repeat 0px 0px;
}
.city img.circle {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 20px;
  height: 20px;
  opacity: 0.1;
}
.city h2{
  position: absolute;
  color: #ffffff;
  font-size: 11px;
  font-weight: bold;
  top: 20px;
  left: -30px;
  line-height: 11px !important;
  text-align: center;
  text-transform: uppercase;
  background-color: #000000;
  border-radius: 15px;
  padding: 3px 6px !important;
}
.city h2:hover{
  background:#dddddd;
  color:#000;
}
.city ul {
  list-style: none;
  display: block;
  position: absolute;
  background-color: #f3f3f3;
  color: #333333;
  padding: 0px 10px 0px;
  width: 300px;
  display: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #ffffff;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(204,204,204,1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(204,204,204,1);
  box-shadow: 0px 0px 3px 0px rgba(204,204,204,1);
}
.city ul table {
  background-color: #fff;
}
table caption {
  font-size: 18px;
  margin: 10px;
  font-family: Roboto, arial, serif;
}
.sydney ul {
  right: -50px;
  top: -220px;
}
.melbourne ul {
  right: -105px;
  top: -250px;
}
.perth ul {
  right: -270px;
  top: -200px;
}
.auckland ul {
  right: -90px;
  top: -200px;
}
.city ul li {
  font-size: 13px;
  line-height: 120%;
  text-decoration: none;
  padding: 5px;
}
.city ul li a:hover {
  color: #D2DFDE;
}