@charset "utf-8";
/* CSS Document */
.marker-text
{
   background: #ffff;
   color: #001c36;
    border: none;
    font-weight: bold;
    padding: 4px;
    line-height: 36px;
    opacity: 0.8;
    font-size: 16px;
}

.hidepopup
{
	display:none !important;
	opacity:0;
}

.showpopup
{
	display:block important;
	opacity:1;
}

.marker_camp-site {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 75.4%;
    top: 34%;
    background: url("../images/marker-icons-01.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
 .markerstring_camp-site {
  display: none;
  width:auto;
   height: 3.4%;
   left: 37%;
   top: 28%;
   background-size: 15% auto;
 }
 
  .map-3 .markerpopup_camp-site{
    display: none;
    width: 340px;
    height: 210px;
    left: 60%;
    top: 38%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
 } 

 .map-2 .markerpopup_camp-site{
    display: none;
    width: 340px;
    height: 210px;
    left: 67%;
    top: 38%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
 }
  
  .map-1 .markerpopup_camp-site{
    display: none;
    width: 340px;
    height: 210px;
    left: 68%;
    top: 38%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
 }
 

 .markerpopup_camp-site.arrow-top {
  margin-top: 40px;
}

.markerpopup_camp-site.arrow-top:after {
    content: " ";
    position: absolute;
    right: 45px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}

 
 
 .marker_caravan-park {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 80.8%;
    top: 36.5%;
   background: url("../images/marker-icons-01.svg") center center no-repeat transparent;
   background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_caravan-park {
  display: none;
  width:auto;
   height: 3.4%;
left: 50%;
    top: 27.4%;
   background-size: 15% auto;
 }
 
 
  .map-3 .markerpopup_caravan-park{
  display: none;
    width: 340px;  
  height: 216px;
    left: 64%;
    top: 38%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
    padding:10px;
  z-index:5;
  
}

.map-2 .markerpopup_caravan-park{
  display: none;
    width: 340px;  
	height: 240px;
    left: 72%;
    top: 38%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
  
}

  .map-1 .markerpopup_caravan-park{
  display: none;
    width: 340px;  
  height: 240px;
    left: 74%;
    top: 38%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
    padding:10px;
  z-index:5;
  
}
 
 
 .markerpopup_caravan-park.arrow-top {
  margin-top: 40px;
}

.markerpopup_caravan-park.arrow-top:after {
    content: " ";
    position: absolute;
    right: 35px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}

 .marker_damani {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 89%;
    top: 42%;
   background: url("../images/marker-icons-02.svg") center center no-repeat transparent;
   background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_damani {
  display: none;
  width:auto;
   height: 3.4%;
   left: 30.6%;
    top: 41%;
   background-size: 15% auto;
 }
 
  .map-3 .markerpopup_damani {
  display: none;
   width: 340px;  
   height: 216px;
  left: 70%;
  top: 47%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
 }

   .map-1 .markerpopup_damani {
  display: none;
   width: 340px;  
   height: 250px;
  left: 80%;
  top: 47%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
    padding:10px;
  z-index:5;
 }

    .map-2 .markerpopup_damani {
  display: none;
   width: 340px;  
   height: 250px;
  left: 80%;
  top: 47%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
    padding:10px;
  z-index:5;
 }


 
  .markerpopup_damani.arrow-top {
  margin-top: 40px;
}
 
  .markerpopup_damani.arrow-top:after {
    content: " ";
    position: absolute;
    right: 35px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}

 .marker_heritagevillage {
  display: block;
    width: 1.75%;
    height: 2.5%;
    left: 31%;
    top: 50%;
   background: url("../images/marker-icons-03.svg") center center no-repeat transparent;
   background-size: 100% auto;
	z-index:3;
 }
 
 
  .markerstring_heritagevillage {
  display: none;
  width: auto;
    height: 3.4%;
    left: 54.3%;
    top: 38%;
   background-size: 15% auto
 }

 .markerpopup_heritagevillage {
 display: none;
   width: 340px;   
   height: 216px;
   left: 34.4%;
   top: 50%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
 }

  .markerpopup_heritagevillage.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    top: 16px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}



 .marker_kayak {
  display: block;
    width: 1.75%;
    height: 2.5%;
    left: 15%;
    top: 68%;
   background: url("../images/marker-icons-04.svg") center center no-repeat transparent;
   background-size: 100% auto;
	z-index:3;
 }
 
 
  .markerstring_kayak {
  display: none;
  width: auto;
    height: 3.4%;
    left: 39.5%;
    top: 70%;
   background-size: 15% auto
 }


.markerpopup_kayak {
display: none;
   width: 455px;  
   height: 270px;
   left: 18.2%;
   bottom: 27%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
 }
 
 
.markerpopup_kayak.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    bottom: 11px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}

 .marker_sedr {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 18%;
    top: 83%;
    background: url("../images/marker-icons-05b.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_sedr{
    display: none;
    width:auto;
    height: 2%;
    left: 65.5%;
    top: 25.9%;
    background-size: 15% auto;
 }
 
  .map-3 .markerpopup_sedr{
    display: none;
    width: 340px;   
	height: 216px;
    left: 22.3%;
    top: 68%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }

 .map-2 .markerpopup_sedr {
    display: none;
    width: 340px;   
  height: 216px;
    left: 22.3%;
    top: 74%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
 }
 
  .map-1 .markerpopup_sedr {
    display: none;
    width: 340px;   
  height: 216px;
    left: 22.3%;
    top: 77%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
 }


.markerpopup_sedr.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    bottom: 16px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}
 
 
  .marker_sedr-recep {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 22%;
    top: 59%;
    background: url("../images/marker-icons-05.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_sedr-recep{
    display: none;
    width:auto;
    height: 2%;
    left: 65.5%;
    top: 25.9%;
    background-size: 15% auto;
 }
 
  .markerpopup_sedr-recep{
    display: none;
    width: 340px;   
	height: 210px;
    left: 25.3%;
    top: 57%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }
 

.markerpopup_sedr-recep.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    top: 16px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}
 
 
 
  .marker_hatta-dam {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 18%;
    top: 72%;
    background: url("../images/marker-icons-06.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_hatta-dam{
    display: none;
    width:auto;
    height: 2%;
    left: 64.3%;
    top: 29%;
    background-size: 15% auto;
 }
 
  .map-3 .markerpopup_hatta-dam{
    display: none;
    width: 340px;    
	height: 216px;
    left: 22.1%;
    top: 55%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }

  .map-2 .markerpopup_hatta-dam{
    display: none;
    width: 340px;    
  height: 200px;
    left: 22.1%;
    top: 62%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
   
 }
 
  .map-1 .markerpopup_hatta-dam{
    display: none;
    width: 340px;    
  height: 200px;
    left: 22.1%;
    top: 64%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
   
 }

.markerpopup_hatta-dam.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    bottom: 11px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}
 
 
   .marker_hatta-fort {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 57%;
    top: 21%;
    background: url("../images/marker-icons-07.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
  
 
  .markerpopup_hatta-fort{
    display: none;
    width: 340px;   
	height: 216px;
    left: 55.5%;
    top: 25%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }

    .markerpopup_hatta-fort.arrow-top {
  margin-top: 40px;
}

.markerpopup_hatta-fort.arrow-top:after {
    content: " ";
    position: absolute;
    left: 15px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}

 

   .marker_hatta-hill {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 44%;
    top: 48%;
    background: url("../images/marker-icons-08.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_hatta-hill{
    display: none;
    width:auto;
    height: 2%;
    left: 65%;
    top: 19%;
    background-size: 15% auto;
 }
 
  .map-3 .markerpopup_hatta-hill{
    display: none;
    width: 340px; 
	height: 216px;
    left: 31.9%;
    top: 50%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }

  .markerpopup_hatta-hill{
    display: none;
    width: 340px; 
  height: 216px;
    left: 39%;
    top: 50%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
   
 }


 .markerpopup_hatta-hill.arrow-top {
  margin-top: 40px;
}

.markerpopup_hatta-hill.arrow-top:after {
    content: " ";
    position: absolute;
    left: 164px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}


 .marker_ja-hatta {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 59%;
    top: 19%;
    background: url("../images/marker-icons-09.svg") center center no-repeat transparent;
    background-size: 100% auto;
	z-index:3;
 }
 
   .markerpopup_ja-hatta{
    display: none;
    width: 340px; 
	height: 200px;
    left: 59.9%;
    top: 22%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }
 
 
  .markerpopup_ja-hatta.arrow-top {
  margin-top: 40px;
}

.markerpopup_ja-hatta.arrow-top:after {
    content: " ";
    position: absolute;
    left: 15px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}



  .marker_biking {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 81%;
    top: 45%;
    background: url("../images/marker-icons-09.svg") center center no-repeat transparent;
    /*background: url("../images/marker-icons-11.svg") center center no-repeat transparent;*/
    background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_biking{
    display: none;
    width:auto;
    height: 2%;
    left: 66.8%;
    top: 25.9%;
    background-size: 15% auto;
 }
 
  .map-3 .markerpopup_biking{
    display: none;
    width: 385px;   
	height: 238px;
    left: 61%;
    top: 47%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }

  .map-2 .markerpopup_biking{
    display: none;
    width: 385px;   
  height: 273px;
    left: 70%;
    top: 47%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
   
 }

   .map-1 .markerpopup_biking{
    display: none;
    width: 385px;   
  height: 273px;
    left: 72%;
    top: 47%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
  padding:10px;
  z-index:5;
   
 }

 
     .markerpopup_biking.arrow-top {
  margin-top: 40px;
}

.markerpopup_biking.arrow-top:after {
    content: " ";
    position: absolute;
    right: 15px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}



   .marker_hatta-sign {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 64%;
    top: 47%;
    background: url("../images/marker-icons-10.svg") center center no-repeat transparent;
    /*background: url("../images/marker-icons-12.svg") center center no-repeat transparent;*/
    background-size: 100% auto;
	z-index:3;
 }
 
  .markerstring_hatta-sign{
    display: none;
    width:auto;
    height: 2%;
    left: 51%;
    top: 21%;
    background-size: 15% auto;
 }
 
  .markerpopup_hatta-sign{
    display: none;
    width: 340px;   
	height: 217px;
    left: 63%;
    top: 50%;;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }
 
 
     .markerpopup_hatta-sign.arrow-top {
  margin-top: 40px;
}

.markerpopup_hatta-sign.arrow-top:after {
    content: " ";
    position: absolute;
    left: 15px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}



 .marker_watch-tower {
  display: block;
    width: 1.75%;
    height: 2.5%;
    left: 30%;
    top: 42%;
   background: url("../images/marker-icons-11.svg") center center no-repeat transparent;
   /*background: url("../images/marker-icons-13.svg") center center no-repeat transparent;*/
   background-size: 100% auto;
	z-index:3;
 }
 
 
  .markerstring_watch-tower {
  display: none;
  width: auto;
    height: 3.4%;
    left: 30%;
    top: 42%;
   background-size: 15% auto
 }

 .markerpopup_watch-tower {
 display: none;
   width: 340px;   
   height: 214px;
   left: 33%;
   top: 40%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
 }

.markerpopup_watch-tower.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    top: 11px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}


   .marker_wadipark {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 54%;
    top: 29%;
    background: url("../images/marker-icons-13.svg") center center no-repeat transparent;
    /*background: url("../images/marker-icons-15.svg") center center no-repeat transparent;*/
    background-size: 100% auto;
	z-index:3;
 }
 
  
 
  .markerpopup_wadipark{
    display: none;
    width: 340px;   
	height: 216px;
    left: 54%;
    top: 29%;
    background-size: 15% auto;
    background-color: #ffffff;
    position: absolute;
	padding:10px;
	z-index:5;
   
 }

    .markerpopup_wadipark.arrow-top {
  margin-top: 40px;
}

.markerpopup_wadipark.arrow-top:after {
    content: " ";
    position: absolute;
    left: 15px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}




 .marker_wadihub {
    display: block;
    width: 1.75%;
    height: 2.5%;
    left: 83%;
    top: 41%;
   background: url("../images/marker-icons-14.svg") center center no-repeat transparent;
   /*background: url("../images/marker-icons-16.svg") center center no-repeat transparent;*/
   background-size: 100% auto;
	z-index:3;
 }
  
.map-3 .markerpopup_wadihub{
  display: none;
    width: 400px;  
	height: 245px;
    left: 64%;
    top: 43%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
  
}

.map-2 .markerpopup_wadihub{
  display: none;
    width: 400px;  
  height: 250px;
    left: 71%;
    top: 43%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
    padding:10px;
  z-index:5;
  
}

.map-1 .markerpopup_wadihub{
  display: none;
    width: 400px;  
  height: 250px;
    left: 74%;
    top: 43%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
    padding:10px;
  z-index:5;
  
}
 
 .markerpopup_wadihub.arrow-top {
  margin-top: 40px;
}

.markerpopup_wadihub.arrow-top:after {
    content: " ";
    position: absolute;
    right: 35px;
    top: -36px;
    border-top: none;
    border-right: 29px solid transparent;
    border-left: 30px solid transparent;
    border-bottom: 39px solid #FFF;
}


 .marker_shaareea {
  display: block;
    width: 1.75%;
    height: 2.5%;
    left: 33%;
    top: 46%;
   background: url("../images/marker-icons-12.svg") center center no-repeat transparent;
   /*background: url("../images/marker-icons-14.svg") center center no-repeat transparent;*/
   background-size: 100% auto;
	z-index:3;
 }
 
 .markerpopup_shaareea {
 display: none;
   width: 340px;   
   height: 216px;
   left: 37%;
   top: 43%;
  background-size: 15% auto;
  background-color: #ffffff;
  position: absolute;
  	padding:10px;
	z-index:5;
 }

  .markerpopup_shaareea.arrow-left:after {
    content: " ";
    position: absolute;
    left: -40px;
    top: 16px;
    border-top: 30px solid transparent;
    border-right: 40px solid #FFF;
    border-left: none;
    border-bottom: 30px solid transparent;
}