/* NOTES:

Body:
S_X = section number (class)
N_X = node number (class)
T_X = tier number (class)
P_X = menu item number (id)
 P_X   = top menu item
 P_XX  = node menu item
 P_XXX = dropdown menu item

M_XX = menu number (id)
 M_0  = top menu
 M_Y  = node menu
 M_YY = dropdown menu

I_X = menu item number (id)
 I_X   = top menu item
 I_XX  = node menu item
 I_XXX = dropdown menu item

The code is generating some unneeded id attributes, primarilly on the body and dropdown menu items, but we 
are leaving them in for the time being in case we want to do anything special.  An example of this would be
a you are here indicator in the menus.

We emit HTML for all menus in a section, but default them to not display.  The id and class names are closen so that we can
emit all menus for the entire site on every page, but only turn on what is needed.

We make use of multiple classes on the body element to help us decide which menus to display.

We use selector logic to turn menus on when needed.  No Javascript!

Some of the selector logic is more verbose than needed, but it helps understand what is going on.

Item and menu coordinates depend on the node graphics.  If the graphics change, then the coordinates must change.

*/

/* set the topnav background */

body.S_0 #nav1.HTML { background: url(images/nav_1.gif) top left no-repeat; }
body.S_1 #nav1.HTML { background: url(images/nav_1.gif) top left no-repeat; }
body.S_2 #nav1.HTML { background: url(images/nav_2.gif) top left no-repeat; }
body.S_3 #nav1.HTML { background: url(images/nav_3.gif) top left no-repeat; }
body.S_4 #nav1.HTML { background: url(images/nav_4.gif) top left no-repeat; }
body.S_5 #nav1.HTML { background: url(images/nav_5.gif) top left no-repeat; }

/* set the topnav link color for the current section, which overrides the default style  */

body.S_0 #I_1 a,
body.S_1 #I_1 a,
body.S_2 #I_2 a,
body.S_3 #I_3 a,
body.S_4 #I_4 a,
body.S_5 #I_5 a {
	color: #126798;
}

/* position the topnav items */
/* coordinates depend on the text */

#nav1 {
	position: relative; /* so we can absolute position elements within this */
}

#nav1 ul li {
	position: absolute;
	float: left;
	width: 90px;
	top: 14px;
	text-align: center;
}

#I_1 { z-index: 1001; left:   2px; }
#I_2 { z-index: 1002; left:  92px; }
#I_3 { z-index: 1003; left: 182px; }
#I_4 { z-index: 1004; left: 272px; }
#I_5 { z-index: 1005; left: 362px; }

/* set the middle nav background */

/*body.S_1 #nav2 { background: url(images/nodes_1.gif) top left no-repeat; }*/
/*body.S_2 #nav2 { background: url(images/nodes_2.gif) top left no-repeat; }*/
/*body.S_3 #nav2 { background: url(images/nodes_3.gif) top left no-repeat; } */
/*body.S_4 #nav2 { background: url(images/nodes_4.gif) top left no-repeat; }*/
/*body.S_5 #nav2 { background: url(images/nodes_5.gif) top left no-repeat; }*/

/* need BG class because IE can't do multiple class selection */

body.BG_00 #nav2.HTML { background: url(images/nodes_10.jpg) top left no-repeat; }

body.BG_10 #nav2.HTML { background: url(images/nodes_10.jpg) top left no-repeat; }
body.BG_11 #nav2.HTML { background: url(images/nodes_11.jpg) top left no-repeat; }
body.BG_12 #nav2.HTML { background: url(images/nodes_12.jpg) top left no-repeat; }
body.BG_13 #nav2.HTML { background: url(images/nodes_13.jpg) top left no-repeat; }
body.BG_14 #nav2.HTML { background: url(images/nodes_14.jpg) top left no-repeat; }
body.BG_15 #nav2.HTML { background: url(images/nodes_15.jpg) top left no-repeat; }

