@charset "UTF-8";
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* See "Chapter Website SetUp.txt"                                               */
/*     "Sample Color Schemes.txt"                                                */
/*     "Menu Setup.txt"                                                          */
/*     "http://www.w3schools.com/html/html_colorvalues.asp"                      */
/*      chsample2 - darkslateblue; max 3 menu levels, each level may vary color  */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
:root {
	--myMenuFontColor:white;
	--myMenuBrdr:thin snow solid;
	--myMenu1Skin:darkslateblue;
	/*background-color:firebrick;    scheme1 */
	/*background-color:darkred;      scheme2 */
	/*background-color:darkslateblue;scheme3 */
	/*background-color:forestgreen;	 scheme4 */
	/*background-color:#CC7700;      scheme5 */
	--myMenu2Skin:mediumblue;
	/*background-color:indianred;    scheme1 */
	/*background-color:indianred;    scheme2 */
	/*background-color:mediumblue;   scheme3 */
	/*background-color:teal;         scheme4 */
	/*background-color:tangerine;    scheme5 */
	--myMenu3Skin:blue;
	/*background-color:crimson;      scheme1 */
	/*background-color:crimson;      scheme2 */
	/*background-color:blue;         scheme3 */
	/*background-color:green;        scheme4 */
	/*background-color:orange;       scheme5 */
}
.menuContainer {
	color:white;
	color:var(--myMenuFontColor);
	font-family:Arial, Helvetica, sans-serif;
	font-size:0px;
	margin:auto;
	padding:2px 0px;
	text-decoration:none;
}
.menuContainer a {							/* all anchors within the menuContainer */
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;    						/* size of MENU font */
	white-space:nowrap;
}
.menuContainer a:hover {						/* all MENU hovers*/
	background-color:cornflowerblue;
	color:yellow;
}
.toggleMenu {								/* reduced MENU */
	background-color:darkslateblue;					/* 1st menu Level */
	background-color:var(--myMenu1Skin);
	border:thin white solid;
	border:var(--myMenuBrdr);
	color:white;
	display:none;
	margin:auto;
	padding:4px 12px;
	text-decoration:none;
}
.toggleMenu img {
	border:0px;
	padding-left:6px;
	vertical-align:top;
}
#menuDiv {								/* centers MENU */
	display:table;
	margin:0px auto;
	padding:0px;
}
.nav {
	list-style-type:none;
	margin:0px auto;
	padding:0px;
}
.nav ul {
	list-style-type:none;
	margin:0px;
	padding:0px;
}
.nav li {								/* 1st menu level */
	background-color:darkslateblue;
	background-color:var(--myMenu1Skin);
	margin:0px auto;
	padding:4px;
	position:relative;
	text-align:center;
}
.nav > li {
	float:left;
	margin:0px auto;
	padding:0px;
	text-align:center;
}
.nav a {
	color:white;
	margin:0px;
	padding:4px 14px 4px 7px;
	text-decoration:none;
}
.nav > li > .parent {
	background-image:url('../graphics/arrowDown.png');
	background-position:97% 10px;
	background-repeat:no-repeat;
}
.nav > li li > .parent {
	background-image:url('../graphics/arrowRight.png');
	background-position:97% 7px;
	background-repeat:no-repeat;
}
.nav > li > a {
	border:thin white solid;
	border:var(--myMenuBrdr);
	display:block;
}
.nav li ul,
.nav li li ul {
	left:-9999px;
	position:absolute;
}
.nav > li.hover > ul {
	left:0;
}
.nav li li.hover ul {
	left:100%;
	top:0;
}
.nav li li,
.nav li li li {
	margin:0px auto;
	padding:0px;
	text-align:center;						/*left;center;right*/
}
.nav li li a {								/* 2nd menu level */
	background-color:mediumblue;
	background-color:var(--myMenu2Skin);
	border-top:thin white solid;
	border-left:thin white solid;
	border-right:thin white solid;
	border-top:var(--myMenuBrdr);
	border-left:var(--myMenuBrdr);
	border-right:var(--myMenuBrdr);
	border-bottom:0px;
	display:block;
	position:relative;
	z-index:100;
}
.nav li li li a {							/* 3rd menu level */
	background-color:blue;
	background-color:var(--myMenu3Skin);
	border-top:thin white solid;
	border-left:thin white solid;
	border-right:thin white solid;
	border-top:var(--myMenuBrdr);
	border-left:var(--myMenuBrdr);
	border-right:var(--myMenuBrdr);
	border-bottom:0px;
	z-index:200;
}
.nav li li a.diffColor2,
.nav li li li a.diffColor2 {
	background-color:#6666ff;
}
.nav li li a.diffColor2:hover,
.nav li li li a.diffColor2:hover {
	background-color:cornflowerblue;
}
.nav li li:last-child a, 						/* 2nd menu level */
.nav li li li:last-child a {						/* 3rd menu level */
	border-bottom:thin white solid;
	border-bottom:var(--myMenuBrdr);
}
/* Narrow Device Styles - - - - - - - - - - - -- */
/* @media screen is also in tx-tmpl-bodyStyle.css*/
@media screen and (max-width:480px) { 
.menuContainer, 							/* Allows for larger area */
.menuContainer a {font-size:15px}
#menuDiv {width:98%}							/* Change menu width     */
.active,
.nav ul {display:block}
.nav > li {float:none}
.nav > li li > .parent {background-image:url('../graphics/arrowDown.png')}
.nav > li.hover > ul, 
.nav li li.hover ul {position:static}
}