I use a program from OpenCube to generate a custom sidebar menu. It contains all this custom CSS code in it to produce my desired menu.

When I use a text widget to include the code in the sidebar it must conflict with styles used in the theme as it looks aweful and not how it looks on a website.

Is there any way in the theme to allow the CSS to "pass through" without the theme getting it and rendering it. I guess what I'm saying is, anyway to override the styles in the theme just for my custom sodebar menu?

Try sticking the custom CSS in the CSS Inserts
Or put an !important at the end of each of the custom CSS rules

I tried that. I replaced all ";}" with "; !important}"

Is that the correct syntax? Doesn't seem to have an effect. Here is an except of the menu CSS I changed

//Core CSS
document.write('<style type="text/css">.imcm ul,.imcm li,.imcm div,.imcm span,.imcm a{text-align:left;vertical-align:top;padding:0px;margin:0;list-style:none outside none;border-style:none;background-image:none;clear:none;float:none;display:block;pos ition:static;overflow:visible;line-height:normal; !important}.imcm li a img{display:inline;border-width:0px; !important}.imcm span{display:inline; !important}.imcm .imclear,.imclear{clear:both;height:0px;visibility :hidden;line-height:0px;font-size:1px; !important}.imcm .imsc{position:relative; !important}.imcm .imsubc{position:absolute;visibility:hidden; !important}.imcm li{list-style:none;font-size:1px;float:left; !important}.imcm ul ul li{width:100%;float:none !important; !important}.imcm a{display:block;position:relative; !important}.imcm ul .imsc,.imcm ul .imsubc {z-index:10; !important}.imcm ul ul .imsc,.imcm ul ul .imsubc{z-index:20; !important}

the ':' comes after the '!important' so it might be 'color: red !important;