Using XF Page css

[Morgain]

I was excited to re read Brogan's Page templates because his Alternative Headings template displays the category container bars which I like very much.
http://xenforo.com/community/threads/team-staff-page-templates.4974/

However my category bars are customised
with individual different colour gradients + title font colour + and an image graphic on the left using a background image.
This is all done in EXTRA.css with code snippets from Jake Bunce.
See my forums list http://www.housemorgain.co.uk/forumxf

I have created a test page to try to get one test category bar to show up using Brogan's code for the bar and Jake's css.
Well I have the image floating around - and a standard XF category header bar courtesy of Brogan (thank you). That's all so far.
TEST PAGE
http://www.housemorgain.co.uk/forumxf/index.php?pages/5test/
Here's how it will look when it's right.


PART 1 fix I tried without success to make the title link show blue font

{
.cat_gossip
color: 3333ff;
size: 4pt;
background-color: ccffff;
}

Is size 4pt like font size 4?

Anyway I tried to link to that by putting this code in the divs around the target area.

<div class="cat_gossip">
STUFF
</div>

PART 2 fix -colour of title
In the code (view source) in the <style> list I have placed the snippet I have in EXTRA.css which make the bar a blue gradient.

/* Category strip color */
.nodeList  .node_16  .categoryStrip
{
    background-color: #8AB5F2;
}

PART 3 fix - the graphic
This is the code snippet I have in EXTRA.css which adds the graphic.
(I'll cope with imagepaths later please? This long URL works OK for the forums list.)

/* Category image */
.catImage16
{
    background-image: url('http://www.housemorgain.co.uk/forumxf/styles/default/xenforo/widgets/cat-web2.png');
    float: left;
    width: 40px;
    height: 40px;
    margin-right: 5px;
}

 

[Jake Bunce]

{
.cat_gossip
color: 3333ff;
size: 4pt;
background-color: ccffff;
}

The curly is wrong. And you need a hash before those color codes. And I think you want "font-size":

.cat_gossip
{
color: #3333ff;
font-size: 4pt;
background-color: #ccffff;
}