How to apply a pattern and color over a image background?

In a website, I want to have a background image , then apply a pattern to it, and then apply a color or gradient to it, Ive found this css code which works, but not sure how to apply the color

.body {
background: url(pattern.png) top left repeat, url(backgroundimage.jpg) top left no-repeat;
background-attachment: fixed;
background-position: top left;
-webkit-background-size: auto, cover;
-moz-background-size: auto, cover;
-o-background-size: auto, cover;
 background-size: auto, cover;

 }

Any help applying the color or gradient to it thx