/*
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 unnassigned states would inherit 
from the MASTER, more or less.
*/

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 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;
}
A:visited:hover.light
{
    FONT-WEIGHT: normal;
    FONT-SIZE: 13px;
    COLOR: #CC0000;
    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. 

Thus inheritance goes:

MASTER > PARENT > CHILD

OR you can look at it like:

A > A:state > A:state.class

END COMMENTS
*/