/* ==========================================================================
# Pie Chart Basic - begin
========================================================================== */

.qodef-pie-chart-holder {
	position: relative;
	display: block;
	padding: 0 12px;
	box-sizing: border-box;

	.qodef-percentage {
		position: relative;
		display: block;
		height: 156px;
		width: 156px;
		line-height: 156px;
		text-align: center;
		margin: 0 auto;
		opacity: 0;
		filter: alpha(opacity=0);
		@include qodefTransition(opacity .3s ease-out);

		.qodef-pie-title {
			line-height: inherit;
		}

	}

	.qodef-percentage canvas {
		position: absolute;
		top: 0;
		left: 0;
	}

	.qodef-to-counter {
		position: relative;
		font-weight: 400;
		font-size: 70px;
		color: $default-heading-color;
        vertical-align: middle;

        &:after {
            content: "%";
			position: absolute;
            font-size: 30px;
            font-weight: 600;
			color: #cecece;
            vertical-align: bottom;
			line-height: 1em;
			top: 50%;
			@include qodefTransform(translateY(-50%));
			margin: -8px 0 0 5px;
        }
	}

	.qodef-pie-chart-text {
		text-align: center;
		margin: 30px 0 0;

		.qodef-pie-title {
			margin: 0 0 15px;
		}

        p {
            margin: 0;
        }

	}

}

/* ==========================================================================
# Pie Chart Basic - end
========================================================================== */