.typed-cursor {
	opacity: 1;
	animation: blink .7s infinite;
}

@keyframes blink {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-webkit-keyframes blink {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-moz-keyframes blink {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.tm-heading {
	.heading {
		margin-bottom: 0;
		word-wrap: break-word;
		max-width: 100%;
	}

	&.center {
		.heading {
			margin-left: auto;
			margin-right: auto;
		}
	}

	a {
		font-size: inherit;
		color: inherit;
		position: relative;
		overflow: hidden;
		z-index: 1;

		&:before {
			content: '';
			width: 0;
			height: 1px;
			bottom: 0;
			position: absolute;
			left: auto;
			right: 0;
			z-index: 1;
			transition: width .6s cubic-bezier(.25, .8, .25, 1) 0s;
			background: currentColor;
		}

		&:hover {
			color: inherit;

			&:before {
				width: 100%;
				left: 0;
				right: auto;
			}
		}
	}

	.icon {
		display: inline-block;
		vertical-align: bottom;
		margin-right: 9px;
	}

	&.link-style-01 {
		.heading {
			font-size: 18px;
			font-weight: 500;
			line-height: 1.45;
		}

		a {
			border-bottom: 1px solid #ccc;

			&:before {
				bottom: -1px
			}
		}
	}

	&.link-style-02 {
		.heading {
			font-size: 18px;
			font-weight: 500;
			line-height: 1.45;
		}

		a {
			border-bottom: 1px solid #ccc;

			&:before {
				bottom: -1px
			}

			&:after {
				@extend %FontAwesomeRegular;
				content: '\f178';
				font-size: 16px;
				margin-left: 10px;
			}
		}
	}

	&.link-style-03 {
		.heading {
			font-size: 18px;
			font-weight: 500;
			line-height: 1.45;
		}

		a {
			&:before {
				bottom: -1px
			}

			&:after {
				@extend %FontAwesomeRegular;
				content: '\f178';
				font-size: 16px;
				margin-left: 10px;
			}
		}
	}

	&.secondary-font {
		.heading {
			font-family: inherit;
		}
	}

	&.common {
		.heading {
			font-size: 30px;
		}
	}

	&.left-line {
		.heading {
			position: relative;
			padding-left: 34px;
			font-size: 40px;
			font-weight: 600;
			line-height: 1.2;

			&:before {
				content: '';
				position: absolute;
				top: 50%;
				left: 0;
				width: 4px;
				height: 94%;
				transform: translateY(-50%);
			}
		}
	}

	&.highlight-01 {
		.heading {
			font-size: 18px;
			line-height: 1.78;
		}
	}

	&.highlight-02 {
		.heading {
			font-size: 56px;
			font-weight: 500;
			line-height: 1.29;
		}

		mark {
			position: relative;
			color: inherit;

			&:after {
				content: '';
				position: absolute;
				bottom: 4px;
				left: 0;
				right: 0;
				height: 2px;
				background: currentColor;
			}
		}
	}

	&.modern {
		.heading {
			font-size: 14px;
			letter-spacing: 3px;
			text-transform: uppercase;
			line-height: 1.43;
		}
	}

	&.modern-02 {
		.heading {
			font-size: 15px;
			font-weight: 500;
			letter-spacing: 2px;
			text-transform: uppercase;
			line-height: 1.74;
		}
	}

	&.modern-03 {
		.heading {
			font-size: 14px;
			font-weight: 700;
			letter-spacing: 1px;
			text-transform: uppercase;
			line-height: 1.74;
		}
	}

	&.modern-number-01 {
		.heading {
			@extend %clearfix;
			position: relative;
			font-size: 12px;
			line-height: 2em;
			letter-spacing: 2px;
			color: #ababab;
			text-transform: uppercase;
			display: flex;
			align-items: flex-end;
		}

		mark {
			font-size: 180px;
			line-height: .8;
			font-weight: 900;
			margin: 0 5px -5px -5px;
		}
	}

	&.modern-number-02 {
		.heading {
			@extend %clearfix;
			position: relative;
			font-size: 13px;
			line-height: 2em;
			letter-spacing: 2px;
			text-transform: uppercase;
			display: inline-block;
			padding: 35px 80px 35px 42px;

			&:before {
				content: '';
				position: absolute;
				top: 47px;
				left: 0;
				width: 34px;
				height: 1px;
			}
		}

		mark {
			position: absolute;
			top: 50%;
			right: 0;
			transform: translate(0, -50%);
			font-size: 120px;
			line-height: .8;
			font-weight: 900;
			color: #ededed;
			z-index: -1;
		}
	}

	&.modern-number-03 {
		.heading {
			@extend %clearfix;
			position: relative;
			font-size: 12px;
			line-height: 2em;
			letter-spacing: 2px;
			color: #ababab;
			text-transform: uppercase;
			display: flex;
			align-items: flex-end;
		}

		mark {
			font-size: 180px;
			line-height: .8;
			font-weight: 900;
			margin: 0 5px -5px -5px;
		}
	}

	&.vertical {
		.heading {
			writing-mode: vertical-rl;
			display: inline;
		}
	}

	&.below-separator {
		.separator {
			line-height: 0;

			&:before {
				content: '';
				display: block;
			}

			&:after {
				content: '';
				display: inline-block;
				width: 80px;
				height: 3px;
				border-radius: 3px;
				margin-top: 24px;
			}
		}
	}

	&.below-thin-separator {
		.heading {
			display: inline-block;

			&:after {
				content: '';
				display: block;
				width: 100%;
				height: 1px;
				margin-top: 15px;
				opacity: .4;
				background: currentColor;
			}
		}
	}

	&.typed-text {
		.heading {
			font-size: 48px;
			line-height: 1.34;
		}

		mark {
			background: none;
		}

		.typed-cursor {
			font-weight: 300;
		}
	}
}

@include media-breakpoint-down(lg) {
	.tm-heading {
		&.left-line {
			.heading {
				font-size: 34px;
			}
		}
	}
}

@include media-breakpoint-down(md) {
	.tm-heading {
		&.common {
			.heading {
				font-size: 24px;
			}
		}

		&.typed-text {
			.heading {
				font-size: 42px;
			}
		}

		&.left-line {
			.heading {
				font-size: 28px;
			}
		}
	}
}

@include media-breakpoint-down(sm) {
	.tm-heading {
		&.typed-text {
			.heading {
				font-size: 36px;
			}
		}
	}
}
