I have a tab control in a user control and tab_ related style sheets defined. The usercontrol code with the css works fine in a normal web form. A mouse over highlights the tab and click changes the background of the sepected tab and restores the previous active tab to it's default background.  There's no javascript in the page. It's pure css.

This works fine in a normal web page in a user control. But once it's moved into DNN things change. A mouse over works fine until the button is clicked then then tab heading goes back to some default or something and the css is no longer recognized? No mouse over effects not border or background changes. Clicking still changes to the specified tab content but the header is plain?

Any ideas what in DNN would change the tabcontainer to reset the css associated with it? Why is the css getting lost? Again this code works fine in a normal (non-DNN) web page. It only fails when it's put into DNN.

Any ideas or suggestions would be appreciated.
The css used is as follows ---

.CustomTabStyle {font-family:Verdana,tahoma,helvetica; font-size:11px;background-color:White; border-style:Solid; border-width:1; border-color:rgb(207, 207, 207); padding:1px;}

.ajax__tab_header {border-bottom: solid 1px White}

.ajax__tab_tab {background-color: rgb(207, 207, 207);}

.ajax__tab_outer { border-left: solid 1px #999999;border-right: solid 1px White; border-top: solid 1px White; border-bottom: solid 1px White; }

.ajax__tab_inner {border: solid 1px black;}

.ajax__tab_hover .ajax__tab_outer { border-left: solid 1px black; border-right: solid 1px black; border-top: solid 1px black; border-bottom: solid 1px black; }

.ajax__tab_active .ajax__tab_tab {background-color: white;} .ajax__tab_outer { border-left: solid 1px #999999;border-right: solid 1px White; border-top: solid 1px White; border-bottom: solid 1px White; } .ajax__tab_inner {border: solid 1px black;}

.ajax__tab_body {border-top: 0; background-color: White;}