All colors drastically different in IE

I have designed my page using Firefox and it looks exactly as I would expect it to, colors consistent with my design using Photoshop. When I view the page in Internet Explorer, all the colors are changed. It looks as if everything has a slight gray layer over it making it look dreary and "gross." Even the background image looks very different, it is lighter and brown-ish. The transparency I applied doesn't have any effect (yes, I added the IE "filter" property for alpha-opacity). The CSS I have added (in addition to the existing myspace styles) is here:

<style type="text/css">
.bodyContent
{
  background-color: 1e190c;
  background-image: url('http://img15.imageshack.us/img15/706/58119117.jpg');
  background-position: center;
  background-repeat: repeat-y;
  filter: alpha(opacity=80);
  opacity: 0.8;
}

.bodyContent a, .bodyContent a:link, .bodyContent a:active, .bodyContent a:visited
{
  color: ffffff;
  text-decoration:
  underline;
}
.bodyContent a:hover
{
  color: ff6600;
}

.bodyContent br
{
  line-height: 20px;
}

.bodyContent table
{
  border-style: solid;
  border-color: ffffff;
  border-width: 0px 1px 0px 1px;
  background-color: 3c0909;
}
.bodyContent table table table td
{
  border-width: 0px;
}
.bodyContent table table table table
{
  border-spacing: 1px;
}
.bodyContent table[id="headerTable"] td
{
  background-color: 2358b8;
}
.bodyContent table[id="musicJVNav"] td
{
  background-color: transparent;
}

.bodyContent tr, .bodyContent td, .bodyContent table table, .bodyContent table table td
{
  color: ffffff;
  border-width: 0px;
  background-color: transparent;
}

.bodyContent table table table table table strong
{
  color: ffffff;
}
.bodyContent table table table table
{
  border-width: 0px;
  background-color: transparent;
  padding: 0px;
  margin: 0px;
  background-image: none;
}
.bodyContent table table table table td
{
  padding: 0px;
  margin: 0px;
}
.bodyContent table table table
{
  width: 100%;
  margin: 0px;
  background-color: 232223;
  border-width: 1px;
  border-color: FFFFFF;
}

.bodyContent table.friendSpace
{
  display: none;
}

.bodyContent .text, .bodyContent .text font
{
  background-color: transparent;
  color: FFFFFF;
}
.bodyContent .nametext
{
  background-image: url('http://img6.imageshack.us/img6/479/thefallcontinent.png');
  width: 300px;
  height: 100px;
  display: inline-table;
  font-size: 0px;
}
</style>

I have screen shot of what I am talking about:
Firefox: http://img257.imageshack.us/img257/6490/shotff.jpg
IE: http://img21.imageshack.us/img21/1043/shotie.jpg