.tm-maps {
	position: relative;

	.map {
		height: 100px;
	}

	.btn-view-full-map {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 70px;
		line-height: 70px;
		font-size: 18px;
		font-weight: 700;
		text-align: center;
		color: #fff;
	}

	.btn-icon {
		position: absolute;
		top: 50%;
		transform: translate(0, -50%);
		font-size: 20px;
		margin-left: 21px;
	}
}

.gmap-marker-wrap {
	padding: 20px;
}

.gmap-marker-title {
	font-size: 18px;
	line-height: 1.39;
	margin-bottom: 14px;
}

.tm-maps {
	&.overlay-style-01 {

		.animated-dot {
			position: relative;
			width: 20px;
			height: 20px;
		}

		.animated-dot .middle-dot {
			width: 14px;
			height: 14px;
			border-radius: 50%;
			position: absolute;
			top: 3px;
			left: 3px;
			//transform-origin: 50% 50%;
			animation-fill-mode: forwards;
			animation-iteration-count: infinite;
		}

		.animated-dot .middle-dot:after {
			width: 100%;
			height: 100%;
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			content: ' ';
			background-color: #fff;
			border-radius: 50%;
			z-index: 100;
			opacity: 0;
			transform-origin: 50% 50%;
		}

		.animated-dot .signal {
			pointer-events: none;
			width: 100px;
			height: 100px;
			border-radius: 50%;
			position: absolute;
			left: -40px;
			top: -40px;
			opacity: 0;
			animation: animationSignal cubic-bezier(0, .55, .55, 1) 2s;
			transform-origin: 50% 50%;
			animation-fill-mode: forwards;
			animation-delay: .78s;
			animation-iteration-count: infinite;
		}

		.animated-dot .signal2 {
			width: 100px;
			height: 100px;
			pointer-events: none;
			border-radius: 50%;
			position: absolute;
			left: -40px;
			top: -40px;
			opacity: 0;
			animation: animationSignal cubic-bezier(0, .55, .55, 1) 2s;
			transform-origin: 50% 50%;
			animation-fill-mode: forwards;
			animation-delay: 1.1s;
			animation-iteration-count: infinite;
		}

	}

	.gmap-info-wrapper {
		&.signal-info {
			.gmap-info-template {
				display: none;
			}
		}
	}

	.gmap-info-template {
		position: absolute;
		bottom: 100%;
		right: 0;
		width: 493px;
		transform: translate(140px, 20px);
		padding-bottom: 40px;

		.gmap-info-content {
			background: #fff url(assets/images/gmap-overlay-bg.png) no-repeat left 17px bottom -6px;
			padding: 40px 30px 40px 214px;
			box-shadow: 0 30px 30px rgba(0, 0, 0, .12);

			&:before {
				content: '';
				position: absolute;
				bottom: 25px;
				right: 130px;
				border-left: 20px solid transparent;
				border-right: 20px solid transparent;
				border-top: 25px solid #fff;
			}
		}

		.gmap-marker-content {
			font-size: 14px;
			font-weight: 500;
			line-height: 1.79;

			a {
				color: #222;
			}
		}
	}
}

@keyframes animationSignal {
	0% {
		opacity: 0;
		transform: scale(0);
	}

	1% {
		opacity: .14;
	}

	20% {
		opacity: .14;
	}

	60% {
		transform: scale(1);
		opacity: 0;
	}
}
