CSS3 linear gradient not working properly on Firefox

Question

I created the CSS linear gradient code with Adobe FireWorks CS6. My grandient is supposed to be light blue at the top and dark blue at the bottom, on Chrome and safari it's all good, but on Firefox it is dark blue on the left and light blue on the right. I am new to html and CSS so I have no idea what could be wrong... I tried to change the -90deg to 90deg, 0deg, etc.. but nothing happens.. HELP!!!!

color: #FFF;
/* Firefox v3.6+ */
background-image: -moz-linear-gradient(50% 0% -90deg,rgb(101,165,227) 1%,rgb(0,78,157) 99%);
/* safari v4.0+ and by Chrome v3.0+ */
background-image: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0.01, rgb(101,165,227)),color-stop(0.99, rgb(0,78,157)));
/* Chrome v10.0+ and by safari nightly build*/
background-image: -webkit-linear-gradient(-90deg,rgb(101,165,227) 1%,rgb(0,78,157) 99%);
/* Opera v11.10+ */
background-image: -o-linear-gradient(-90deg,rgb(101,165,227) 1%,rgb(0,78,157) 99%);
/* IE v10+ */
background-image: -ms-linear-gradient(-90deg,rgb(101,165,227) 1%,rgb(0,78,157) 99%);
background-image: linear-gradient(-90deg,rgb(101,165,227) 1%,rgb(0,78,157) 99%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff65a5e3,endColorstr=#ff004e9d,GradientType=0)";
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff65a5e3,endColorstr=#ff004e9d,GradientType=0);
line-height: 60px;
height: 60px;

Answer 1

Many web examples will give an example using the standardized linear-gradient function that will look just like this:

linear-gradient(bottom, rgb(73,132,180) 0%, rgb(97,155,203) 100%);

Note however, that using bottom, top or similar keywords is not actually part of the standard, you have to use either a degree value such as 0deg, -90deg, etc. or apply the to prefix like to bottom, to top or to left top:

linear-gradient(to bottom, rgb(73,132,180) 0%, rgb(97,155,203) 100%);
----------------^