.points-in-wrapper{
	position: relative;
	margin: 30px 0px;
	display: inline-block;
	max-width: 100%;
}
.points-in-wrapper .points-in-image{
	position: relative;
	z-index: 10;
}
.points-in-wrapper .point-in-item{
	position: absolute;
	z-index: 99;
    padding: 0px 0px;
    display: block;
    width: 25px;
    min-height: 15px;
    border-radius: 3px;
    cursor: pointer;
    /*
	background: #FFF;
	*/
	box-shadow: 0 2px 5px 0px rgba(0,0,0, 0.4);
    color: #333;
    cursor: pointer;
}
.points-in-wrapper .point-in-item::before{
	content: '';
	display: block;
	width: 25px;
	height: 25px;
	/*
	mask-image: url('data:image/svg+xml;utf8,<svg width="20px" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg" ><g id="pin"><path id="map-marker" d="m32 5a21 21 0 0 0 -21 21c0 17 21 33 21 33s21-16 21-33a21 21 0 0 0 -21-21zm0 31a10 10 0 1 1 10-10 10 10 0 0 1 -10 10z"></path></g></svg>');
  */
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="25" viewBox="0 0 24 24"><path d="M12 4.7c0 .4 1.2 2 2.7 3.5l2.7 2.8h-7.2c-4.1 0-7.2.4-7.2 1s3.1 1 7.2 1h7.2l-2.7 2.8c-3 3.1-3.3 4.2-1.4 4.2 1.8 0 7.7-6.2 7.7-8.1 0-1.8-6.1-7.9-7.8-7.9-.7 0-1.2.3-1.2.7"/></svg>');
  
    mask-size: auto 22px;
    mask-repeat: no-repeat;
	mask-position: 4px;
    transition: background-color 300ms;
    /*
    background-color: #195c9e;
    */
    background-color: #eff2f4;
}
.points-in-wrapper .point-in-item.checkpoint::before{
	content: '';
	display: block;
	width: 30px;
	height: 30px;
	mask-image: url('data:image/svg+xml;utf8,<svg version="1.1" width="20" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 330 330" style="enable-background:new 0 0 330 330;" xml:space="preserve"><g><path d="M165,0C74.019,0,0,74.019,0,165s74.019,165,165,165s165-74.019,165-165S255.981,0,165,0z M165,300 c-74.44,0-135-60.561-135-135S90.56,30,165,30s135,60.561,135,135S239.439,300,165,300z"/><path d="M226.872,106.664l-84.854,84.853l-38.89-38.891c-5.857-5.857-15.355-5.858-21.213-0.001 c-5.858,5.858-5.858,15.355,0,21.213l49.496,49.498c2.813,2.813,6.628,4.394,10.606,4.394c0.001,0,0,0,0.001,0 c3.978,0,7.793-1.581,10.606-4.393l95.461-95.459c5.858-5.858,5.858-15.355,0-21.213 C242.227,100.807,232.73,100.806,226.872,106.664z"/></g></svg>');
    mask-size: auto 22px;
    mask-repeat: no-repeat;
	mask-position: 4px;
    transition: background-color 300ms;
    background-color: #195c9e;
}
.points-in-wrapper .point-in-item.housepoint::before{
	content: '';
	display: block;
	width: 30px;
	height: 30px;
	mask-image: url('data:image/svg+xml;utf8,<svg width="20" viewBox="0 -31 511.99928 511" xmlns="http://www.w3.org/2000/svg"><path d="m504.226562 197.351562-234.707031-192.027343c-7.851562-6.433594-19.164062-6.433594-27.019531 0l-234.703125 192.027343c-7.015625 5.742188-9.648437 15.574219-6.449219 24.046876 3.097656 8.214843 11.175782 13.804687 19.957032 13.804687h64.011718v192.03125c0 11.78125 9.550782 21.335937 21.335938 21.335937h298.714844c11.78125 0 21.335937-9.554687 21.335937-21.335937v-192.03125h64.011719c8.71875 0 16.878906-5.648437 19.957031-13.804687 3.175781-8.410157.511719-18.351563-6.445313-24.046876zm-163.898437-.007812c-.9375 17.339844-7.097656 105.34375-36.394531 134.632812-16.117188 16.117188-37.550782 24.996094-60.34375 24.996094-12.875 0-25.3125-2.832031-36.601563-8.199218-7.09375 19.292968-13.226562 42.71875-17.113281 71.167968l-23.785156-3.25c4.496094-32.882812 11.816406-59.757812 20.34375-81.683594-1.085938-.980468-2.152344-1.988281-3.191406-3.03125-16.121094-16.121093-24.996094-37.554687-24.996094-60.351562 0-22.792969 8.875-44.226562 24.996094-60.347656 29.289062-29.289063 117.289062-35.453125 134.632812-36.390625 6.027344-.347657 11.953125 1.933593 16.242188 6.21875 4.28125 4.285156 6.539062 10.1875 6.210937 16.238281zm0 0"/><path d="m264.140625 267.230469-5.464844-10.6875-5.367187-10.738281c-2.117188 1.0625-40.375 21.0625-66.875 89.207031 6.222656 5.625 13.144531 10.242187 20.554687 13.761719 23.15625-62.964844 56.710938-81.316407 57.152344-81.542969zm0 0"/></svg>');
    mask-size: auto 22px;
    mask-repeat: no-repeat;
	mask-position: 4px;
    transition: background-color 300ms;
    background-color: #195c9e;
}
.points-in-wrapper .point-in-item:hover::before,
.points-in-wrapper .point-in-item.active::before{
	background-color: #629fdb;
}
.points-in-wrapper .point-in-item .point-in-item-caption{
	transition: all 250ms ease-out 0s;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	bottom: 30px;
	width: 240px;
	border-radius: 3px;
    cursor: default;
    background: #FFF;
    box-shadow: 0 2px 5px 0px rgba(0,0,0, 0.4);
	padding: 10px;
	left: 0px;
}
.points-in-wrapper .point-in-item.caption-right .point-in-item-caption{
	bottom: 30px;
	left: initial;
	right: 0px;
}
.points-in-wrapper .point-in-item.caption-bottom .point-in-item-caption{
	bottom: initial;
	top: 30px;
}
.points-in-wrapper .point-in-item.caption-center .point-in-item-caption{
	left: 50%;
	transform: translate(-50%, 0);
}
.points-in-wrapper .point-in-item.active .point-in-item-caption{
	opacity: 1;
	visibility: visible;
	bottom: 40px;
}
.points-in-wrapper .point-in-item.caption-bottom.active .point-in-item-caption{
	bottom: initial;
	top: 40px;
}
.points-in-wrapper .point-in-item .point-in-item-caption .point-in-item-image{
	margin-bottom: 15px;
	overflow: hidden;
	border-radius: 3px;
}
.points-in-wrapper .point-in-item .point-in-item-caption .point-in-item-image img{
	width: 100%;
}
.points-in-wrapper .point-in-item .point-in-item-caption .point-in-item-title{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}
.points-in-wrapper .point-in-item .point-in-item-caption .point-in-item-description{
	color: #444;
}