/*
BEGIN COMMENTS

HERE'S a primer on using html "A" tag definitions (officially called "selectors") 
with multiple states and / or classes assigned, as well as a basic 
explanation of "style inheritance"

The following "MASTER" A definition would be applied to ALL A TAGS 
in their default state with or without classes designated.
EACH designated style is inherited by ALL A tags in all 
states, unless you override this "MASTER" style 
by designating any of the following:

A:link (for the before-clicked state) 
A:hover (for the roll-over state) 
A:active (for the during-clicking state)
A:visited (for the after-clicked state)

Thus, if you have designated the "FONT-FAMILY" in the MASTER A Definition,
you do not have to designate the FONT-FAMILY in the PARENT or CHILD Definitions,
because it will inherit this particular style from the MASTER. I usually go ahead 
and redundantly designate the styles for easier reference, as you will notice below,
but I wanted to note that you don't actually have to. Notice how I designate 
TEXT-DECORATION:none; in the MASTER tag, and the PARENT/CHILD tags inherit this style.

EXAMPLE DEFINITION ENTRY:
A:hover.light 			(SELECTOR:STATE.CLASS)
{				(BEGIN DEFINITION)
FONT-WEIGHT: normal;		(STYLE:VALUE;)
}				(END DEFINITION)


END COMMENTS
*/

A
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #000000;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
    TEXT-DECORATION: none
}

/*
The following "PARENT" A definitions would be applied to ALL A TAGS 
without a class designation, and any unndefined states would inherit 
from the MASTER above.
*/

A:link
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #000000;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
}

A:hover
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #0000CC;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
    TEXT-DECORATION: underline;
}

A:active
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #000000;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
}

A:visited
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #666666;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
}
/*
NOTE: By combining the visited and hover selectors, you are able to ensure the hover effect happens even on visited links.
*/
A:visited:hover
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #0000CC;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
    TEXT-DECORATION: underline;
}

/*
The following "CHILD" A definitions would be applied ONLY to A TAGS 
with a class="light" designation... for example:

<a href="mypage.asp" class="light" target="_blank">Link</a>

Any undefined states below will inherit from the PARENT above!
*/

A:link.light
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #CCCCCC;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
}
A:hover.light
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #CC0000;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
    TEXT-DECORATION: underline;
}
A:active.light
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #CCCCCC;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
}
A:visited.light
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #999999;
    FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
}

/*
BEGIN COMMENTS 

You can leave out any of the 4 state definitions entirely, in order 
to have that particular state inherit it's styles from either the 
"PARENT" A definition, or the "MASTER" A definition if no PARENT 
definition is given. This is particularly useful if you don't 
want to have a VISITED state on your links, and you just want 
them to appear the same whether or not they have been clicked. 
In this case, simply don't define the visited state in the 
PARENT or CHILD, and the links will retain the appearance 
defined in the MASTER state at the very top.

Thus inheritance goes:

MASTER > PARENT > CHILD

OR you can look at it like:

A > A:state > A:state.class

END COMMENTS
*/