Custom CSS - Adding box-shade to page elements.

I am having trouble adding a box shadow around all the elements in my theme. I have added the following css class to my child-style.css file in my bp-fun-child theme and applied it to the appropriate div tags.

.shad {
-webkit-box-shadow: 0 3px 4px 1px #222 !important;
-moz-box-shadow: 0 3px 4px 1px #222 !important;
box-shadow: 0 3px 4px 1px #222 !important;
}

In most cases it works beautifully, but I can't seem to get it to work on the main content box or the welcome message box (see screenshot here ) unless I go in and add to the box-shadow code directly to the parent theme's base.css file as follows:

On line 88: #call-action {margin: 5px 0px; padding: 15px 2%; float: left; width: 100%; background: #FFFFFF; -webkit-box-shadow: 0 3px 4px 1px #222 !important; -moz-box-shadow: 0 3px 4px 1px #222 !important; box-shadow: 0 3px 4px 1px #222 !important;}

On line 106: #post-entry {margin: 0px; padding: 15px 15px 3em; float: left; width: 620px; background: #FFFFFF; -webkit-box-shadow: 0 3px 4px 1px #222 !important; -moz-box-shadow: 0 3px 4px 1px #222 !important; box-shadow: 0 3px 4px 1px #222 !important;}

It works when I do it this way, but it kind of defeats the purpose of doing it with CSS since if I wanted to change it I would now have to change it in these two places in addition to the class I created.

Any ideas on why I can't get it to work on those two areas?