Can someone help with a problem

Chris24

I am using a template on a site for my daughter.
Here is the link: http://jessica.ocs.frih.net

I am using a mod called jcal event calendar. On the left lowerhand side you see that the letters in the blue backround are black. I have edited almost every color in the css file and I could not get the letters to white. I also opened the css files of the mod itself but I din't get any results.

Is there any way someone could help me here with this? Frih$ in for anyone that can....

RiCtee

I see you're using Joomla. Very Happy

I don't use that component/module but I read the documentation. Make sure you're editing:

Chris24

I tried looking in that but I couldn't figure it out. Here is the contents of that css file:

#extcalendar td,#extcalendar tr,#extcalendar p, #extcalendar div {
font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
}

#extcalendar select {
color: inherit;
}

#extcalendar strong {
color: inherit;
}

#extcalendar h2.title {

font-family: Verdana, Arial, Helvetica, sans-serif;
background-image : url(images/box_left_icon.gif);
background-repeat : no-repeat;
background-position : left;
padding-left : 13px;
font-size: 11px;
margin: 0px;
color : #606F79;
}

#extcalendar p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
margin: 2px 0px;
}

#extcalendar hr {
color : #000000;
height: 1px;
}

#extcalendar .textinput {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #686868;
border-left-style: solid;
border-left-width: 1px;
border-left-color: #9BAAAF;

border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #AABBBF;

border-top-style: solid;
border-top-width: 1px;
border-top-color: #9BAAAF;

border-right-style: solid;
border-right-width: 1px;
border-right-color: #9BAAAF;
padding-right: 3px;
padding-left: 3px;
background-image: url(images/txtboxbg.gif);

}

#extcalendar .textarea {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color: #686868;
border-left-style: solid;
border-left-width: 1px;
border-left-color: #9BAAAF;

border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #AABBBF;

border-top-style: solid;
border-top-width: 1px;
border-top-color: #9BAAAF;

border-right-style: solid;
border-right-width: 1px;
border-right-color: #9BAAAF;
padding-right: 3px;
padding-left: 3px;

}

#extcalendar .listbox {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
border: groove 1px;
}

#extcalendar .button {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
border: 1px solid #AABBBF;
background-color : #FFFFFF;
color:#404F59;
background-image: url("images/btn_bg.gif");
padding: 0px;
}

#extcalendar a {
color: #606F79;
text-decoration: none;
}

#extcalendar a:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .apptitle {
font-family: Verdana, Arial, Helvetica, sans-serif; font-size:18px; font-weight: bold;
}

#extcalendar .appdesc {
font-family: Arial, Helvetica, sans-serif; font-size:10px; font-weight: normal;
}

#extcalendar .buttontext a {
font-size: 9px;
color: #606F79;
text-decoration: none;
}

#extcalendar .buttontext:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .previousmonth, #extcalendar .previousday, #extcalendar .previousweek {
font-size: 10px;
color: #606F79;
text-decoration: none;
font-weight: bold;
border-right: 1px solid #708088;
border-top: 0px solid #708088;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 2px;
text-align: left;
}

#extcalendar .previousmonth, #extcalendar .nextmonth, #extcalendar .previousweek, #extcalendar .nextweek, #extcalendar .previousday, #extcalendar .nextday {
width: 33%;
height: 22px;
text-align: center;
vertical-align: middle;
}

#extcalendar .miniarrow {
vertical-align: middle;
margin: 0 5px 0 5px;
}

#extcalendar .previousmonth a:hover, #extcalendar .previousday a:hover, #extcalendar .previousweek a:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .nextmonth, #extcalendar .nextweek {
font-size: 10px;
color: #606F79;
text-decoration: none;
font-weight: bold;
border-right: 1px solid #708088;
border-top: 0px solid #708088;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 10px;
text-align: right;
}

#extcalendar .nextday {
font-size: 10px;
color: #606F79;
text-decoration: none;
font-weight: bold;
border-right: 1px solid #708088;
border-top: 1px solid #708088;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 10px;
text-align: right;
}

#extcalendar .cal_message {
text-align: center;
font-weight: bold;
padding-top: 32px;
padding-bottom: 32px;
vertical-align: middle;
}

#extcalendar .nextmonth a:hover, #extcalendar .nextday a:hover, #extcalendar .nextweek a:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .currentmonth, #extcalendar .currentweek {
font-size: 12px;
color: #606F79;
text-decoration: none;
font-weight: bold;
border-right: 1px solid #708088;
border-top: 0px solid #708088;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 10px;
}

#extcalendar .currentmonth, #extcalendar .currentday, #extcalendar .currentweek {
width: 34%;
height: 22px;
text-align: center;
vertical-align: middle;
}

