Repeat Background Image

[محروم.كوم]

Hello,

I would like to make some small changes to the header section of my forums - it looks perfectly fine on most resolutions, but on larger ones (such as 1900 wide) the main banner (showcase-bg.jpg) repeats.

So basically what I need to do is, stop the main banner image (showcase-bg.jpg) from repeating and instead put another horizontally repeating image (say 20 pixels wide) underneath this main banner (otherwise it's just black either side of the main banner.

Problem is, I suck at coding and was hoping someone on here might be able to lend a hand!



Site: http://ausnzclancentral.com/forums

And here's the CSS for that part of my site;


Code:
a, #main-content ul li a {color: #ac3395;}

body {background: #2B2D53;}

#pathway {color: #ac3395;}

#pathway a {color: #999;}

#page-bg {background: #FFFFFF;}

#copyright {color: #999;}

#showcase {background: #000000;}

#showcase-bottom-bg {background: url("http://ausnzclancentral.com/ladders/themes/vbStyle/images/style6/showcase-bg.jpg") 50% 50% repeat-x;}

#footer-top {background: #fff url(../images/style6/footer-top.png) 20% 5px repeat-x;}

#footer-top2 {background: url(../images/style6/footer-top2.png) 40% 100% no-repeat;}

#footer {background: url(../images/style6/footer-bg.png) 0 0 repeat-x;}

#footer-bar {background: url(../images/style6/footer-bar.png) 50% 0 no-repeat;}

#footer-highlight {background: url(../images/style1/footer-highlight.png) 50% 6px no-repeat;}

img#rocket {background: url(../images/style6/rocket.png) 0 0 no-repeat;}

.xhtml-button {background: url(../images/style6/xhtml.png) 0 0 no-repeat;}

.css-button {background: url(../images/style6/css.png) 0 0 no-repeat;}
Thanks in advance. __DEFINE_LIKE_SHARE__