/*SITEMAP SIBENTANG*/
.sitemap-sibentang{
	position:relative;
	background:url(../img/sitemap.jpg) no-repeat center center;
	width:960px;
	height:640px;
	margin-left:auto;
	margin-right:auto;	
	}
.villa-lili,
.villa-melati,
.villa-seruni,
.villa-padma,
.villa-dahlia,
.villa-cendana,
.villa-aster,
.villa-anggrek,
.villa-soka,
.villa-mawar{
	position:absolute;
	height:10px;
	width:10px;
	border-radius:50%;
	cursor:pointer;
	background: rgb(252,149,53); /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover,  rgba(252,149,53,1) 0%, rgba(255,0,0,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(252,149,53,1)), color-stop(100%,rgba(255,0,0,1))); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(252,149,53,1) 0%,rgba(255,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  rgba(252,149,53,1) 0%,rgba(255,0,0,1) 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  rgba(252,149,53,1) 0%,rgba(255,0,0,1) 100%); /* IE10+ */
	background: radial-gradient(ellipse at center,  rgba(252,149,53,1) 0%,rgba(255,0,0,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fc9535', endColorstr='#ff0000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
.villa-lili{
	top: 322px;
	left: 257px;
}
.villa-melati{
	top: 227px;
	left: 360px;
}
.villa-seruni{
	top: 216px;
	left: 445px;
}
.villa-padma{
	top: 441px;
	left: 430px;
}
.villa-dahlia{
	top: 266px;
	left: 551px;
}
.villa-cendana{
	top: 443px;
	left: 538px;
}
.villa-aster{
	top: 286px;
	left: 657px;
}
.villa-anggrek{
	top: 436px;
	left: 655px;
}
.villa-soka{
	top: 292px;
	left: 747px;
}
.villa-mawar{
	top: 426px;
	left: 770px;
}	

/*SITEMAP SUMBER ALAM*/
.siteMap{position:relative;width:960px;height:820px;background:url(../img/sitemap-1.jpg) no-repeat center center;margin-left:auto;margin-right:auto}
.map-1,.map-2,.map-3,.map-4,.map-5,.map-6,.map-7,.map-8,.map-9,.map-10,.map-11,.map-12,.map-13,.map-14,.map-15,.map-16,.map-17,.map-18,.map-19,.map-20,.map-21,.map-22,.map-23,.map-24,.map-25,.map-26{position:absolute;height:25px;width:25px;display:block;font-size:13px;}
.map-1{top:60px;right:360px}
.map-2{top:114px;right:387px}
.map-3{top:125px;right:332px}
.map-4{top:157px;right:318px}
.map-5{top:187px;right:346px}
.map-6{top:128px;right:478px}
.map-7{top:179px;right:524px}
.map-8{top:166px;right:596px}
.map-9{top:248px;right:459px}
.map-10{top:283px;right:476px}
.map-11{top:552px;right:303px}
.map-12{top:505px;right:310px}
.map-13{top:453px;right:331px}
.map-14{top:465px;right:373px}
.map-15{top:410px;right:345px}
.map-16{top:424px;right:397px}
.map-17{top:402px;right:451px}
.map-18{top:452px;right:437px}
.map-19{top:514px;right:413px}
.map-20{top:482px;right:483px}
.map-21{top:536px;right:476px}
.map-22{top:578px;right:453px}
.map-23{top:565px;right:499px}
.map-24{top:539px;right:544px}
.map-26{top:644px;right:620px}
.map-25{top:580px;right:582px}


/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
	position: relative;
	z-index: 2;
	cursor: pointer;
}

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  	visibility: hidden;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	pointer-events: none;
}

/* Position tooltip above the element */
[data-tooltip]:before {
	position: absolute;
	bottom: 20%;
	left: 50%;
	margin-bottom: 5px;
	margin-left: -80px;
	padding:5px;
	min-width:90px;
	-webkit-border-radius: 3px;
	-moz-border-radius:    3px;
	border-radius:         3px;
	background-color: #000;
	background-color: hsla(0, 0%, 20%, 0.9);
	color:#fff;
	content: attr(data-tooltip);
	text-align: center;
	line-height: 25px;
}



/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
	position: relative;
	z-index: 2;
	cursor: pointer;
	}

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	pointer-events: none;
}

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
	visibility: visible;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
	left:10px;
}