#extcalendar .currentday {
font-size: 12px;
color: #606F79;
text-decoration: none;
font-weight: bold;
border-right: 1px solid #708088;
border-top: 1px solid #708088;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 10px;
}

#extcalendar .tablev1 {
background-color: #dde0e0 ;
border-top: 1px solid #708088;
border-left: 0px solid #708088;
border-right: 1px solid #708088;
border-bottom: 0px solid #708088;
margin: 0px;
color : #708088;
padding-top: 12px;
padding-right: 2px;
padding-bottom: 12px;
padding-left: 2px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
text-decoration: none;
text-transform: uppercase;
vertical-align: middle;
}

#extcalendar .tablev1_top {
border-top: 0px solid #708088;
border-left: 0px solid #708088;
border-right: 1px solid #708088;
border-bottom: 0px solid #708088;
margin: 0px;
color : #708088;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
text-decoration: none;
text-transform: uppercase;
vertical-align: middle;
}

#extcalendar .tablev1_top_weekday {
background-color: #dde0e0;
border-top: 1px solid #708088;
border-left: 1px solid #708088;
border-right: 1px solid #708088;
border-bottom: 0px solid #708088;
margin: 0px;
color : #708088;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
text-decoration: none;
text-transform: uppercase;
vertical-align: middle;
}

#extcalendar .tablev1 a {
color : #708088;
text-decoration: none;
}

#extcalendar .tablev1 a:hover {
color : #708088;
text-decoration: underline;
}

#extcalendar .searchlink {
font-size: 10px;
color: #606F79;
text-decoration: underline;
font-weight: bold;
}

#extcalendar .searchlink:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .searchdesc {
font-size: 10px;
color: #606F79;
}

#extcalendar .eventtitle {
font-size: 10px;
color: #606F79;
text-decoration: none;
font-weight: bold;
}

#extcalendar .eventtitle:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .eventdesc {
font-size: 10px;
color: #606F79;
}

#extcalendar .eventdesclarge {
font-size: 12px;
color: #505F69;
line-height: 18px;
}

#extcalendar .cattitle, #extcalendar .usertitle, #extcalendar .grouptitle {
font-size: 11px;
color: #606F79;
text-decoration: none;
font-weight: bold;
}

#extcalendar .cattitle:hover, #extcalendar .usertitle:hover, #extcalendar .grouptitle:hover {
color: #8090A3;
text-decoration: underline;
}

#extcalendar .catdesc, #extcalendar .userdesc, #extcalendar .groupdesc {
font-size: 10px;
color: #606F79;
}

#extcalendar .titlehighlight {
color: #4488BB;
text-decoration: underline;
}

#extcalendar .highlight {
color: #80A000;
text-decoration: underline;
}

#extcalendar .tableh1 {
color:#606F79;
font-size: 11px;
height: 26px;
background-color: #FFFFFF;
background-position: top;
background-repeat: repeat-x;
padding-top: 8px;
padding-right: 12px;
padding-bottom: 8px;
padding-left: 8px;
border-left: 0px solid #FFFFFF;
border-right: 0px solid #FFFFFF;
border-bottom: 0px solid #CED2D6;
}

#extcalendar .tableh2 {
background-color: #dde0e0;
border-left: 0px solid #708088;
border-top: 1px solid #708088;
border-right: 1px solid #708088;
margin: 0px;
color : #708088;
padding-top: 6px;
padding-right: 12px;
padding-bottom: 6px;
padding-left: 12px;
font-size: 10px;
font-weight: bold;
}

#extcalendar .tableh2_nobackground {
color : white;
font-size: 10px;
font-weight: bold;
}

#extcalendar #recurrence_open div.tableh2 div.tableh2_nobackground,
#extcalendar #recurrence_close div.tableh2 div.tableh2_nobackground {
font-size: 12px;
color: #606F79;
text-decoration: none;
font-weight: bold;
}

#extcalendar tr.tableh2 td.tableh2 {
border-left: 0px solid #708088;
border-top: 1px solid #708088;
border-right: 1px solid #708088;
margin: 0px;
color : #708088;
padding-top: 6px;
padding-right: 12px;
padding-bottom: 6px;
padding-left: 12px;
font-size: 10px;
font-weight: bold;
}

#extcalendar .maintable_top .tableh2 {
border-left: 1px solid #708088;
font-size: 12px;
color: #606F79;
text-decoration: none;
font-weight: bold;
}

#extcalendar table.maintable td.tableb {
border-left: 0px solid #708088;
}

