
/*
	YELLOW TO GREEN BATTERY CHARGE
	https://css-tricks.com/css3-gradients/
*/


#gradYellow {
	background-color:#FFFF00; /* Main color - For browsers that do not support gradients */

	/* SVG fallback for IE 9 (could be data URI, or could use filter) */
	background-image: 	url(fallback-gradient.svg); 

	/* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */
	background-image:
  		-webkit-gradient(
		linear,
		left top,
		right top,
		from(#CCFF00),	to(#FFFF00)
	);
  
	/* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
	background-image:
		-webkit-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#FFFF00 /* green */
	);

	/* Firefox 3.6 - 15 */
	background-image:
    	-moz-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#FFFF00 /* green */
	);

	/* Opera 11.1 - 12 */
	background-image:
    	-o-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#FFFF00 /* green */
	);

	/* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
	background-image:  linear-gradient(
  		to right, 
	   	##CCFF00, /* yellow */
    	#FFFF00 75%/* green */
	); /* Standard syntax (must be last) */
}



#gradYellowish {
	background-color:#CCFF00; /* Main color - For browsers that do not support gradients */

	/* SVG fallback for IE 9 (could be data URI, or could use filter) */
	background-image: 	url(fallback-gradient.svg); 

	/* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */
	background-image:
  		-webkit-gradient(
		linear,
		left top,
		right top,
		from(#FFFF00),	to(#CCFF00)
	);
  
	/* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
	background-image:
		-webkit-linear-gradient(
		left,
		#FFFF00, /* yellow */
    	#CCFF00 /* green */
	);

	/* Firefox 3.6 - 15 */
	background-image:
    	-moz-linear-gradient(
		left,
		#FFFF00, /* yellow */
    	#CCFF00 /* green */
	);

	/* Opera 11.1 - 12 */
	background-image:
    	-o-linear-gradient(
		left,
		#FFFF00, /* yellow */
    	#CCFF00 /* green */
	);

	/* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
	background-image:  linear-gradient(
  		to right, 
	   	#FFFF00, /* yellow */
    	#33CC00 75%/* green */
	); /* Standard syntax (must be last) */
}


#gradGreenish {
	background-color:#66CC00; /* Main color - For browsers that do not support gradients */

	/* SVG fallback for IE 9 (could be data URI, or could use filter) */
	background-image: 	url(fallback-gradient.svg); 

	/* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */
	background-image:
  		-webkit-gradient(
		linear,
		left top,
		right top,
		from(#CCFF00),	to(#66CC00)
	);
  
	/* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
	background-image:
		-webkit-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#66CC00 /* green */
	);

	/* Firefox 3.6 - 15 */
	background-image:
    	-moz-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#66CC00 /* green */
	);

	/* Opera 11.1 - 12 */
	background-image:
    	-o-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#66CC00 /* green */
	);

	/* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
	background-image:  linear-gradient(
  		to right, 
	   	#CCFF00, /* yellow */
    	#33CC00 75%/* green */
	); /* Standard syntax (must be last) */
}


#gradGreen {
	background-color:#33CC00; /* Main color - For browsers that do not support gradients */

	/* SVG fallback for IE 9 (could be data URI, or could use filter) */
	background-image: 	url(fallback-gradient.svg); 

	/* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */
	background-image:
  		-webkit-gradient(
		linear,
		left top,
		right top,
		from(#CCFF00),	to(#33CC00)
	);
  
	/* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
	background-image:
		-webkit-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#33CC00 /* green */
	);

	/* Firefox 3.6 - 15 */
	background-image:
    	-moz-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#33CC00 /* green */
	);

	/* Opera 11.1 - 12 */
	background-image:
    	-o-linear-gradient(
		left,
		#CCFF00, /* yellow */
    	#33CC00 /* green */
	);

	/* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
	background-image:  linear-gradient(
  		to right, 
	   	#CCFF00, /* yellow */
    	#33CC00 75%/* green */
	); /* Standard syntax (must be last) */
}


#gradSolidGreen {
	background-color: #009900; /* Main color - For browsers that do not support gradients */

	/* SVG fallback for IE 9 (could be data URI, or could use filter) */
	background-image: 	url(fallback-gradient.svg); 

	/* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */
	background-image:
  		-webkit-gradient(
		linear,
		left top,
		right top,
		from(#33CC00),	to(#009900)
	);
  
	/* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
	background-image:
		-webkit-linear-gradient(
		left,
		#33CC00, /* yellow */
    	#009900 /* green */
	);

	/* Firefox 3.6 - 15 */
	background-image:
    	-moz-linear-gradient(
		left,
		#33CC00, /* yellow */
    	#009900 /* green */
	);

	/* Opera 11.1 - 12 */
	background-image:
    	-o-linear-gradient(
		left,
		#33CC00, /* yellow */
    	#009900 /* green */
	);

	/* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
	background-image:  linear-gradient(
  		to right, 
	   	#CCFF00, /* yellow */
    	#009900 75%/* green */
	); /* Standard syntax (must be last) */
}


















/* Scales CSS  */

.parentScale {
  position: relative;
  top: 0;
  left: 0;
  color: 
}

.scale {
  position: relative;
  top: 0;
  left: 0;
}


.valueScale {
  position: absolute;
  bottom: 	22px;
  left: 	20px;
  opacity:	0.65;
}


.graphHoriz {
    position: 	relative;
}