Removing the template boarder around google ads

[tezz71]

I'm hoping someone might be able to help me with a template issue. I have just placed Google ads on my site using a custom Html module, and placed it in the right position. The problem is the ads appear with the template border around them. I have tried editing it in the template css but the border then gets removed from everything in the left and right position. The website is http://www.pcsupportforum.net below is a snippet of the template css I tried to edit. Removing the border:solid 1px #000000 resulted in all the borders being removed. Any help would be much appreciated.

Code: Select all

/* Left, Right Modules */
#allsidebar-custom .module, #allsidebar-custom .module { width: 197px;}
#allsidebar-custom .module h3, #allsidebar-custom .module h3, #allsidebar-custom .module_menu h3, #allsidebar-custom .module_menu h3 { color: #fff; padding-left: 10px; font-size: 12px; height: 22px; padding-top: 6px; background: url(../images/sidebar.png) no-repeat center top;}
.inner {  border:solid 1px #000000; padding-bottom: 1px; margin-top: 9px; }
.module { padding:0; margin:0 0 10px 0; }
.module-title {font-size:20px;font-weight:bold;margin:0 10px;padding:5px 0 5px 5px;line-height:20px; color: #969696; text-shadow:1px 1px #fff; border-bottom:3px solid #e8e8e8; }
.module-body {margin:0; padding:3px 13px 3px 10px; background-color: #ffffff;} 
.module-body p{ padding:0; margin:0;}
.module-body ul li{margin:0;}
.module-body ul li a{display:block; padding:3px 0 3px 13px;font-weight:normal;line-height:15px;background: url(../images/vertical.png) 0% 50% no-repeat; text-decoration:none; color:#0069d0; }
.module ul li { margin:0 5px; padding:0;}
.module ul.menu, .module_menu ul.menu{margin:0; padding:0;list-style:none; padding:0; list-style-type:none; }
.module ul.menu li, .module_menu ul.menu li{ list-style-type:none;margin:0; padding:0;}
.module ul.menu li a, .module_menu ul.menu li a {display:block;margin:0; padding:3px 0 3px 13px;font-weight:normal;line-height:15px;background: url(../images/vertical.png) 0% 50% no-repeat; text-decoration:none; color:#0069d0}
.module ul.menu li a:hover, .module_menu ul.menu li a:hover { text-decoration:none; color:#013a78;}
.module ul.menu li.active a, .module_menu ul.menu li.active a{color: #013a78;}
.module ul.menu li ul, .module_menu ul.menu li ul {margin:0;}
.module ul.menu li ul li, .module_menu ul.menu li ul li {background:none; border:none; margin: 0 0 0 15px;   }
.module ul.menu li ul li a, .module_menu ul.menu li ul li a{ border: 0; color:#0069d0; background: url(../images/vertical.png) 0% 50% no-repeat;}
.module ul.menu li ul li a:hover, .module_menu ul.menu li ul li a:hover{ border: 0; color:#013a78; background: url(../images/vertical.png) 0% 50% no-repeat; }
.module ul.menu li ul li.active a, .module_menu ul.menu li ul li.active a{color: #013a78;}
.module ul.menu li.active ul li a, .module_menu ul.menu li.active ul li a{color: #0069d0;}
.module ul.menu li.active ul li a:hover, .module_menu ul.menu li.active ul li a:hover{color: #013a78;}
/* End Modules */

[aemiller]

Have you tried using Firebug or Chrome developer tools?

[tezz71]

Thanks for your swift response, I tried using firebug that's how I located the setting to disable the border. However, when I do this it removes the border for all the other modules on the left and right. I must admit I am new to CSS so there could be something I'm missing.

[tezz71]

I guess this is a little bit more trickier than I thought. Does anyone have any ideas?