Removing shadows below modules in the Allrounder template

Allrounder is a very versatile template for Joomla. In its default version, the bottom corners of modules have a shadow that make the corner “lift” from the background (as if they were a piece of paper, see image).

"Lifted" corners at the bottom of a module

“Lifted” corners at the bottom of a module

I could not find a switch to disable this behavior, but the template offers to add custom CSS code. I took a look at the page’s source code and found that there are two <span> tags that build the left and right corners:

<span class="shadow-left"> </span>
<span class="shadow-right"> </span>

The shadow is actually a background image that is set via CSS:

.shadow-right {
    background-image: url("../images/shadow-r.png");
    /* ... */

The simplest way to fix this, is to reset the background-image to none.


  1. Go to Extensions -> Template Manager and open the Allrounder style.
  2. Switch to the tab Advanced Template Options and scroll to the very bottom. (Here, you can also disable the header and footer Ribbons)
  3. Set Use Custom CSS Code to Yes
  4. Add the following CSS code in the text box:
    .shadow-left {
        background-image: none;
  5. Click  Save and Close and refresh the site.

Leave a Reply