#villages-wrapper { width: 849px; height: 653px; top: 50%;}
#villages-viewport { width: 1698px; height: 1306px; top: -653px; left:0; position: relative;  z-index: 100; overflow:visible; }
#iewrap { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); }
.village .item1_1 { z-index: 11; }
.village .item1_2 { z-index: 12; }
.village .item1_3 { z-index: 13; }
.village .item1_4 { z-index: 14; }
.village .item1_5 { z-index: 15; }
.village .item1_6 { z-index: 16; }
.village .item1_7 { z-index: 17; }
.village .item1_8 { z-index: 18; }
.village .item1_9 { z-index: 19; }
.village .item2_1 { z-index: 21; }
.village .item2_2 { z-index: 22; }
.village .item2_3 { z-index: 23; }
.village .item2_4 { z-index: 24; }
.village .item2_5 { z-index: 25; }
.village .item2_6 { z-index: 26; }
.village .item2_7 { z-index: 27; }
.village .item2_8 { z-index: 28; }
.village .item2_9 { z-index: 29; }
.village .item3_1 { z-index: 31; }
.village .item3_2 { z-index: 32; }
.village .item3_3 { z-index: 33; }
.village .item3_4 { z-index: 34; }
.village .item3_5 { z-index: 35; }
.village .item3_6 { z-index: 36; }
.village .item3_7 { z-index: 37; }
.village .item3_8 { z-index: 38; }
.village .item3_9 { z-index: 39; }
.village .item4_1 { z-index: 41; }
.village .item4_2 { z-index: 42; }
.village .item4_3 { z-index: 43; }
.village .item4_4 { z-index: 44; }
.village .item4_5 { z-index: 45; }
.village .item4_6 { z-index: 46; }
.village .item4_7 { z-index: 47; }
.village .item4_8 { z-index: 48; }
.village .item4_9 { z-index: 49; }
.village .item5_1 { z-index: 51; }
.village .item5_2 { z-index: 52; }
.village .item5_3 { z-index: 53; }
.village .item5_4 { z-index: 54; }
.village .item5_5 { z-index: 55; }
.village .item5_6 { z-index: 56; }
.village .item5_7 { z-index: 57; }
.village .item5_8 { z-index: 58; }
.village .item5_9 { z-index: 59; }
.village .item6_1 { z-index: 61; }
.village .item6_2 { z-index: 62; }
.village .item6_3 { z-index: 63; }
.village .item6_4 { z-index: 64; }
.village .item6_5 { z-index: 65; }
.village .item6_6 { z-index: 66; }
.village .item6_7 { z-index: 67; }
.village .item6_8 { z-index: 68; }
.village .item6_9 { z-index: 69; }
.village .item7_1 { z-index: 71; }
.village .item7_2 { z-index: 72; }
.village .item7_3 { z-index: 73; }
.village .item7_4 { z-index: 74; }
.village .item7_5 { z-index: 75; }
.village .item7_6 { z-index: 76; }
.village .item7_7 { z-index: 77; }
.village .item7_8 { z-index: 78; }
.village .item7_9 { z-index: 79; }
.village .item8_1 { z-index: 81; }
.village .item8_2 { z-index: 82; }
.village .item8_3 { z-index: 83; }
.village .item8_4 { z-index: 84; }
.village .item8_5 { z-index: 85; }
.village .item8_6 { z-index: 86; }
.village .item8_7 { z-index: 87; }
.village .item8_8 { z-index: 88; }
.village .item8_9 { z-index: 89; }
.village .item9_1 { z-index: 91; }
.village .item9_2 { z-index: 92; }
.village .item9_3 { z-index: 93; }
.village .item9_4 { z-index: 94; }
.village .item9_5 { z-index: 95; }
.village .item9_6 { z-index: 96; }
.village .item9_7 { z-index: 97; }
.village .item9_8 { z-index: 98; }
.village .item9_9 { z-index: 99; }
.village { position: relative; }
.village .row div { position: absolute; }

#village-1 { position: absolute; }
#village-2 { position: absolute; left:849px; }
#village-3 { position: absolute; top:653px; }
#village-4 { position: absolute; top:653px; left:849px; }