body.BG_20 #nav2.HTML { background: url(images/nodes_20.jpg) top left no-repeat; }
body.BG_21 #nav2.HTML { background: url(images/nodes_21.jpg) top left no-repeat; }
body.BG_22 #nav2.HTML { background: url(images/nodes_22.jpg) top left no-repeat; }
body.BG_23 #nav2.HTML { background: url(images/nodes_23.jpg) top left no-repeat; }
body.BG_24 #nav2.HTML { background: url(images/nodes_24.jpg) top left no-repeat; }

body.BG_40 #nav2.HTML { background: url(images/nodes_40.jpg) top left no-repeat; }
body.BG_41 #nav2.HTML { background: url(images/nodes_41.jpg) top left no-repeat; }
body.BG_42 #nav2.HTML { background: url(images/nodes_42.jpg) top left no-repeat; }
body.BG_43 #nav2.HTML { background: url(images/nodes_43.jpg) top left no-repeat; }
body.BG_44 #nav2.HTML { background: url(images/nodes_44.jpg) top left no-repeat; }
body.BG_45 #nav2.HTML { background: url(images/nodes_45.jpg) top left no-repeat; }

body.BG_50 #nav2.HTML { background: url(images/nodes_50.jpg) top left no-repeat; }
body.BG_51 #nav2.HTML { background: url(images/nodes_51.jpg) top left no-repeat; }
body.BG_52 #nav2.HTML { background: url(images/nodes_52.jpg) top left no-repeat; }
body.BG_53 #nav2.HTML { background: url(images/nodes_53.jpg) top left no-repeat; }

/* defaults for menus */

#nav2 {
	position: relative; /* so we can absolute position elements within this */
}

/* turn off all menus by default */

#nav2 ul {
	display: none;
}

/* properties for all node labels to inherit */
/* we define this here because it is inheriently related to the selector based positioning */

ul.nodemenu li {
	position: absolute;	float: left; 
}

/* properties for all dropdown menus to inherit */
/* we define this here because it is inheriently related to the selector based positioning */

.dropdownmenu {
	position: absolute;	float: left; 
}

/* turn on the proper node menu */

body.S_0 #M_1,
body.S_1 #M_1,
body.S_2 #M_2,
body.S_3 #M_3,
body.S_4 #M_4,
body.S_5 #M_5 {
	display: block;
}

/* position the node labels */
/* coordinates are relative to nav2 */
/* coordinates depend on the node graphics */

#M_1 #I_10 { z-index: 1000; left: 276px; top:  37px; }
#M_1 #I_11 { z-index: 1100; left:  54px; top:  33px; }
#M_1 #I_12 { z-index: 1200; left: 206px; top:   9px; }
#M_1 #I_13 { z-index: 1300; left: 378px; top:  78px; }
#M_1 #I_14 { z-index: 1400; left: 562px; top:  36px; }
#M_1 #I_15 { z-index: 1500; left: 666px; top:  10px; }

#M_2 #I_20 { z-index: 2000; left: 363px; top: 100px; }
#M_2 #I_21 { z-index: 2100; left:  36px; top:  12px; }
#M_2 #I_22 { z-index: 2200; left: 179px; top:  50px; }
#M_2 #I_23 { z-index: 2300; left: 509px; top:  50px; }
#M_2 #I_24 { z-index: 2400; left: 619px; top:  12px; }

#M_4 #I_40 { z-index: 4000; left: 546px; top:  20px; }
#M_4 #I_41 { z-index: 4100; left:  32px; top:  50px; }
#M_4 #I_42 { z-index: 4200; left: 266px; top:  43px; }
#M_4 #I_43 { z-index: 4300; left: 352px; top:  72px; }
#M_4 #I_44 { z-index: 4400; left: 648px; top:  50px; }

#M_5 #I_50 { z-index: 5000; left: 632px; top:  14px; }
#M_5 #I_51 { z-index: 5100; left:  50px; top:  40px; }
#M_5 #I_52 { z-index: 5200; left: 216px; top:  88px; }
#M_5 #I_53 { z-index: 5300; left: 500px; top:  62px; }

