#dataCounterModal canvas{
  background:#000;
  height:220px;
}
#dataCounterModal .uk-container {
	padding-top: 30px;
	padding-bottom: 30px;
	/*width: 700px;
	background-color: #3b4043;*/
	color: #fff;
	background-color: #444444;
}

#switchButton {
	margin: 0 auto;
	max-width: 615px;
	min-width: 450px;
	padding: 10px 0;
}

#bonusTable .dataBackground, #bonusTable .data, #barChartDiv {
	font-family: DEGI;
}

#bonusTable {
	margin: 0 auto;
	max-width: 615px;
	min-width: 450px;
	background-color: black;
	font-size: 32px;
}
#bonusTable > div {
	border-bottom: 1px solid #323232;
}
#bonusTable > div:last-child {
	border-bottom: none;
}
#bonusTable span.title {
	font-family: normal;
	font-size: 16px;
}
#bonusTable > div:nth-child(1) span.title {
	display: block;
}
#bonusTable > div:nth-child(2) span.title {
	display: block;
}
#bonusTable span.dataBackground {
	position: relative;
	color: #323232;
}
#bonusTable span.data {
	position: absolute;
	right: 0px;
}
#bonusTable .data {
	color: white;
}
#bonusTable #bb .data, #bonusTable #bbRate .data {
	color: #df072c;
}
#bonusTable #rb .data, #bonusTable #rbRate .data {
	color: #fdb007;
}
#bonusTable #start .data {
	color: #0ca834;
}
#bonusTable #bbRate, #bonusTable #rbRate, #bonusTable #totalRate {
	font-size: 22px;
	padding-left: 0px;
	padding-top: 10px;
}

#barChartDiv {
	margin: 0 auto;
	overflow-x: auto;
	overflow-y: hidden;
	margin-top: 10px;
	max-width: 615px;
	min-width: 450px;
}
#barChartInnerDiv {
	position: relative;
	width: 615px;
	height: 220px;
}
#bonusHistory {
	padding-left: 20px;
	padding-right: 20px;
}

@media screen and (min-width: 640px) {
	#dataCounterModal .uk-container {
		padding-left: 15px;
		padding-right: 15px;
	}
}

@media screen and (max-width: 640px) {
	#bonusTable {
		font-size: 5.7vw;
		width: 100%;
		min-width: 270px;
	}
	#bonusTable span.title {
		font-size: 3.2vw;
	}
	#bonusTable #bbRate, #bonusTable #rbRate, #bonusTable #totalRate {
		font-size: 3.5vw;
	}
	#barChartDiv {
		width: 100%;
		min-width: 270px;
	}
	#bonusHistory {
		padding-left: 5px;
		padding-right: 5px;
	}
	#dataCounterModal .uk-grid>* {
	    padding-left: 20px;
	}
}

@media screen and (max-width: 400px) {
	#bonusTable {
		font-size: 5.3vw;
	}
}

#dataCounterModal .uk-modal-dialog {
    width: 660px;
}

#dataCounterModal .uk-modal-body {
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
}

#dataCounterModal .uk-grid {
	margin: 0;
}
