//	=================
//    	Imports
//	=================

@import '../../../assets/base/color_variables';   	// Color Variables
@import '../../../assets/base/fonticons';   			// Fonticons Variables
@import '../../../assets/base/urls';   				// URLS Variables
@import '../../../assets/base/utilities_variables';  // Utilities Variables

.ct-label {
	fill: $color_244;
	color: $color_244;
	font-size: 0.75rem;
	line-height: 1;
}
.ct-chart-line {
	.ct-label {
		display: block;
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
	}
}
.ct-chart-bar {
	.ct-label {
		display: block;
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
	}
	.ct-label.ct-horizontal.ct-start {
		-webkit-box-align: flex-end;
		-webkit-align-items: flex-end;
		-ms-flex-align: flex-end;
		align-items: flex-end;
		-webkit-box-pack: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
		text-align: center;
		text-anchor: start;
	}
	.ct-label.ct-horizontal.ct-end {
		-webkit-box-align: flex-start;
		-webkit-align-items: flex-start;
		-ms-flex-align: flex-start;
		align-items: flex-start;
		-webkit-box-pack: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
		text-align: center;
		text-anchor: start;
	}
}
.ct-chart-pie {
	.ct-label {
		dominant-baseline: central;
	}
}
.ct-chart-donut {
	.ct-label {
		dominant-baseline: central;
	}
}
.ct-label.ct-horizontal.ct-start {
	-webkit-box-align: flex-end;
	-webkit-align-items: flex-end;
	-ms-flex-align: flex-end;
	align-items: flex-end;
	-webkit-box-pack: flex-start;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: flex-start;
	justify-content: flex-start;
	text-align: left;
	text-anchor: start;
}
.ct-label.ct-horizontal.ct-end {
	-webkit-box-align: flex-start;
	-webkit-align-items: flex-start;
	-ms-flex-align: flex-start;
	align-items: flex-start;
	-webkit-box-pack: flex-start;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: flex-start;
	justify-content: flex-start;
	text-align: left;
	text-anchor: start;
}
.ct-label.ct-vertical.ct-start {
	-webkit-box-align: flex-end;
	-webkit-align-items: flex-end;
	-ms-flex-align: flex-end;
	align-items: flex-end;
	-webkit-box-pack: flex-end;
	-webkit-justify-content: flex-end;
	-ms-flex-pack: flex-end;
	justify-content: flex-end;
	text-align: right;
	text-anchor: end;
}
.ct-label.ct-vertical.ct-end {
	-webkit-box-align: flex-end;
	-webkit-align-items: flex-end;
	-ms-flex-align: flex-end;
	align-items: flex-end;
	-webkit-box-pack: flex-start;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: flex-start;
	justify-content: flex-start;
	text-align: left;
	text-anchor: start;
}
.ct-chart-bar.ct-horizontal-bars {
	.ct-label.ct-horizontal.ct-start {
		-webkit-box-align: flex-end;
		-webkit-align-items: flex-end;
		-ms-flex-align: flex-end;
		align-items: flex-end;
		-webkit-box-pack: flex-start;
		-webkit-justify-content: flex-start;
		-ms-flex-pack: flex-start;
		justify-content: flex-start;
		text-align: left;
		text-anchor: start;
	}
	.ct-label.ct-horizontal.ct-end {
		-webkit-box-align: flex-start;
		-webkit-align-items: flex-start;
		-ms-flex-align: flex-start;
		align-items: flex-start;
		-webkit-box-pack: flex-start;
		-webkit-justify-content: flex-start;
		-ms-flex-pack: flex-start;
		justify-content: flex-start;
		text-align: left;
		text-anchor: start;
	}
	.ct-label.ct-vertical.ct-start {
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: flex-end;
		-webkit-justify-content: flex-end;
		-ms-flex-pack: flex-end;
		justify-content: flex-end;
		text-align: right;
		text-anchor: end;
	}
	.ct-label.ct-vertical.ct-end {
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: flex-start;
		-webkit-justify-content: flex-start;
		-ms-flex-pack: flex-start;
		justify-content: flex-start;
		text-align: left;
		text-anchor: end;
	}
}
.ct-grid {
	stroke: $color_243;
	stroke-width: 1px;
	stroke-dasharray: 2px;
}
.ct-grid-background {
	fill: none;
}
.ct-point {
	stroke-width: 10px;
	stroke-linecap: round;
}
.ct-line {
	fill: none;
	stroke-width: 4px;
}
.ct-area {
	stroke: none;
	fill-opacity: 0.1;
}
.ct-bar {
	fill: none;
	stroke-width: 10px;
}
.ct-slice-donut {
	fill: none;
	stroke-width: 60px;
}
.ct-series-a {
	.ct-point {
		stroke: $color_511;
	}
	.ct-line {
		stroke: $color_511;
	}
	.ct-bar {
		stroke: $color_511;
	}
	.ct-slice-donut {
		stroke: $color_511;
	}
	.ct-slice-pie {
		fill: $color_511;
	}
	.ct-area {
		fill: $color_511;
	}
}
.ct-series-b {
	.ct-point {
		stroke: $color_512;
	}
	.ct-line {
		stroke: $color_512;
	}
	.ct-bar {
		stroke: $color_512;
	}
	.ct-slice-donut {
		stroke: $color_512;
	}
	.ct-slice-pie {
		fill: $color_512;
	}
	.ct-area {
		fill: $color_512;
	}
}
.ct-series-c {
	.ct-point {
		stroke: $color_513;
	}
	.ct-line {
		stroke: $color_513;
	}
	.ct-bar {
		stroke: $color_513;
	}
	.ct-slice-donut {
		stroke: $color_513;
	}
	.ct-slice-pie {
		fill: $color_513;
	}
	.ct-area {
		fill: $color_513;
	}
}
.ct-series-d {
	.ct-point {
		stroke: $color_514;
	}
	.ct-line {
		stroke: $color_514;
	}
	.ct-bar {
		stroke: $color_514;
	}
	.ct-slice-donut {
		stroke: $color_514;
	}
	.ct-slice-pie {
		fill: $color_514;
	}
	.ct-area {
		fill: $color_514;
	}
}
.ct-series-e {
	.ct-point {
		stroke: $color_515;
	}
	.ct-line {
		stroke: $color_515;
	}
	.ct-bar {
		stroke: $color_515;
	}
	.ct-slice-donut {
		stroke: $color_515;
	}
	.ct-slice-pie {
		fill: $color_515;
	}
	.ct-area {
		fill: $color_515;
	}
}
.ct-series-f {
	.ct-point {
		stroke: $color_516;
	}
	.ct-line {
		stroke: $color_516;
	}
	.ct-bar {
		stroke: $color_516;
	}
	.ct-slice-donut {
		stroke: $color_516;
	}
	.ct-slice-pie {
		fill: $color_516;
	}
	.ct-area {
		fill: $color_516;
	}
}
.ct-series-g {
	.ct-point {
		stroke: $color_517;
	}
	.ct-line {
		stroke: $color_517;
	}
	.ct-bar {
		stroke: $color_517;
	}
	.ct-slice-donut {
		stroke: $color_517;
	}
	.ct-slice-pie {
		fill: $color_517;
	}
	.ct-area {
		fill: $color_517;
	}
}
.ct-series-h {
	.ct-point {
		stroke: $color_518;
	}
	.ct-line {
		stroke: $color_518;
	}
	.ct-bar {
		stroke: $color_518;
	}
	.ct-slice-donut {
		stroke: $color_518;
	}
	.ct-slice-pie {
		fill: $color_518;
	}
	.ct-area {
		fill: $color_518;
	}
}
.ct-series-i {
	.ct-point {
		stroke: $color_512;
	}
	.ct-line {
		stroke: $color_512;
	}
	.ct-bar {
		stroke: $color_512;
	}
	.ct-slice-donut {
		stroke: $color_512;
	}
	.ct-slice-pie {
		fill: $color_512;
	}
	.ct-area {
		fill: $color_512;
	}
}
.ct-series-j {
	.ct-point {
		stroke: $color_519;
	}
	.ct-line {
		stroke: $color_519;
	}
	.ct-bar {
		stroke: $color_519;
	}
	.ct-slice-donut {
		stroke: $color_519;
	}
	.ct-slice-pie {
		fill: $color_519;
	}
	.ct-area {
		fill: $color_519;
	}
}
.ct-series-k {
	.ct-point {
		stroke: $color_520;
	}
	.ct-line {
		stroke: $color_520;
	}
	.ct-bar {
		stroke: $color_520;
	}
	.ct-slice-donut {
		stroke: $color_520;
	}
	.ct-slice-pie {
		fill: $color_520;
	}
	.ct-area {
		fill: $color_520;
	}
}
.ct-series-l {
	.ct-point {
		stroke: $color_521;
	}
	.ct-line {
		stroke: $color_521;
	}
	.ct-bar {
		stroke: $color_521;
	}
	.ct-slice-donut {
		stroke: $color_521;
	}
	.ct-slice-pie {
		fill: $color_521;
	}
	.ct-area {
		fill: $color_521;
	}
}
.ct-series-m {
	.ct-point {
		stroke: $color_522;
	}
	.ct-line {
		stroke: $color_522;
	}
	.ct-bar {
		stroke: $color_522;
	}
	.ct-slice-donut {
		stroke: $color_522;
	}
	.ct-slice-pie {
		fill: $color_522;
	}
	.ct-area {
		fill: $color_522;
	}
}
.ct-series-n {
	.ct-point {
		stroke: $color_523;
	}
	.ct-line {
		stroke: $color_523;
	}
	.ct-bar {
		stroke: $color_523;
	}
	.ct-slice-donut {
		stroke: $color_523;
	}
	.ct-slice-pie {
		fill: $color_523;
	}
	.ct-area {
		fill: $color_523;
	}
}
.ct-series-o {
	.ct-point {
		stroke: $color_524;
	}
	.ct-line {
		stroke: $color_524;
	}
	.ct-bar {
		stroke: $color_524;
	}
	.ct-slice-donut {
		stroke: $color_524;
	}
	.ct-slice-pie {
		fill: $color_524;
	}
	.ct-area {
		fill: $color_524;
	}
}
.ct-square {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 100%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-minor-second {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 93.75%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-second {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 88.8888888889%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-minor-third {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 83.3333333333%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-third {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 80%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-perfect-fourth {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 75%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-perfect-fifth {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 66.6666666667%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-minor-sixth {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 62.5%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-golden-section {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 61.804697157%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-sixth {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 60%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-minor-seventh {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 56.25%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-seventh {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 53.3333333333%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-octave {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 50%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-tenth {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 40%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-eleventh {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 37.5%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-major-twelfth {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 33.3333333333%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
.ct-double-octave {
	display: block;
	position: $pos-rel;
	width: 100%;
	&:before {
		display: block;
		float: $align-left;
		content: "";
		width: 0;
		height: 0;
		padding-bottom: 25%;
	}
	&:after {
		content: "";
		display: table;
		clear: both;
	}
	>svg {
		display: block;
		position: $pos-abs;
		top: 0;
		left: 0;
	}
}