/* turn on the proper dropdown menu */
/* this is more than needed, but it was generated with the following: /*
/* for i in 1 2 3 4 5; do for j in 1 2 3 4 5 6 7 8 9; do echo "body.S_${i}.N_${j} #M_${i}${j},"; done; done */
/* multiple class section is borked in IE, so I don't think this is really doing what we want... */

body.S_1.N_1 #M_11,
body.S_1.N_2 #M_12,
body.S_1.N_3 #M_13,
body.S_1.N_4 #M_14,
body.S_1.N_5 #M_15,
body.S_1.N_6 #M_16,
body.S_1.N_7 #M_17,
body.S_1.N_8 #M_18,
body.S_1.N_9 #M_19,
body.S_2.N_1 #M_21,
body.S_2.N_2 #M_22,
body.S_2.N_3 #M_23,
body.S_2.N_4 #M_24,
body.S_2.N_5 #M_25,
body.S_2.N_6 #M_26,
body.S_2.N_7 #M_27,
body.S_2.N_8 #M_28,
body.S_2.N_9 #M_29,
body.S_3.N_1 #M_31,
body.S_3.N_2 #M_32,
body.S_3.N_3 #M_33,
body.S_3.N_4 #M_34,
body.S_3.N_5 #M_35,
body.S_3.N_6 #M_36,
body.S_3.N_7 #M_37,
body.S_3.N_8 #M_38,
body.S_3.N_9 #M_39,
body.S_4.N_1 #M_41,
body.S_4.N_2 #M_42,
body.S_4.N_3 #M_43,
body.S_4.N_4 #M_44,
body.S_4.N_5 #M_45,
body.S_4.N_6 #M_46,
body.S_4.N_7 #M_47,
body.S_4.N_8 #M_48,
body.S_4.N_9 #M_49,
body.S_5.N_1 #M_51,
body.S_5.N_2 #M_52,
body.S_5.N_3 #M_53,
body.S_5.N_4 #M_54,
body.S_5.N_5 #M_55,
body.S_5.N_6 #M_56,
body.S_5.N_7 #M_57,
body.S_5.N_8 #M_58,
body.S_5.N_9 #M_59 {
	display: block;
}

/* position the dropdown menus */
/* coordinates are relative to nav2 */
/* coordinates depend on the node graphics */

#M_11 {	z-index: 110; left:  81px; top:  76px; }
#M_12 {	z-index: 120; left: 128px; top:  48px; }
#M_13 {	z-index: 130; left: 420px; top: 137px; }
#M_14 {	z-index: 140; left: 582px; top:  87px; }
#M_15 {	z-index: 150; left: 684px; top:  50px; }

#M_21 {	z-index: 210; left:  76px; top:  57px; }
#M_22 {	z-index: 220; left:  10px; top:  97px; }
#M_23 {	z-index: 230; left: 567px; top:  97px; }
#M_24 {	z-index: 240; left: 604px; top:  57px; }

#M_41 {	z-index: 410; left:  75px; top: 103px; }
#M_42 {	z-index: 420; left: 249px; top:  87px; }
#M_43 {	z-index: 430; left: 373px; top: 134px; }
#M_44 {	z-index: 440; left: 673px; top: 100px; }

#M_51 {	z-index: 510; left:  72px; top:  86px; }
#M_52 {	z-index: 520; left: 276px; top: 150px; }
#M_53 {	z-index: 530; left: 518px; top: 117px; }

/* dropdown overrides */
/* depend on the node graphics */

#nav2 #M_12.dropdownmenu,
#nav2 #M_22.dropdownmenu,
#nav2 #M_24.dropdownmenu {
	padding-left: 0;
	padding-right: 5px;
	border-left: 0;
/*	border-right: 2px solid #126798; */
	text-align: right;
}

#nav2 #M_24.dropdownmenu {
	margin-top: 50px;
}

#nav2 #M_21.dropdownmenu {
	margin-top: 50px;
}

/* tier-2 here states */

#P_1 #I_10 a,
#P_2 #I_20 a,
#P_4 #I_40 a,
#P_5 #I_50 a {
	color: #00334c;
}

/* for i in 1 2 4 5; do for j in 1 2 3 4 5; do echo -n "#P_${i}${j} #I_${i}${j} a, "; done; echo ""; done */

