I am a total noobie at changing stuff - and am stuck and slightly frustrated. Is someone able to help me out and fix this for me? Here is my site - http://www.steroidsatmsu.com I need to change the text colours so that it matches a bit better. I figured out how to make it look pretty, played with the images and changed those colours. but am having issues with the CSS. Here is the Css - any one wanna have a go? /* custom stuff */ html { height: 100%; margin-bottom: 1px; } form { margin: 0; padding: 0; } body { margin: 0px 0px 0px 0px; height: 100%; font-size: 12px; background: #f5d1e4 url(../images/omt_bg_top.png) repeat-x; } a:link, a:visited { color: #AB290F; text-decoration: none; font-weight: normal; } a:hover { color: #c00; text-decoration: underline; font-weight: normal; } p { margin-top: 0; margin-bottom: 5px; text-align: left; } div, p, table, td, th { font-family: Lucida Grande, Verdana,Helvetica,Arial,sans-serif; line-height: 140%; color: #666; } fieldset { border: 1px solid #d2d8de; } #wrapper div, #wrapper p, #wrapper table, #wrapper td, #wrapper th { text-align: left; } span.pathway { padding-left: 10px; color: #394048; } div.componentheading { padding-left: 0px; } a.readon { margin-top: 10px; padding-right: 10px; line-height: 14px; height: 16px; } h1 { padding: 0; padding-bottom: 5px; font-family:Helvetica ,Arial,sans-serif; font-size: 18px; font-weight: bold; vertical-align: bottom; color: #666; text-align: left; width: 100%; } h2, .contentheading { font-family: Arial Narrow, Helvetica Nueue, Helvetica, sans-serif; font-weight: bold; font-size: 16px; color: #e2c9da; } h3 { margin: 0; } .componentheading, #mainbody h3 { margin: 0; margin-bottom: 10px; font-size: 11px; font-family: Arial; font-weight: bold; text-transform: uppercase; color: #806d7a; border-bottom: 1px solid #D2D8DE; } #mainbody h3 { line-height: 140%; height: 140%; padding: 0; text-indent: 0; } table.blog td.contentheading { } table.contenttoc { margin: 5px; border: 1px solid #ccc; padding: 5px; } table.contenttoc td { padding: 0 5px; } td.buttonheading { } td.sectiontableheader { background: #efefef; color: #333; font-weight: bold; padding: 4px; border-right: 1px solid #fff; } tr.sectiontableentry1 td, tr.sectiontableentry2 td { padding: 4px; } td.sectiontableentry1, td.sectiontableentry2{ padding: 3px; } table.contentpaneopen, table.contentpane { width: 100%; } div.moduletable h3 { margin-left: -8px; margin-right: -7px; border: 0px solid #f00; margin-bottom: 5px; height: 29px; line-height: 29px; font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-transform: uppercase; text-indent: 8px; color: #5d4659; } #leftnav div.moduletable h3 { background: url(../images/omt_moduletitle.png) 0 0 repeat-x; } #leftnav div.moduletable { background: url(../images/omt_module_bg.png) 0 28px no-repeat; } #leftnav ul { padding-left: 0; margin-left: 12px; } #leftnav li { margin-bottom: 5px; } div.moduletable { padding-bottom: 15px; padding-left: 8px; padding-right: 8px; } .small { font-size: 10px; color: #999; font-weight: normal; text-align: left; } .modifydate { height: 20px; vertical-align: bottom; font-size: 10px; color: #999; font-weight: normal; text-align: left; } .createdate { height: 20px; vertical-align: top; font-size: 10px; color: #999; font-weight: normal; vertical-align: top; padding-bottom: 5px; padding-top: 0px; } .clr { clear: both; } #page_bg { height: 100%; padding: 0; margin-bottom: 1px; } div.mosimage { margin: 5px; } div.mosimage_caption { font-size: 10px; color: #666; } table.adminform textarea { width: 540px; height: 400px; font-size: 1em; color: #000099; } div.search input { width: 145px; border: 1px solid #ccc; margin: 15px 0 10px 0; } /** some content stuff **/ div#wrapper { height: 100%; margin-left: auto; margin-right: auto; min-width: 750px; max-width: 950px; width: expression(document.body.clientWidth > 950? "950px": "auto" ); } div#top { background: url(../images/omt_header_m.png) 0 0 repeat-x; } div#top div { background: url(../images/omt_header_l.png) 0 0 no-repeat; } div#top div div { background: url(../images/omt_header_r.png) 100% 0 no-repeat; height: 98px; position: relative; } span#logo { position: absolute; display: block; left: 35px; top: 28px; width: 100px; height: 91px; z-index: 90; background: url(../images/omt_logo_trans.png) 0 0 no-repeat !important; background: transparent; } span#logo_header { position: absolute; left: 135px; top:28px; z-index: 90; width: 242px; height: 60px; background: url(../images/omt_logo_header.png) 0 0 no-repeat !important; background: transparent; } span#joomla { position: absolute; right: 14px; top: 21px; z-index: 99; width: 151px; height: 140px; background: url(../images/omt_joomla_trans.png) 0 0 no-repeat !important; background: transparent; } div#middle { background: #fff url(../images/omt_shadow_r2.png) 100% 0 repeat-y; } div#middle_2 { background: url(../images/omt_shadow_r1.png) 100% 0 no-repeat; } div#middle_3 { background: url(../images/omt_shadow_l2.png) 0 0 repeat-y; } div#middle_4 { background: url(../images/omt_shadow_l1.png) 0 0 no-repeat; padding: 0 19px; } div#bottom { background: url(../images/omt_shadow_b.png) 0 0 repeat-x; } div#bottom div { background: url(../images/omt_shadow_bl.png) 0 0 no-repeat; } div#bottom div div { background: url(../images/omt_shadow_br.png) 100% 0 no-repeat; height: 44px; padding-top: 5px; font-size: 10px; color: #A2A7A9; text-align: center; } div#navigation { height: 28px; background: url(../images/omt_buttonbar.png) 0 0 repeat-x; } div#centernav { margin: 0 auto !important; margin: 0; display: table !important; display: block; text-align: center; } /* this is not xhtml compliant but works in ie/firefox */ span#topnav { padding: 0; white-space: nowrap; display: table-cell !important; display: inline-block; } /** tab menu stuff **/ #topnav ul#mainlevel { float: left; padding: 0; margin:0; list-style: none; border-left: 1px solid #959A9E; border-right: 1px solid #ECF4FA; } #topnav #mainlevel li { float: left; margin: 0; padding: 0; border-right: 1px solid #806d7a; } #topnav #mainlevel a:link, #topnav #mainlevel a:visited { font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-transform: uppercase; color: #806d7a; float:left; display:block; padding: 0 30px; height: 28px; line-height: 28px; text-decoration: none; background: url(../images/omt_button_off.png) 0 0 no-repeat; border: 0; } #topnav #mainlevel li.red_active_menu { border-right: 1px solid #721901; } #topnav #mainlevel li.red_active_menu a:link, #topnav #mainlevel li.red_active_menu a:visited { background: url(../images/omt_button_on.png) 0 0 no-repeat; color: #EEF0F2; float:left; padding: 0 30px; height: 28px; line-height: 28px; } #topnav #mainlevel a:hover { color: #616B78; } #topnav #mainlevel li.red_active_menu a:hover { color: #fff; } #showcase { margin: 0; padding: 1px 0; background: #47505A url(../images/omt_showcase_bg.png) 0 0 repeat-x; } /* turned OFF disable header in showcase area #showcase .moduletable h3 { display: none; margin: 0; padding: 0; } */ #showcase .moduletable { padding: 5px 10px; margin: 0; } #showcase td, #showcase div, #showcase p, #showcase span { color: #D8DBDE; } #showcase .contentheading { font-family: Arial Narrow, Helvetica Nueue, Helvetica, sans-serif; font-weight: bold; font-size: 16px; } #user1 { width: 50%; } #user2 { width: 50%; } table.contentarea { background: url(../images/omt_body_right.png) 100% 0 repeat-y; } #leftnav { width: 180px; border: 0px solid #ff0; background: url(../images/omt_column_left.png) 0 0 repeat-y; } #leftborder { border-left: 1px solid #D3D8DE; } #lefttop { border: 0px solid #00f; } div#mainbody { border: 0px solid #0ff; padding: 12px; } #rightnav { width: 180px; border: 0px solid #00f; background: url(../images/omt_column_right.png) 100% 0 repeat-y; } #righttop { background: url(../images/omt_bodytop_r.png) 0 0 no-repeat; height: 29px; } #rightbody { background: url(../images/omt_rightnav_bg.png) 0 0 repeat-x; } #pathway{ background: url(../images/omt_bodytop.png) 0 0 repeat-x; padding-top: 5px; height: 29px; } #leftnav ul.submenu, #leftnav ul.submenu ul { list-style:none; margin: 0; padding: 0; } #leftnav ul.submenu li { background: none; padding: 0; margin: 0; } #leftnav ul.submenu ul li { text-indent: 10px; } #leftnav ul.submenu ul li { text-indent: 20px; } #leftnav ul.submenu ul ul li { text-indent: 30px; } #leftnav ul.submenu ul ul ul li { text-indent: 40px; } #leftnav ul.submenu ul ul ul ul li { text-indent: 50px; } ul.submenu a:link, ul.submenu a:visited { display: block; width: 147px; padding-right: 15px; padding-bottom: 5px; background: url(../images/omt_menu_red.png) 100% -2px no-repeat; } ul.submenu a:hover { background-position: 100% -53px; text-decoration: none; } a.mainlevel:link, a.mainlevel:visited { display: block; width: 147px; padding-right: 15px; padding-bottom: 5px; background: url(../images/omt_menu.png) 100% -2px no-repeat; } a.mainlevel:hover { background-position: 100% -53px; text-decoration: none; } div#footer { margin-top: 10px; width: 766px; height: 28px; line-height: 28px; text-indent: 20px; background: #e6eef8; } div#footer table { margin-top: 4px; } div#footer table td { text-align: center; } div#footer a { padding: 0 10px; } div#topmodule { position: relative; margin-top: 20px; margin-bottom: 20px; height: 80px; overflow: hidden; } div#quote { padding-top: 10px; margin-right: 10px; text-align: left; float: right; width: 505px !Important; width: 485px; } div#quote td { text-align: left; } table.menublock { margin: 0 15px; } td.summary { background: #eef3f9; padding: 5px; padding-left: 10px; } td.latestnews { background: #eef3f9; padding: 5px; } /* some page content things */ table.blog span.article_seperator { display: block; height: 20px; } table.nopad { width: 100%; border-collapse: collapse; padding: 0; margin: 0; margin-bottom: 15px; } table.nopad td.middle_pad { width: 20px; } body.contentpane { background: #fff; } Code (markup):