.legend-box {
	width: 12px;
	height: 12px;
	display: inline-block;
	margin-left: 1px !important;
	margin-right: 7px !important;
}

.legend1 {
	background-color: #4b4b4b;
}

.legend0 {
	background-color: #e5a812;
}

.c3 svg {
	font-weight: 600;
	-webkit-tap-highlight-color: transparent;
	margin: 0 auto 15px auto;
	display: block;
}

.c3-arcs-Principal .c3-shape {
	fill: #e5a812 !important;
}

.c3-arcs-Interest-Payable .c3-shape {
	fill: #4b4b4b !important
}

.c3-chart-arc text {
	fill: #fff;
	font-size: 17px;
}

.c3-chart-arc path {
	stroke: #fff;
}

.c3 line,
.c3 path {
	fill: none;
	stroke: #000
}

.c3 text {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none
}

.c3-bars path,
.c3-event-rect,
.c3-legend-item-tile,
.c3-xgrid-focus,
.c3-ygrid {
	shape-rendering: crispEdges
}

.c3-chart-arc path {
	stroke: #fff
}

.c3-chart-arc text {
	fill: #fff;
	font-size: 17px
}

.c3-grid line {
	stroke: #aaa
}

.c3-grid text {
	fill: #aaa
}

.c3-xgrid,
.c3-ygrid {
	stroke-dasharray: 3 3
}

.c3-text.c3-empty {
	fill: grey;
	font-size: 2em
}

.c3-line {
	stroke-width: 1px
}

.c3-circle._expanded_ {
	stroke-width: 1px;
	stroke: #fff
}

.c3-selected-circle {
	fill: #fff;
	stroke-width: 2px
}

.c3-bar {
	stroke-width: 0
}

.c3-bar._expanded_ {
	fill-opacity: .75
}

.c3-target.c3-focused {
	opacity: 1
}

.c3-target.c3-focused path.c3-line,
.c3-target.c3-focused path.c3-step {
	stroke-width: 2px
}

.c3-target.c3-defocused {
	opacity: .3 !important
}

.c3-region {
	fill: #4682b4;
	fill-opacity: .1
}

.c3-brush .extent {
	fill-opacity: .1
}

.c3-legend-item {
	color: #777;
	font-size: 12px
}

.c3-legend-item-hidden {
	opacity: .15
}

.c3-legend-background {
	opacity: .75;
	fill: #fff;
	stroke: #d3d3d3;
	stroke-width: 1
}

.c3-tooltip-container {
	z-index: 10;
	width: 50px !important
}

.c3-tooltip {
	border-collapse: collapse;
	border-spacing: 0;
	background-color: rgba(255, 255, 255, 0.9);
	empty-cells: show;
	-webkit-box-shadow: 7px 7px 12px -9px #777;
	box-shadow: 7px 7px 12px -9px #777;
	width: 140px !important
}

.c3-tooltip tr {
	border: 1px solid #777
}

.c3-tooltip th {
	background-color: #aaa;
	font-size: 14px;
	text-align: left;
	color: #FFF
}

.c3-tooltip td {
	padding: 1px 5px;
	text-align: center;
	color: #777;
	font-size: 12px;
	border-left: 1px dotted #777
}

.c3-tooltip td>span {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 6px
}

.c3-tooltip td.value {
	text-align: right
}

.c3-tooltip td.name {
	display: none
}

.c3-area {
	stroke-width: 0;
	opacity: .2
}

.c3-chart-arcs-title {
	font-size: 1.3em
}

.c3-chart-arcs .c3-chart-arcs-background {
	fill: #e0e0e0;
	stroke: none
}

.c3-chart-arcs .c3-chart-arcs-gauge-unit {
	fill: #000;
	font-size: 16px
}

.c3-chart-arcs .c3-chart-arcs-gauge-max,
.c3-chart-arcs .c3-chart-arcs-gauge-min {
	fill: #777
}

.c3-chart-arc .c3-gauge-value {
	fill: #000
}

/*** Range Slider CSS ***/

.rangeslider,
.rangeslider__fill {
	display: block;
	-webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
	border-radius: 10px
}

.rangeslider {
	background: #f7f7f7;
	position: relative
}

.rangeslider--horizontal {
	height: 20px;
	width: 100%
}

.rangeslider--vertical {
	width: 20px;
	min-height: 150px;
	max-height: 100%
}

.rangeslider--disabled {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
	opacity: 0.4
}

.rangeslider__fill {
	background: #00ff00;
	position: absolute
}

.rangeslider--horizontal .rangeslider__fill {
	top: 0;
	height: 100%
}

.rangeslider--vertical .rangeslider__fill {
	bottom: 0;
	width: 100%
}

.rangeslider__handle {
	background: #e5a812;
	cursor: pointer;
	display: inline-block;
	width: 14px;
	height: 14px;
	position: absolute;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.rangeslider__handle:active {
	background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjEiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
	background-size: 100%;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.12)));
	background-image: -o-linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
	background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12))
}

.rangeslider--horizontal .rangeslider__handle {
	top: -6px;
	touch-action: pan-y;
	-ms-touch-action: pan-y
}

.rangeslider--vertical .rangeslider__handle {
	left: -10px;
	touch-action: pan-x;
	-ms-touch-action: pan-x
}

input[type="range"]:focus+.rangeslider .rangeslider__handle {
	-webkit-box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
	box-shadow: 0 0 8px rgba(255, 0, 255, 0.9)
}

.rangeslider--horizontal {
	height: 1px
}

.rangeslider__fill {
	background-color: #e5a812;
}

.rangeslider,
.rangeslider__fill {
	border-radius: 5px;
	-webkit-box-shadow: none;
	box-shadow: none
}

.rangeslider {
	background-color: #bcbcbc;
	position: relative;
}

.rangeslider:before,
.rangeslider:after {
	content: '';
	position: absolute;
	height: 6px;
	width: 6px;
	background-color:  #e5a812;
	top: -3px;
	border-radius: 50%;
}

.rangeslider:before {
	left: 0;
}

.rangeslider:after {
	right: 0;
}

.slider {
	padding: 15px 0;
}

/*** Error Message CSS***/

.errorMsg {
	display: none
}

.sliderText {
	font-size: 24px;
	font-weight: 600;
	color: #e5a812;
	height: calc(0.6em + .75rem + 2px);
	height:auto;
}

.section-emi-calc {
	background: #f1f1f1;
}



/* calculator style */
.section-emi-calc .box-shadow {
	-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16),
		0 3px 6px rgba(0, 0, 0, 0.23);
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16),
		0 3px 6px rgba(0, 0, 0, 0.23);
}
