/*

menu.css

This stylesheet provides the styles that create the linkbar on all pages of the
Lapidary School Website

referenced at the top of all style cascades

original instance of this menu system,
(GRC's Script-Free Pure-CSS Menuing System)
,is released under a public license by its author
for more information visit www.GRC.com

This instance in combination with the complete set of css style sheets,
software, scripts, databases, xhtml documents, etc.
that make up this site are (c) William Holland Retreat, INC. 2009

*/

/*colors for the bar are all defined here */

.linkbar, .linkbar ul li,
.linkbar ul li:hover ul li:hover ul li a,
.linkbar ul li a:hover ul li a:hover ul li a {
 color:        #000;
 background:   #FF0000;
}

/* go ahead and strip the stupid styling of all links */
.linkbar a,
.linkbar ul li:hover ul li:hover ul li a,
.linkbar ul li a:hover ul li a:hover ul li a {
 color:        #000;
 text-decoration: none;
 padding:         0 4px;
}

.linkbar a:hover,
.linkbar ul li:hover ul li:hover ul li a:hover,
.linkbar ul li a:hover ul li a:hover ul li a:hover {
 background:      #F28282;
}

/* style the outside of the linkbar itself */
.linkbar {
 position:     relative;
 float:        left;
 margin:       0;
 border:       1px solid #000;
 height:       1.5em;
 width:        100%;
 min-width:    10in;
 font-variant: small-caps;
 font-size:    16px;
 font-family:  Arial, sans-seriff;
}

/* strip unwanted styles from ul tags and set a default line-height */
.linkbar ul {
 position:     relative;
 list-style:   none;
 float:        left;
 border:       0;
 margin:       0;
 padding:      0;
 line-height:  1.5em;
}

/* set the top level button's look */
.linkbar ul li {
 position:     relative;
 border:       0;
 margin:       0;
 padding:      0;
 float:        left;
 height:       1.5em;
 width:        auto;
 min-width:    1in;
 border-right: 1px solid #000;
 text-align:   center;
}

/* this is the special code to make the GRC method work accross many browsers */
.linkbar ul li table {
 margin:          -1px 0;      /* IE5 needs -1px top and bottom table margins */
 m\argin:         0;           /* re-zero the table margins for everyone but IE5 */
 border-collapse: collapse;    /* IE5 needs this for the sub-menus to work */
 font-size:       12px;        /* this sets the base font size for our entire menu */
}

/* style that aligns the text and drop symbol correctly for signaling submenus */

.drop {
 display:         block;
 padding:         0px; /* this sets the l/r margins for our menu item */
 margin:          0;
 text-align:      right;      /* this right alignment goes with the float:left below */
 cursor:          pointer;    /* IE tries to switch back to an I-beam, don't let it */
 cursor:          hand;       /* IE5 only knows about "hand", so set it both ways */
}

.drop span {                  /* this simultaneously left and right aligns the text and */
 float:           left;       /* the >> in the drop-down menus which link to sub-menus */
}

/* first level menu */

.linkbar ul li ul {
 display:none; /* hide the menu's when no curser over them */
 padding:1px;  
 z-index: 10;  /* puts the first level dropdowns on top of everything, increase the number if needed */
}

.linkbar ul li a,
.linkbar ul li a:visited {                    /* unselected top-level menu items */
 display:block;
 float:left;
 height:1.5em;
 width:1in;
 border-bottom: 2px solid #000;
}

.linkbar ul li:hover a,
.linkbar ul li a:hover {       /* selected top-level menu items */
 border:      0;
 border-top:  1px solid #000;    /* these 3 lines create the push-in illusion */
 border-left: 1px solid #000;
 border-right:1px solid #000;
 height:      1.5em;
 padding:     0 3px;
 font-weight: bold;
}

/*======================== 2ND LEVEL MENU DEFINITIONS ========================*/

.linkbar ul li:hover ul,
.linkbar ul li a:hover ul {                           /* 2nd level drop-down box */
	display:block;
	position:absolute;
	margin:0;
	top:1.5em;              /* place us just up underneath the top-level images */
	left:-1px;       /* left-align our drop-down to the previous button border */
	height:auto;      /* the drop-down height will be determiend by line count */
	border-bottom: 1px solid #000;
	width:13.5em;
	color:black;                        /* this sets the unselected-text color */
	background:black;         /* this sets our menu's effective "border" color */
	z-index:15;
}

.linkbar ul li:hover ul.skinny,
.linkbar ul li a:hover ul.skinny {             /* 2nd level skinny drop-down box */
        width:12em;
        padding-right:2px;
}

.linkbar ul li:hover ul li a,
.linkbar ul li a:hover ul li a {                   /* 2nd level unselected items */
	border:0;
	margin:0;
	padding:0 4px;
	height:auto;
	width:100%;
        text-align:left;
        font-weight:normal;
}

.linkbar ul li:hover ul li:hover a,
.linkbar ul li a:hover ul li a:hover {                /* 2nd level selected item */
        font-weight:bold;
}

.linkbar ul li:hover ul.skinny li a,
.linkbar ul li a:hover ul.skinny li a,
.linkbar ul li:hover ul.skinny li a:hover,
.linkbar ul li a:hover ul.skinny li a:hover {     /* 2nd level un+selected items */
        width:11.62em;
}

/*======================== 3RD LEVEL MENU DEFINITIONS ========================*/

.linkbar ul li:hover ul li ul,
.linkbar ul li a:hover ul li a ul {             /* hide inactive 3rd-level menus */
	visibility:hidden;
	z-index:25;
}
     
.linkbar ul li:hover ul li:hover ul,
.linkbar ul li a:hover ul li a:hover ul {             /* 3rd level drop-down box */
	visibility:visible;
	position:absolute;
	margin-top:-1px;	      /* bring the top edge of the 3rd level menu up one */
	margin-left: 1px;
	top:0;
	left:12em;
	width:11em;
        padding-right:9px;
	z-index:25;
}

.linkbar ul li:hover ul li:hover ul li a,
.linkbar ul li a:hover ul li a:hover ul li a {     /* 3rd level unselected items */
	width:11em;
        font-weight:normal;
	z-index:25;
}

.linkbar ul li:hover ul li:hover ul li a:hover,
.linkbar ul li a:hover ul li a:hover ul li a:hover {    /* level3 selected items */
	width:11em;
        font-weight:bold;
	z-index:25;
}

#text {           /* the Mac's standard Safari browser will not see this code */
	height:1.215em;#           /* ...  but every other browser will and should */
} /* Safari barfs on the illegal pound sign (#) after the rule's property val */
