Left & Right hand column problems. please help!

[staks]

After scavenging through posts of similar issues i gave up without finding success.

I am trying to get the calendar to work with my water & stone (default) template. If i place it on the left hand side it is very cloudy, as if the colours are behind a white silhouet. It centres perfectly but isn't really readable unless you highlight it.

When i try and move the calendar to the right hand side, it doesn't fit in the right column and i need to scroll to the left or right to see it all. The colours on this side are fine.

I had no idea how to fix the colours, so i just attempted to try and fix the size issue on the right. The first thing i tried was editing the esstyle.css and lowering the values for -

/* Main Table Setup Incluidng Date Number Fonts, Size and Color */
.mainTable {
background-color: #FFFFFF;
border: 1px solid #003366;
width: 175px;
}
.navTable {
background-color: #FFFFFF;
border: 0px solid #FFFFFF;
width: 175px;
}

No matter what i set it at, it didn't make a difference. I even set it to as low as 120px. Am i editing the right file? I also noticed there were two of these, one under the themes\default folder and one under themes\system folder. Whcih is the correct one? (i did it to both with no success).

I don't mind which side i have the calendar on, i just want it either aligned properly, or in its correct colours!

Any assistance would be greatly appreciated :)

Thank you!

[Brian]

The default theme will be the one that should be edited for your page. If you can provide a link to your page, I may be able to see what's happening.

[staks]

Thanks for the reply brian.

The website is

At the moment the calendar is on the left hand side, you will see what i mean about the colours being incorrect, as if they are behind a white silhouet.

[Brian]

Your existing CSS on the template css file has the following element. This element is overriding the td element of the calendar changing the calendar text to a light color. When I removed this (using FireFox and web developers tools), the calendar appeared correctly.

/** module styles in #leftcol **/
#leftcol table.moduletable td {
color:#DADADA;
font-size:11px;
}

[staks]

Hi Brian,

Thanks for the reply. I edited the template_css.css file and removed the entry you suggested. It doesn't seem to have made a difference =\ Not sure why. Is it showing up correctly when you visit it now? When i view it in IE and firefox they both appear to show it.

[Brian]

It looks like this CSS is affecting it too:

/** general module table **/
#rightcol table,
#leftcol table td {
font-size:11px !important;
color:#CCCCCC;
}

[staks]

Thanks heaps brian! that did the trick :)