@title-border-color: #E7E6E6;
@title-border-width: 1px;

.fusion-title {
	.flex();
	.flex-wrap( nowrap );
	.flex-align-items( center );
    
    
	margin: 0 0 31px;
	overflow: hidden;

	 h1,
	 h2,
	 h3,
	 h4,
	 h5,
	 h6,
	 .comment-respond & .comment-reply-title {
	 	.flex-grow(0);
		margin: 0;
		padding:0 8px 0 0;
		line-height: normal;
		
		&.title-heading-left {
			padding-right: 8px;
			text-align: left;
			
			.fontawesome-icon {
				margin-left: 10px;
			}
		}

		&.title-heading-right {
			padding:0 0 0 8px;
			text-align: right;
			
			.fontawesome-icon,
			img {
				margin-left: 10px;
				margin-right: 0;
			}
		}
		
		img {
			margin-right: 10px;
		}
		
		.fontawesome-icon {
			display: inline-block;
			float: none;
			vertical-align: middle;
			margin-left: 2px;
			
			&.size-small,
			&.size-medium,
			&.size-large {
				margin-top: 0;
			}
		}
	}
	
	&.fusion-title-center {
		text-align: center;
		
		.title-heading-center {
			padding: 0 45px;
		}
		
		&.fusion-sep-none,
		&.sep-underline {
			.title-heading-center {
				padding: 0;
				text-align: center;		
			}
		}
	}	
	
	&.fusion-sep-none {
		display: block;
		
		.title-heading-left {
			padding: 0;
			text-align: left;
		}
		
		.title-heading-right {
			padding: 0;
			text-align: right;
		}
	}
	
	.title-sep-container {
		position: relative;
		height: 6px;
		.flex-grow(1);

	}
	
	&.sep-underline {
		display: block;
		padding-bottom: 10px;
		width: 100%;
		border-bottom: @title-border-width solid @title-border-color;
		
		&.sep-dashed {
			border-bottom-style: dashed;
		}

		&.sep-dotted {
			border-bottom-style: dotted;
		}		
		
		.title-heading-right {
			float: right;
			margin: 0;
		}
		
		.title-heading-left,
		.title-heading-right {
			padding: 0;
		}
	}

	.title-sep {
		position: relative;	
		display: block;
		width: 100%;
		border-style: solid;
		border: 0 solid @title-border-color;
		box-sizing: content-box;
		-webkit-box-sizing: content-box;
		-moz-box-sizing: content-box;
		-o-box-sizing: content-box;

		&.sep-double {
			height: 6px;
			border-bottom-width: @title-border-width;
			border-top-width: @title-border-width;
		}
		
		&.sep-single {
			border-bottom-width: @title-border-width;
		}
		
		&.sep-dashed {
			border-bottom-style: dashed;
			border-top-style: dashed;
		}
		
		&.sep-dotted {
			border-bottom-style: dotted;
			border-top-style: dotted;
		}		
	}
}

.fusion-border-below-title {
	display: block;
	
	h1, h2, h3, h4, h5, h6 {
		#main .post-content & {
			padding-left: 0;
			padding-right: 0;		
		}
	}
	
	.title-sep-container {
		display: none;
		height: 8px;
	}
}