anchor.diff:  							console.log(startValueArray);
   							console.log(endValueArray);
   
  -							var waterfallChart = c3.generate({
  -								data: {
  -									columns: [startValueArray, endValueArray],
  -									type: 'bar',
  -									colors: {
  -										data1: '#ffffff'
  -									},
  -									groups: [
  -										['data2', 'data1']
  -									],
  -									order: null
  -								},
  -								grid: {
  -									y: {
  -										lines: [{value:0}]
  -									}
  -								}, 
  -								bindto: '#chart4'
  -							  });
  -                    });
  -</script>
  +							var waterfallChart = c3
  +									.generate({
  +										data : {
  +											columns : [ startValueArray,
  +													endValueArray ],
  +											type : 'bar',
  +											colors : {
  +												data1 : '#ffffff'
  +											},
  +											groups : [ [ 'data2', 'data1' ] ],
  +											order : null
  +										},
  +										grid : {
  +											y : {
  +												lines : [ {
  +													value : 0
  +												} ]
  +											}
  +										},
  +										bindto : '#chart4'
  +									});
  +						});
  +
  +		function txtColorFunc(value) {
  +			var valueColor = "green";
  +			if (value < 0) {
  +				valueColor = "red";
  +			} else if (value == 0) {
  +				valueColor = "orange";
  +			} else {
  +				valueColor = "green";
  +			}
  +			return valueColor;
  +		}
  +	</script>
   	<!-- header logo: style can be found in header.less -->
   	<header class="header">
   		<a href="index.html" class="logo"> Italy Customer Walk</a>
  
positive.code: 					<!--end col-6 -->
  					<div class="col-md-6">
  						<section class="panel">
  							<header class="panel-heading"> How is customer acquisition trending over time? </header>
  							<div class="panel-body">
  								<div id="chart2"></div>
  							</div>
  
negative.code: 		// Chart.defaults.global.responsive = true;
  	</script>
  </body>
  </html>