
html, a, button {
	-ms-touch-action: manipulation;	/* IE10  */
	touch-action: manipulation; /* IE11+ */
}

/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #000; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #a8674b;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #a8674b; 
}

#mapplic { height: calc(100vh - 149px) !important; }
.mapplic-container { height: calc(100vh - 149px) !important; }
.mapplic-toggle p { line-height: 20px; }
.mapplic-legend-label span { vertical-align: top; }

.mapplic-pin.circular { background-color: #ffffff; color: #333333; }
.mapplic-pin.pin-md { line-height: 18px !important; }
.mapplic-pin.pin-yellow { background-color: #f5c892; color: #333333; }

/*Sidebar*/
.mapplic-sidebar { width: 320px; padding: 0px !important; background-color: #d7cbc1; }
/*.mapplic-filter { display: none !important; }*/
.mapplic-list-location.mapplic-active > a { background-color: rgba(65,50,43,0.2);  }
.mapplic-list-container .mapplic-dir-item a { padding: 8px 12px; }
.mapplic-sidebar .mapplic-dir-item:hover > a, .mapplic-sidebar .mapplic-dir-item > a:focus, .mapplic-sidebar .mapplic-dir-item.mapplic-active > a { background-color: rgba(0, 0, 0, 0.2); padding: 8px 12px; }
.mapplic-dir-item.mapplic-active > a {border: none !important;}
.mapplic-list-location h4 { font-size: 12px; margin: 1.5px 0 !important; }
.mapplic-list-container { box-shadow: none !important; background-color: #d7cbc1; }
/*.mapplic-dir-item h4 { color: #fff !important; }*/
.mapplic-dir-item h4 p { margin-bottom: 0; }
.mapplic-container { width: calc(100% - 320px); }
.mapplic-thumbnail-placeholder { width: 26px; height: 26px; line-height: 15px; text-align: center; font-size: 10px; padding: 4px; background-color: #a987b6; border-radius: 50%; }
.mapplic-thumbnail { margin-right: 6px; }

.mapplic-tooltip-content { margin: 0 !important; }

.mapplic-pin.pin-label:before {
    content: '';
    border: 2px solid rgba(255, 0, 0, 0.75);
    border-radius: 30px;
    height: inherit;
    width: inherit;
    top: -4px;
    left: -4px;
    position: absolute;
    animation: pulsate 1.8s ease-out;
    animation-iteration-count: infinite;
    animation-delay: 1s;
    opacity: 0;
}

.mapplic-list-container li:nth-child(1) a { 
  cursor: default; background-color: transparent !important;
  padding: 8px 12px 0px 12px;
}

.mapplic-list-container li:nth-child(2) a,
.mapplic-list-container li:nth-child(7) a,
.mapplic-list-container li:nth-child(20) a,
.mapplic-list-container li:nth-child(27) a,
.mapplic-list-container li:nth-child(39) a { 
  cursor: default; background-color: transparent !important;
  padding: 4px 10px;
}

.mapplic-list-container li:nth-child(1) .mapplic-thumbnail-placeholder, 
.mapplic-list-container li:nth-child(2) .mapplic-thumbnail-placeholder, 
.mapplic-list-container li:nth-child(7) .mapplic-thumbnail-placeholder, 
.mapplic-list-container li:nth-child(20) .mapplic-thumbnail-placeholder, 
.mapplic-list-container li:nth-child(27) .mapplic-thumbnail-placeholder, 
.mapplic-list-container li:nth-child(39) .mapplic-thumbnail-placeholder { 
  display: none; 
}

.mapplic-list-container li:nth-child(1) h4 { 
  font-size: 18px !important; font-weight: bold !important;
}
.mapplic-list-container li:nth-child(2) h4,
.mapplic-list-container li:nth-child(7) h4,
.mapplic-list-container li:nth-child(20) h4,
.mapplic-list-container li:nth-child(27) h4,
.mapplic-list-container li:nth-child(39) h4 { 
  font-size: 14px !important; font-weight: bold !important;
  color: #fff;
  padding:  4px 10px;
}

.mapplic-list-container li:nth-child(2) h4 { background-color: #27bdbe; }
.mapplic-list-container li:nth-child(7) h4 { background-color: #fcaf17; }
.mapplic-list-container li:nth-child(20) h4 { background-color: #dc597e; }
.mapplic-list-container li:nth-child(27) h4 { background-color: #a987b6; }
.mapplic-list-container li:nth-child(39) h4 { background-color: #90754d; }

.mapplic-list-container li:nth-child(3) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(4) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(5) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(6) a .mapplic-thumbnail-placeholder { 
  background-color: #27bdbe; 
}

.mapplic-list-container li:nth-child(8) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(9) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(10) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(11) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(12) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(13) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(14) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(15) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(16) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(17) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(18) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(19) a .mapplic-thumbnail-placeholder { 
  background-color: #fcaf17; 
}

.mapplic-list-container li:nth-child(21) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(22) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(23) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(24) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(25) a .mapplic-thumbnail-placeholder,
.mapplic-list-container li:nth-child(26) a .mapplic-thumbnail-placeholder { 
  background-color: #dc597e; 
}

.mapplic-list-container li:nth-child(40) a .mapplic-thumbnail-placeholder { 
  background-color: #90754d; 
}

.mapplic-list-container li:nth-child(41),
.mapplic-list-container li:nth-child(42),
.mapplic-list-container li:nth-child(43),
.mapplic-list-container li:nth-child(44),
.mapplic-list-container li:nth-child(45),
.mapplic-list-container li:nth-child(46),
.mapplic-list-container li:nth-child(47),
.mapplic-list-container li:nth-child(48),
.mapplic-list-container li:nth-child(49),
.mapplic-list-container li:nth-child(50) {
  display: none;
}



.unit-type { position: absolute; left: 290px; top: 10px; width: 280px; z-index: 8; }
.unit-color { width: 45px; height: 18px; margin-top: -2px; margin-right: 5px; border-radius: 0; vertical-align: middle; }
.unit-studio { background-color: #89a4a0; }
.unit-1bed { background-color: #ddd6ce; }
.unit-1bed-study { background-color: #b0a99f; }
.unit-2bed { background-color: #c5d4c2; }
.unit-2bed-study { background-color: #7b977d; }
.unit-3bed { background-color: #c2756f; }
.unit-studio, .unit-1bed, .unit-1bed-study, .unit-2bed, .unit-2bed-study, .unit-3bed { color: #333; }

.unit-type .list-group-item { padding: 5px 10px; }
.list-group-item { color: #666; font-size: 12px; }
.list-group-item.active {
    background-color: #41322B;
    border-color: #41322B;
}

.compus { position: absolute; float: left; top: 5px; right: 5px; width: 100px; height: 100px; border-radius: 20px; z-index: 2; }
.compus img { width: 100px; height: auto; }

.drone { position: absolute; top: 40px; height: 50px; left: 57%; }
.drone a { position: relative; float: left; display: inline-block; margin-right: 20px; text-align: center; color: #333; font-size: 11px; }
.drone a img { margin-bottom: 5px; }

.scale { position: absolute; bottom: 10px; right: 5px; width: 500px; height: 83px; border-radius: 20px; z-index: 8; }

.bp-approval { position: absolute; bottom: 5px; right: 5px; width: auto; height: auto; border-radius: 20px; z-index: 8; font-size: 14px; text-align: right; padding: 10px; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
	.mapplic-pin {
	    background-image: url(../images/drone.svg);
	}
}
/*Animation*/
/*#science-park, #retail, #business-park, #mrt {
  animation: flash 3s ease-in-out alternate infinite;
  -moz-transform-origin: 25px 25px;
  -webkit-filter: blur(2px);
  filter: blur(2px);
}*/

#mrt {
  animation: flash 3s ease-in-out alternate infinite;
}

/*.mapplic-list-container li:nth-child(5), .mapplic-list-container li:nth-child(7), .mapplic-list-container li:nth-child(8), .mapplic-list-container li:nth-child(36) { display: none; }*/

@media (max-width: 767.98px) {
	.mapplic-lightbox { max-width: 80%; }

	.mapplic-portrait .mapplic-container, .mapplic-portrait .mapplic-sidebar { width: 100% !important; }
	.mapplic-sidebar { display: none !important; background-color: transparent !important; }
	p { line-height: normal; }

  .unit-type { display: none; }
  .compus { width: 50px; height: 50px; }
  .compus img { width: 50px; height: auto; }
  .bp-approval { left: 10px; right: auto; font-size: 11px; line-height: auto; text-align: left !important; }

  .drone { position: absolute; top: 20px; height: 30px; left: 35%; }
  .drone a { position: relative; float: left; display: inline-block; margin-right: 20px; text-align: center; color: #333; font-size: 11px; }
  .drone a img { width: 30px; height: auto; }

  .mapplic-minimap { top: 0px; bottom: auto; }
}

@media (max-width: 575.98px) {

  .mapplic-lightbox { max-width: 80%; }

  .mapplic-portrait .mapplic-container, .mapplic-portrait .mapplic-sidebar { width: 100% !important; }
  .mapplic-sidebar { display: none !important; background-color: transparent !important; }
  p { line-height: normal; }

  .unit-type { display: none; }
  .compus { width: 50px; height: 50px; }
  .compus img { width: 50px; height: auto; }
  .bp-approval { left: 10px; right: auto; font-size: 11px; line-height: auto; text-align: left !important; }

  .drone { position: absolute; top: 20px; height: 30px; left: 35%; }
  .drone a { position: relative; float: left; display: inline-block; margin-right: 20px; text-align: center; color: #333; font-size: 11px; }
  .drone a img { width: 30px; height: auto; }

  .mapplic-minimap { top: 0px; bottom: auto; }

  /*.mapplic-clear-button { bottom: 129px; }
  .mapplic-zoom-buttons { bottom: 60px; }*/
	
}