#extcalendar .tableb {
color : black;
padding-top: 6px;
padding-right: 10px;
padding-bottom: 6px;
padding-left: 10px;
border-top: 1px solid #708088;
border-right: 1px solid #708088;
border-bottom: 0px solid #708088;
border-left: 1px solid #708088;
line-height: 16px;
}

#extcalendar tr.tableb td.tableb {
border-left: 1px solid #708088;
}

#extcalendar .tableb_search {
color : black;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 6px;
padding-left: 10px;
line-height: 16px;
}

#extcalendar .tablec {
color : black;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 10px;
border-top: 1px solid #708088;
border-right: 1px solid #708088;
border-bottom: 0px solid #708088;
border-left: 0px solid #708088;
}

#extcalendar .maintable {
border-top: 1px solid #708088;
border-right: 0px solid #708088;
border-bottom: 1px solid #708088;
border-left: 1px solid #708088;
margin-top: 0px;
margin-bottom: 0px;
text-align: left;
background-color: #FFFFFF;
}

#extcalendar .maintable_top {
}

#extcalendar table.maintable_top td.tablec {
border-top: 1px solid #708088;
border-right: 1px solid #708088;
border-bottom: 1px solid #708088;
border-left: 1px solid #708088;
}

#extcalendar .error {
color : Red;
font-weight : bold;
}

#extcalendar .today {
font-size: 9px;
color: #606F79;
font-weight: bold;
}

#extcalendar .atomic {
font-size: 9px;
}

#extcalendar .legend {
font-family: Arial, Helvetica, sans-serif;
letter-spacing: 0.4pt;
font-size: 11px;
}

/* Weekday Label Cells */

#extcalendar .caldaydigits {
font-size: 9px;
}

#extcalendar .weekdaytopclr, #extcalendar .sundaytopclr {
background-color: #dde0e0;
border-left: 0px solid #708088;
border-top: 1px solid #708088;
border-right: 1px solid #708088;
margin: 0px;
color : #708088;
padding-top: 6px;
padding-right: 12px;
padding-bottom: 6px;
padding-left: 12px;
font-size: 10px;
font-weight: bold;
}

#extcalendar .sundaytopclr {
background-color: #dde0e0;
}

#extcalendar tr.tablec td.previousmonth,
#extcalendar tr.tablec td.previousweek {
border-left: 0px solid #708088;
border-bottom: 1px solid #708088;
}

#extcalendar tr.tablec td.currentmonth,
#extcalendar tr.tablec td.currentweek {
border-bottom: 1px solid #708088;
}

#extcalendar tr.tablec td.nextmonth,
#extcalendar tr.tablec td.nextweek {
border-bottom: 1px solid #708088;
}

#extcalendar tr.tablec td.previousday {
border-left: 1px solid #708088;
border-top: 1px solid #708088;
}

/* Day Cells */

#extcalendar .weekdayclr {
color: #C0C4C8;
font-size: 10px;
border-right: 1px solid #708088;
border-top: 1px solid #708088;
}

#extcalendar .todayclr {
background-color: #eef0f0;
color: #C0C4C8;
font-size: 10px;
border-right: 1px solid #708088;
border-top: 1px solid #708088;
}

#extcalendar .sundayemptyclr {
color: #C0C4C8;
font-size: 10px;
border-right: 1px solid #708088;
border-top: 1px solid #708088;
}

#extcalendar .weekdayemptyclr {
background-color: #f9f9f9;
color: #C0C4C8;
font-size: 10px;
border-right: 1px solid #708088;
border-top: 1px solid #708088;
}

/* Text Editor classes */

#extcalendar .tdBtn {
padding-left: 3px;
padding-top:3px;
}

#extcalendar .btnOut {
border: 1px solid;
border-color: #E4E8E8;
background-color: #E4E8E8;
}

#extcalendar .btnOver {
border: 1px solid;
border-top-color: #FFFFFF;
border-left-color: #FFFFFF;
border-right-color: #C0C4C4;
border-bottom-color: #C0C4C4;
background-color: #E4E8E8;
}

#extcalendar .btnDown {
border: 1px solid;
border-top-color: #C0C4C4;
border-left-color: #C0C4C4;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
background-color: #D4D8D8;
}

#extcalendar a.flatButton img {
border: 1px solid #E4E8E8;
border-color: #d8e0e4;
}

#extcalendar a.flatButton:hover img {
border: 1px solid;
border-top-color: #FFFFFF;
border-left-color: #FFFFFF;
border-right-color: #C0C4C4;
border-bottom-color: #C0C4C4;
background-color: #E4E8E8;
}

