You need to add a width and a height of the background image for it to display properly.
For instance,
.header-shadow{
background-image: url('../images/header-shade.jpg');
width: XXpx;
height: XXpx;
}
As you mentioned that you are using it as a shadow, you can remove the width and add a background-repeat (either vertically or horizontally if required).
For instance,
.header-shadow{
background-image: url('../images/header-shade.jpg');
background-repeat: repeat-y; /* for vertical repeat */
background-repeat: repeat-x; /* for horizontal repeat */
height: XXpx;
}
PS: XX is a dummy value. You need to replace it with your actual values of your image.