#P_11 #I_11 a, #P_12 #I_12 a, #P_13 #I_13 a, #P_14 #I_14 a, #P_15 #I_15 a,
#P_21 #I_21 a, #P_22 #I_22 a, #P_23 #I_23 a, #P_24 #I_24 a, #P_25 #I_25 a,
#P_41 #I_41 a, #P_42 #I_42 a, #P_43 #I_43 a, #P_44 #I_44 a, #P_45 #I_45 a,
#P_51 #I_51 a, #P_52 #I_52 a, #P_53 #I_53 a, #P_54 #I_54 a, #P_55 #I_55 a {
	color: #00334c;
}

/* tier-3 here states */

/* for i in 1 2 4 5; do for j in 1 2 3 4 5; do for k in 1 2 3 4 5 6 7 8 9; do echo -n "#P_${i}${j}${k} #I_${i}${j} a, "; done; echo ""; done; done */

#P_111 #I_11 a, #P_112 #I_11 a, #P_113 #I_11 a, #P_114 #I_11 a, #P_115 #I_11 a, #P_116 #I_11 a, #P_117 #I_11 a, #P_118 #I_11 a, #P_119 #I_11 a,
#P_121 #I_12 a, #P_122 #I_12 a, #P_123 #I_12 a, #P_124 #I_12 a, #P_125 #I_12 a, #P_126 #I_12 a, #P_127 #I_12 a, #P_128 #I_12 a, #P_129 #I_12 a,
#P_131 #I_13 a, #P_132 #I_13 a, #P_133 #I_13 a, #P_134 #I_13 a, #P_135 #I_13 a, #P_136 #I_13 a, #P_137 #I_13 a, #P_138 #I_13 a, #P_139 #I_13 a,
#P_141 #I_14 a, #P_142 #I_14 a, #P_143 #I_14 a, #P_144 #I_14 a, #P_145 #I_14 a, #P_146 #I_14 a, #P_147 #I_14 a, #P_148 #I_14 a, #P_149 #I_14 a,
#P_151 #I_15 a, #P_152 #I_15 a, #P_153 #I_15 a, #P_154 #I_15 a, #P_155 #I_15 a, #P_156 #I_15 a, #P_157 #I_15 a, #P_158 #I_15 a, #P_159 #I_15 a,
#P_211 #I_21 a, #P_212 #I_21 a, #P_213 #I_21 a, #P_214 #I_21 a, #P_215 #I_21 a, #P_216 #I_21 a, #P_217 #I_21 a, #P_218 #I_21 a, #P_219 #I_21 a,
#P_221 #I_22 a, #P_222 #I_22 a, #P_223 #I_22 a, #P_224 #I_22 a, #P_225 #I_22 a, #P_226 #I_22 a, #P_227 #I_22 a, #P_228 #I_22 a, #P_229 #I_22 a,
#P_231 #I_23 a, #P_232 #I_23 a, #P_233 #I_23 a, #P_234 #I_23 a, #P_235 #I_23 a, #P_236 #I_23 a, #P_237 #I_23 a, #P_238 #I_23 a, #P_239 #I_23 a,
#P_241 #I_24 a, #P_242 #I_24 a, #P_243 #I_24 a, #P_244 #I_24 a, #P_245 #I_24 a, #P_246 #I_24 a, #P_247 #I_24 a, #P_248 #I_24 a, #P_249 #I_24 a,
#P_251 #I_25 a, #P_252 #I_25 a, #P_253 #I_25 a, #P_254 #I_25 a, #P_255 #I_25 a, #P_256 #I_25 a, #P_257 #I_25 a, #P_258 #I_25 a, #P_259 #I_25 a,
#P_411 #I_41 a, #P_412 #I_41 a, #P_413 #I_41 a, #P_414 #I_41 a, #P_415 #I_41 a, #P_416 #I_41 a, #P_417 #I_41 a, #P_418 #I_41 a, #P_419 #I_41 a,
#P_421 #I_42 a, #P_422 #I_42 a, #P_423 #I_42 a, #P_424 #I_42 a, #P_425 #I_42 a, #P_426 #I_42 a, #P_427 #I_42 a, #P_428 #I_42 a, #P_429 #I_42 a,
#P_431 #I_43 a, #P_432 #I_43 a, #P_433 #I_43 a, #P_434 #I_43 a, #P_435 #I_43 a, #P_436 #I_43 a, #P_437 #I_43 a, #P_438 #I_43 a, #P_439 #I_43 a,
#P_441 #I_44 a, #P_442 #I_44 a, #P_443 #I_44 a, #P_444 #I_44 a, #P_445 #I_44 a, #P_446 #I_44 a, #P_447 #I_44 a, #P_448 #I_44 a, #P_449 #I_44 a,
#P_451 #I_45 a, #P_452 #I_45 a, #P_453 #I_45 a, #P_454 #I_45 a, #P_455 #I_45 a, #P_456 #I_45 a, #P_457 #I_45 a, #P_458 #I_45 a, #P_459 #I_45 a,
#P_511 #I_51 a, #P_512 #I_51 a, #P_513 #I_51 a, #P_514 #I_51 a, #P_515 #I_51 a, #P_516 #I_51 a, #P_517 #I_51 a, #P_518 #I_51 a, #P_519 #I_51 a,
#P_521 #I_52 a, #P_522 #I_52 a, #P_523 #I_52 a, #P_524 #I_52 a, #P_525 #I_52 a, #P_526 #I_52 a, #P_527 #I_52 a, #P_528 #I_52 a, #P_529 #I_52 a,
#P_531 #I_53 a, #P_532 #I_53 a, #P_533 #I_53 a, #P_534 #I_53 a, #P_535 #I_53 a, #P_536 #I_53 a, #P_537 #I_53 a, #P_538 #I_53 a, #P_539 #I_53 a,
#P_541 #I_54 a, #P_542 #I_54 a, #P_543 #I_54 a, #P_544 #I_54 a, #P_545 #I_54 a, #P_546 #I_54 a, #P_547 #I_54 a, #P_548 #I_54 a, #P_549 #I_54 a,
#P_551 #I_55 a, #P_552 #I_55 a, #P_553 #I_55 a, #P_554 #I_55 a, #P_555 #I_55 a, #P_556 #I_55 a, #P_557 #I_55 a, #P_558 #I_55 a, #P_559 #I_55 a {
	color: #00334c;
}

