canvasで描いたグラフをFirefoxブラウザで見ると色が変になる。

ウェブ初心者です。
検索しても分からなかったため、こちらで質問させていただきたいです。
もし分かられる方がおられれば、お力を貸してください。

ウェブぺージでグラフを描くときに、canvasタグを利用しました。
GoogleChromeやSafariでは問題なく見れました。
しかし、Firefoxではグラフの色はきちんと反映できたのですが、グラフの注釈の色がきちんと反映できていません。
下記の画像のような形です。
（グラフ上のSample1の色、Sample2の色・・などがグレーになっています。

HTMLは下記です。

html
1<canvas id="AllChart"></canvas></div>
2<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script>
3<script>
4    var ChartData;
5    var ctx = document.getElementById('AllChart').getContext('2d');
6    ChartData = new Chart(ctx, {
7        type: 'bar',
8        data:{labels: ['13年/12月', '14年/12月', '15年/12月', '16年/12月', '17年/12月', '18年/12月', '19年/12月','20年/12月予想'],//X軸の情報
9        //Y軸の情報
10            datasets: [{//1軸目
11                    type: 'bar',label: "Sample1",data: [3786,4901,5086,4881,5222,6054,6260,6673],backgroundColor:['rgba(255,127,80,0.8)','rgba(255,127,80,0.8)','rgba(255,127,80,0.8)','rgba(255,127,80,0.8)','rgba(255,127,80,0.8)','rgba(255,127,80,0.8)','rgba(255,127,80,0.8)','rgba(255,127,80,0.3)'],borderColor: 'rgb(255,127,80)',borderWidth: 1,},
12                {//2軸目
13                    type: 'bar',label: "Sample2",data: [499,583,661,673,630,507,658,710],backgroundColor: ['rgba(255,165,0,0.8)','rgba(255,165,0,0.8)','rgba(255,165,0,0.8)','rgba(255,165,0,0.8)','rgba(255,165,0,0.8)','rgba(255,165,0,0.8)','rgba(255,165,0,0.8)','rgba(255,165,0,0.3)'],borderColor: "rgb(255,165,0)",borderWidth: 1,yAxisID: "y2"},
14                {//3軸目
15                    type: 'bar',label: "Sample3",data: [461,550,637,657,623,488,633,640],backgroundColor: ['rgba(255,215,0,0.8)','rgba(255,215,0,0.8)','rgba(255,215,0,0.8)','rgba(255,215,0,0.8)','rgba(255,215,0,0.8)','rgba(255,215,0,0.8)','rgba(255,215,0,0.8)','rgba(255,215,0,0.3)'],borderColor: "rgb(255,215,0)",borderWidth: 1,yAxisID: "y2"},
16                {//4軸目
17                    type: 'bar',label: "Sample4",data: [311,333,406,437,413,329,439,423],backgroundColor:['rgba(210,105,30,0.8)','rgba(210,105,30,0.8)','rgba(210,105,30,0.8)','rgba(210,105,30,0.8)','rgba(210,105,30,0.8)','rgba(210,105,30,0.8)','rgba(210,105,30,0.8)','rgba(210,105,30,0.3)'],borderColor: "rgb(210,105,30)",borderWidth: 1,yAxisID: "y2"
18                }]
19            },
20            options: {
21              responsive: true,
22              maintainAspectRatio: false,
23              legend: {
24                    //凡例
25                    display: true
26                },
27                tooltips: {
28                    //ツールチップ
29                    enabled: true
30                },
31                scales: {
32                    //Y軸のオプション
33                    yAxes: [{
34                        scaleLabel: {
35                            fontColor: "black"
36                        },
37                        gridLines: {
38                            color: "rgba(126, 126, 126, 0.2)",
39                            zeroLineColor: "black"
40                        },
41                        ticks: {
42                            fontColor: "black",
43                            beginAtZero: true,
44                            suggestedMax: 7500,
45                            stepSize: 500,
46                            callback: function(label, index, labels) {return label.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') ;}
47                        }
48                    },
49                    {
50                        id: "y2",
51                        position: "right",
52                        autoSkip: true,
53                        gridLines: {
54                            display: false
55                        },
56                        ticks: {
57                            fontColor: "black",
58                            beginAtZero: true,
59                            max: 1500,
60                            stepSize: 100,
61                            callback: function(label, index, labels) {return label.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') ;}
62                        }
63                    }],
64                    //X軸のオプション
65                    xAxes: [{
66                        scaleLabel: {
67                            fontColor: "black",
68                            fontSize: 4,
69                            display: true,
70                        },
71                        gridLines: {
72                            color: "rgba(126, 126, 126, 0.2)",
73                            zeroLineColor: "black"
74                        },
75                        ticks: {
76                            fontColor: "black"
77                        }
78                    }]
79                }
80            }
81    });
82</script>