.jet-progress-bar {
	&__inner {

	}

	&__title {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-flow: row nowrap;
	}

	&__wrapper {
		position: relative;
	}

	&__status-bar {
		display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
		will-change: width, height;
		transition: width 1s cubic-bezier(.6,.17,.37,.86),
					height 1s cubic-bezier(.6,.17,.37,.86);
		transform: translateZ(0);
	}

	&__percent {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	&__percent-value {
		line-height: 1;
	}

	&__percent-suffix {
		line-height: 1;
	}

	&-type-1 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: column;

			.jet-progress-bar__status-bar {
				width: 0%;
			}

			.jet-progress-bar__title {
				align-self: flex-start;
			}

			.jet-progress-bar__wrapper {
				align-self: stretch;
			}

			.jet-progress-bar__percent {
				align-self: flex-end;
			}
		}
	}

	&-type-2 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: column;

			.jet-progress-bar__status-bar {
				width: 0%;
			}
		}
	}

	&-type-3 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: column;

			.jet-progress-bar__wrapper {
				flex: 1 1 auto;
			}

			.jet-progress-bar__status-bar {
				width: 0%;
			}

			.jet-progress-bar__percent {
				align-self: flex-end;
				position: absolute;
				bottom: calc(100% + 10px);
				right: 0;
			}

		}
	}

	&-type-4 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: row nowrap;
			justify-content: center;
			align-items: center;

			.jet-progress-bar__wrapper {
				flex: 1 1 auto;
			}

			.jet-progress-bar__status-bar {
				width: 0%;
			}
		}
	}

	&-type-5 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: column nowrap;
			justify-content: center;
			align-items: center;

			.jet-progress-bar__wrapper {
				display: flex;
				flex-flow: row nowrap;
				align-self: stretch;
			}

			.jet-progress-bar__status-bar {
				width: 0%;
			}
		}
	}

	&-type-6 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: column nowrap;
			justify-content: center;
			align-items: center;

			.jet-progress-bar__wrapper {
				display: flex;
				flex-flow: row nowrap;
				align-self: stretch;
			}

			.jet-progress-bar__status-bar {
				width: 0%;
			}

			.jet-progress-bar__status {
				display: flex;
				flex-flow: column nowrap;
				justify-content: center;
				align-items: flex-start;
			}
		}
	}

	&-type-7 {
		.jet-progress-bar__inner {
			display: flex;
			flex-flow: column nowrap;
			justify-content: center;
			align-items: center;

			.jet-progress-bar__wrapper {
				display: flex;
				flex-flow: column nowrap;
			}

			.jet-progress-bar__status-bar {
				width: 100%;
				height: 0%;
			}
		}
	}
}