/* for i in 1 2 4 5; do for j in 1 2 3 4 5; do for k in 1 2 3 4 5 6 7 8 9; do echo -n "#P_${i}${j}${k} #I_${i}${j}${k} a, "; done; echo ""; done; done */

#P_111 #I_111 a, #P_112 #I_112 a, #P_113 #I_113 a, #P_114 #I_114 a, #P_115 #I_115 a, #P_116 #I_116 a, #P_117 #I_117 a, #P_118 #I_118 a, #P_119 #I_119 a,
#P_121 #I_121 a, #P_122 #I_122 a, #P_123 #I_123 a, #P_124 #I_124 a, #P_125 #I_125 a, #P_126 #I_126 a, #P_127 #I_127 a, #P_128 #I_128 a, #P_129 #I_129 a,
#P_131 #I_131 a, #P_132 #I_132 a, #P_133 #I_133 a, #P_134 #I_134 a, #P_135 #I_135 a, #P_136 #I_136 a, #P_137 #I_137 a, #P_138 #I_138 a, #P_139 #I_139 a,
#P_141 #I_141 a, #P_142 #I_142 a, #P_143 #I_143 a, #P_144 #I_144 a, #P_145 #I_145 a, #P_146 #I_146 a, #P_147 #I_147 a, #P_148 #I_148 a, #P_149 #I_149 a,
#P_151 #I_151 a, #P_152 #I_152 a, #P_153 #I_153 a, #P_154 #I_154 a, #P_155 #I_155 a, #P_156 #I_156 a, #P_157 #I_157 a, #P_158 #I_158 a, #P_159 #I_159 a,
#P_211 #I_211 a, #P_212 #I_212 a, #P_213 #I_213 a, #P_214 #I_214 a, #P_215 #I_215 a, #P_216 #I_216 a, #P_217 #I_217 a, #P_218 #I_218 a, #P_219 #I_219 a,
#P_221 #I_221 a, #P_222 #I_222 a, #P_223 #I_223 a, #P_224 #I_224 a, #P_225 #I_225 a, #P_226 #I_226 a, #P_227 #I_227 a, #P_228 #I_228 a, #P_229 #I_229 a,
#P_231 #I_231 a, #P_232 #I_232 a, #P_233 #I_233 a, #P_234 #I_234 a, #P_235 #I_235 a, #P_236 #I_236 a, #P_237 #I_237 a, #P_238 #I_238 a, #P_239 #I_239 a,
#P_241 #I_241 a, #P_242 #I_242 a, #P_243 #I_243 a, #P_244 #I_244 a, #P_245 #I_245 a, #P_246 #I_246 a, #P_247 #I_247 a, #P_248 #I_248 a, #P_249 #I_249 a,
#P_251 #I_251 a, #P_252 #I_252 a, #P_253 #I_253 a, #P_254 #I_254 a, #P_255 #I_255 a, #P_256 #I_256 a, #P_257 #I_257 a, #P_258 #I_258 a, #P_259 #I_259 a,
#P_411 #I_411 a, #P_412 #I_412 a, #P_413 #I_413 a, #P_414 #I_414 a, #P_415 #I_415 a, #P_416 #I_416 a, #P_417 #I_417 a, #P_418 #I_418 a, #P_419 #I_419 a,
#P_421 #I_421 a, #P_422 #I_422 a, #P_423 #I_423 a, #P_424 #I_424 a, #P_425 #I_425 a, #P_426 #I_426 a, #P_427 #I_427 a, #P_428 #I_428 a, #P_429 #I_429 a,
#P_431 #I_431 a, #P_432 #I_432 a, #P_433 #I_433 a, #P_434 #I_434 a, #P_435 #I_435 a, #P_436 #I_436 a, #P_437 #I_437 a, #P_438 #I_438 a, #P_439 #I_439 a,
#P_441 #I_441 a, #P_442 #I_442 a, #P_443 #I_443 a, #P_444 #I_444 a, #P_445 #I_445 a, #P_446 #I_446 a, #P_447 #I_447 a, #P_448 #I_448 a, #P_449 #I_449 a,
#P_451 #I_451 a, #P_452 #I_452 a, #P_453 #I_453 a, #P_454 #I_454 a, #P_455 #I_455 a, #P_456 #I_456 a, #P_457 #I_457 a, #P_458 #I_458 a, #P_459 #I_459 a,
#P_511 #I_511 a, #P_512 #I_512 a, #P_513 #I_513 a, #P_514 #I_514 a, #P_515 #I_515 a, #P_516 #I_516 a, #P_517 #I_517 a, #P_518 #I_518 a, #P_519 #I_519 a,
#P_521 #I_521 a, #P_522 #I_522 a, #P_523 #I_523 a, #P_524 #I_524 a, #P_525 #I_525 a, #P_526 #I_526 a, #P_527 #I_527 a, #P_528 #I_528 a, #P_529 #I_529 a,
#P_531 #I_531 a, #P_532 #I_532 a, #P_533 #I_533 a, #P_534 #I_534 a, #P_535 #I_535 a, #P_536 #I_536 a, #P_537 #I_537 a, #P_538 #I_538 a, #P_539 #I_539 a,
#P_541 #I_541 a, #P_542 #I_542 a, #P_543 #I_543 a, #P_544 #I_544 a, #P_545 #I_545 a, #P_546 #I_546 a, #P_547 #I_547 a, #P_548 #I_548 a, #P_549 #I_549 a,
#P_551 #I_551 a, #P_552 #I_552 a, #P_553 #I_553 a, #P_554 #I_554 a, #P_555 #I_555 a, #P_556 #I_556 a, #P_557 #I_557 a, #P_558 #I_558 a, #P_559 #I_559 a {
	color: #00334c;
}