.tc #ntwlabel{
	background-image: url('../resources/img/ntw_label.png');
	width: 44px;
	height: 131px;
	position: absolute;
	top: 970px;
	left: 125px;
	z-index: 100;
	display:none;
}
.sc #ntwlabel{
	background-image: url('../resources/img/ntw_label_sc.png');
	width: 44px;
	height: 131px;
	position: absolute;
	top: 970px;
	left: 125px;
	z-index: 100;
	display:none;
}
.en #ntwlabel{
	background-image: url('../resources/img/ntw_label_en.png');
	width: 208px;
	height: 36px;
	position: absolute;
	top: 1020px;
	left: 42px;
	z-index: 100;
	display:none;
}
#ntwlabelriver{
	background-image: url('../resources/img/ntw_label_river.png');
	width: 35px;
	height: 66px;
	position: absolute;
	top: 1400px;
	left:-80px;
	z-index: 100;
	display:none;
}
.en #ntwlabelriver{
	background-image: url('../resources/img/ntw_label_river_en.png');
	width: 68px;
	height: 27px;
	position: absolute;
	top: 1377px;
	left:-80px;
	z-index: 100;
	display:none;
}
#ntwlabelshrine{
	background-image: url('../resources/img/ntw_label_shrine.png');
	width: 35px;
	height: 66px;
	position: absolute;
	top: 287px;
	left: 353px;
	z-index: 100;
	display:none;
}
.en #ntwlabelshrine{
	background-image: url('../resources/img/ntw_label_shrine_en.png');
	width: 122px;
	height: 31px;
	position: absolute;
	top: 287px;
	left: 309px;
	z-index: 100;
	display:none;
}
#ntwlabeltinhau{
	background-image: url('../resources/img/ntw_label_tinhau.png');
	width: 35px;
	height: 87px;
	position: absolute;
	top: 720px;
	left: 676px;
	z-index: 100;
	display:none;
}
.en #ntwlabeltinhau{
	background-image: url('../resources/img/ntw_label_tinhau_en.png');
	width: 133px;
	height: 31px;
	position: absolute;
	top: 717px;
	left: 793px;
	z-index: 100;
	display:none;
}


#roadmap { /* hide the road map */
	display:none;
	position: fixed; left:24px; bottom:231px; z-index:200;}
#roadmap-path { width: 175px; height: 152px; background: url('../resources/layout/roadmap_road.png') no-repeat;}
.roadmap-node { width: 14px; height: 14px; position: absolute; cursor: pointer;}
.roadmap-node img { margin-left: 7px; margin-top: 7px; width: 0; height: 0;}
#roadmap-node { top:69px; left: 57px;}
#roadmap-node2 { top:42px; left: 25px;}
#roadmap-node3 { top:28px; left: 113px;}
#roadmap-node4 { top:110px; left: 20px;}
#roadmap-node5 { top:100px; left: 90px;}

#filter { position: fixed; left:60px; bottom:75px; z-index:200;}
#filter ul { list-style-type: none; margin: 0; padding: 0;}
#filter ul li { /*border-bottom: 2px dotted #c5ad95;*/ padding-bottom: 2px; background: url('../resources/layout/dot_line.png') bottom repeat no-repeat; line-height: 34px;}
.tc #filter ul li,.sc #filter ul li  { padding: 0px 0px 4px 0px; }
.en #filter ul li { padding: 3px 0px; }
/*#filter ul li a.disabled { opacity: 0.5; -moz-opacity: 0.5; filter: alpha(opacity=50);}*/
#filter ul li#filter_habit { border: 0px; }
#filter ul li a { display:block; width: 146px; }
.en #filter ul li a { display:block; width: 160px; }
#filter ul li a:link,
#filter ul li a:visited,
#filter ul li a:active,
#filter ul li a:hover { text-decoration: none; color: black;}
#filter ul li a span { margin-left: 9px;}
#filter ul li a img { border: 0; margin-top: 5px; margin-bottom: -6px;}

.labels .label {position:absolute; z-index: 100; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: moz-none; -ms-user-select: none; user-select: none;}
.labels .label.disabled {display:none;}
.labels a img { border:0; width: 32px; height: 33px;}
.labels a:link, .labels a:hover, .labels a:active, .labels a:visited { color: black; text-decoration: none; }
.labels a span {
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity=0);
	display: block;
	position: absolute;
	width: 200px;
	background: white;
	text-align: center;
	border: 1px solid silver;
	border-radius: 5px;
	top: -30px;
	left: 30px;
	display:none;
}
#hkmemorylogo{
	position: fixed;
	bottom: 21px;
	left:54px;
	width: 125px;
	height: 38px;
}
#hkmemorylogo .gray{
	background-image: url('../resources/layout/hkmemory_logo_green.png');
	width: 125px;
	height: 38px;
	/*background-position: left;*/
	opacity: 1;
	position: absolute;
	top:0;
	left: 0;
	cursor: pointer;
	z-index: 0;
}
#hkmemorylogo .color{
	background-image: url('../resources/layout/hkmemory_logo_color.png');
	width: 125px;
	height: 38px;
	/*background-position: right;*/
	opacity: 1;
	position: absolute;
	top:0;
	left: 0;
	cursor: pointer;
	z-index: 1;
}