/* Monthly View classes */
#extcalendar .eventstyle {
font-size: 9px;
padding: 3px;
border-bottom: 2px solid #555555;
text-align: left;
}
#extcalendar .eventfull {
margin-left: 3px;
margin-right: 3px;
border-top: 1px solid #D0D4D4;
border-left: 1px solid #D0D4D4;
border-bottom: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
background-color: #E4E8E8;
}

#extcalendar .eventstart {
margin-left: 3px;
border-top: 1px solid #D0D4D4;
border-left: 1px solid #D0D4D4;
border-bottom: 1px solid #FFFFFF;
background-color: #E4E8E8;
}

#extcalendar .eventmiddle {
border-top: 1px solid #D0D4D4;
border-bottom: 1px solid #FFFFFF;
background-color: #E4E8E8;
}

#extcalendar .eventend {
margin-right: 3px;
border-top: 1px solid #D0D4D4;
border-bottom: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
background-color: #E4E8E8;
}

#extcalendar .imagecell {
background-color: #C8D2D8;
padding: 8px;
}
#extcalendar .imagecell img {
border: 1px solid;
border-top-color: #FFFFFF;
border-left-color: #FFFFFF;
border-right-color: #C0C6C6;
border-bottom-color: #C0C6C6;
}

/* Mini-calendar classes */

#extcal_minical .extcal_navbar {
border-bottom: 1px solid #B4B4B6;
}
#extcal_minical .extcal_tiny_add_event_link {
font-family: Verdana;
font-size: 9px;
font-weight: normal;
color:#575767;
text-decoration: none;
}
#extcal_minical TABLE.extcal_weekdays {
border-top: 1px solid #FFFFFF;
}
#extcal_minical TD.extcal_weekdays {
font-family: "Trebuchet MS", Verdana, Arial, "Microsoft Sans Serif";
font-size: 9px;
font-weight: normal;
color: #333333;
text-decoration: none;
padding: 4px 0px 0px 0px;
margin: 0px 0px -4px 0px;
}
#extcal_minical .extcal_small {
font-family: Verdana;
font-size: 9px;
color:#575767;
text-decoration: none;
}
#extcal_minical .extcal_small:link,#extcal_minical .extcal_small:visited {
text-decoration: none;
}
#extcal_minical .extcal_small:hover {
text-decoration: underline;
}

#extcal_minical .extcal_daycell,#extcal_minical .extcal_todaycell,
#extcal_minical .extcal_sundaycell,#extcal_minical .extcal_othermonth {
font-family: "Trebuchet MS", Verdana, Arial, "Microsoft Sans Serif";
font-size: 9px;
font-weight: bold;
font-style: normal;
text-decoration: none;
color:#555555;
background-repeat: no-repeat;
background-position: center center;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 2px;
padding-left: 2px;
}

#extcal_minical .extcal_todaycell {
color:#99AAAA;
background-image: url(images/rect.gif);
}

#extcal_minical .extcal_sundaycell {
color:#99AAAA;
}

#extcal_minical .extcal_othermonth {
color:#99AAAA;
}

#extcal_minical .extcal_daylink, #extcal_minical .extcal_sundaylink,
#extcal_minical .extcal_busylink {
font-family: "Trebuchet MS", Verdana, Arial, "Microsoft Sans Serif";
font-size: 9px;
font-weight: bold;
font-style: normal;
text-decoration: none;
}

#extcal_minical .extcal_daylink:link,#extcal_minical .extcal_daylink:visited {
color:#555555;
}

#extcal_minical .extcal_busylink:link,#extcal_minical .extcal_busylink:visited {
color:#2266EE;
text-decoration: none;
}

#extcal_minical .extcal_sundaylink:link,#extcal_minical .extcal_sundaylink:visited {
color:#99AAAA;
}

#extcal_minical .extcal_month_label {
font-family: Verdana, Arial, "Microsoft Sans Serif";
font-size: 10px;
font-weight: bold;
color: #565666;
}
#extcal_minical .extcal_picture {
}
#extcal_minical .extcal_weekcell {
margin: 0px;
padding: 0px;
}

Chris24

OK, I tried to change the values in this file but I wouldn't allow me to do so. Went into direct admin and reset all ownerships pertaining to this component. Then went back into the file I have on my computer edited the colors and attempted to re-upload the file after resetting ownerships. It still would not allow me to do this.

I keep getting critical transfer error, while using filezilla

RiCtee

To change the colour you just had to change this

Chris24

Yeah, I liked this one much better also. I missed 1 folder in resetting the ownership that was why it wasnt accepting. Thanks for the help

Josso

Chris24 - you should probably use quote tags otherwise you'll get yourself into trouble Wink