/* Contact Map */
.contact_map_parent {
	position: relative;
	overflow: hidden;

	&.map_left {
		.thb-expand {
			right: auto;
			left: 20px;
		}
		.contact_map {
			right: auto;
			left: 0;
		}
	}
}

.contact_map {
	h3 {
		font-size: 16px;
		margin-bottom: 5px;
	}
	&.disabled {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
.contact_map {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	z-index: 10;
}

.thb-expand {
	width: 46px;
	height: 46px;
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 99;
	display: none;
	justify-content: center;
	align-items: center;
	background: rgba($black, 0.6);
	@extend .quick-transition;
	@include min-break($break-medium) {
		display: flex;
	}
	svg {
		width: 20px;
		height: 20px;
		g {
			stroke: #fff;
			stroke-width: 4;
		}
	}

	&:hover {
		background: $black;
	}
}
.thb_pin {
	@include translateY(-50%);
	.pin-wrap {
		display: block;
		position: absolute;
	}
	.shadow {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		height: 0;
		@include rotateX(55);
		&:after {
			content: '';
			position: absolute;
			left: -200px;
			top: calc(100% - 5px);
			display: block;
			width: 40px;
			height: 20px;
			border-radius: 50%;
			box-shadow: 200px 0 20px rgba(0,0,0,0.4);
			@include rotateX(55deg);
		}
	}
	.pulse {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		height: 0;
		@include rotateX(65);
		&:after {
			content: '';
	    display: block;
	    position: absolute;
	    top: -2px;
	    left: 0;
	    width: 40px;
	    height: 20px;
	    animation: thb-pulsate 1s ease-out;
	    animation-delay: 1.1s;
	    animation-iteration-count: infinite;
	    opacity: 0;
	    border-radius: 50%;
	    box-shadow: 0 0 1px 2px rgba($black, 0.4), 0 0 6px 3px rgba($black, 0.6);
		}
	}
}
@keyframes thb-pulsate {
	0% {
    transform: scale(.1, .1);
    opacity: 0;
	}
	50% {
    opacity: 1;
	}
	100% {
    transform: scale(1.2, 1.2);
    opacity: 0;
	}
}