.ui-datepicker table, .ui-datepicker .ui-datepicker-title select {
    font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
	background-color: #00749a;
	border-color: #00749a;
}

.chart-container {
    min-height: 300px;
}

.highcharts-contextbutton:not(.highcharts-button-hover) .highcharts-button-box {
	fill: rgba(255,255,255,0);
}



.chart-container .highcharts-legend-item {
	margin-right: 20px;
	font-size: 14px;
	font-weight: 500;
}

.chart-container .highcharts-legend-item label {
	cursor: pointer;
	white-space: nowrap;
}

.chart-container .highcharts-legend-item input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.chart-container .highcharts-legend-item .checkmark {
	display: inline-block;
	background-color: transparent;
	position: relative;
	top: 0;
	left: 0;
	height: 25px;
	width: 25px;
	vertical-align: middle;
	margin-right: 10px;
}

.chart-container .highcharts-legend-item .checkmark:after {
	content: "";
	position: absolute;
	left: 10px;
	top: 6px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.chart-container .highcharts-legend-item input:not(:checked) ~ .checkmark {
	background-color: transparent !important;
	border: 2px solid #ccc;
}

.chart-container .highcharts-legend-item input:not(:checked) ~ .checkmark:after {
	display: none;
}



.chart-container .chart-legends {
	display: block;
	margin-left: 10px;
	margin-top: 40px;
	margin-bottom: 10px;
}

@media (min-width: 576px) {
	.chart-container .chart-legends {
		margin-left: 10px;
		margin-top: 40px;
		margin-bottom: 10px;
	}
	
	.legend-group {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		margin-bottom: 22px;
	}
	
	.legend-group::last-child {
		margin-bottom: 0px;
	}
	
}

.chart-container .range-selectors {
	margin-bottom: 30px;
	margin-left: 10px;
}

.chart-container .range-selectors > * {
	display: inline-block;
	margin-bottom: 10px;
}

.chart-container .range-selector-btn {
	font-size: 14px;
	font-weight: 500;
	border-bottom: 2px solid transparent;
	padding: 10px;
	display: inline-block;
	cursor: pointer;
	color: #ccc;
	margin-right: 10px;
}

@media (min-width: 576px) {
	.chart-container .range-selector-btn {
		margin-right: 20px;
	}
}

.chart-container .range-selector-btn:hover {
	text-decoration: none;
	color: inherit;
}

.chart-container .range-selector-btn.active {
	border-bottom: 2px solid #6ba3b9;
	color: inherit;
}

.chart-container .range-selector-btn:hover {
	text-decoration: none;
	color: inherit;
}

.chart-container .datefield {
	width: 100px;
	font-size: 14px;
}

.chart-container .calendar-icon {
	margin-right: 10px;
}

.chart-container .range-selector-fields {
	white-space: nowrap;
	display: inline-block;
}

.chart-container .range-selector-fields {
	border-radius: 0;
}

.toggle-cb {
    position: relative;
}

.toggle-cb input {
    position: absolute;
    margin-left: -20px;
    opacity: 0;
}

.toggle-cb label:before {
	content: '';
	position: absolute;
	top: -1px;
	left: 0;
	padding-left: 0;
	width: 36px;
	height: 20px;
	background-color: #e5edf0;
	border-radius: 10px;
	border: 1px solid rgba(0,0,0,.3);
	transition: all .3s ease-in-out;
}

.toggle-cb label:after {
	content: '';
	position: absolute;
	background-color: #a3b6bc;
	height: 12px;
	width: 12px;
	top: 3px;
	left: 5px;
	border-radius: 50%;
	box-shadow: 0 0 0 1px rgba(0,0,0,.9);
	transition: all .3s ease-in-out;
	cursor: pointer;
}

.toggle-cb input:checked ~ label::before {
	background-color: #6ba4b8;
}
.toggle-cb input:checked ~ label::after {
	background-color: #ffffff;
}

.toggle-cb input:checked ~ label::after {
    left: 19px;
}

.toggle-cb span {
    padding-left: 45px;
    cursor: pointer;
    font-size: 14px;
    position: relative;
    top: -6px;
}

.cb-wrapper {
    display: flex;
    justify-content: flex-end;
    margin-top: -30px;
}