@charset "UTF-8";
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* See "Website SetUp.txt"                                                       */
/*     "Sample Color Schemes.txt"                                                */
/*     "Menu Setup.txt"                                                          */
/*     "https://www.w3schools.com/colors/colors_names.asp"                       */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
:root {
	--myMenuContainer:firebrick;
	--myMenuFontColor:white;
	--myMenuBorder:snow;
	--myMenu1Skin:firebrick;
	--myMenu2Skin:crimson;
	--myMenu3Skin:indianred;
	--myMenuHover:yellow;
}
.menuContainer {
	background-image:url('../graphics/bkgrnd-red-menu.png');	/* blue */
	background-repeat:repeat;								;	/* blue */
	clear:both;
	color:white;
	color:var(--myMenuFontColor);
	font-family:Arial, Helvetica, sans-serif;
	margin:auto;
	padding:0px;
	text-decoration:none;
}
.menuContainer a {			/* all anchors within the menuContainer */
	font-family: "PT Serif", serif, sans-serif;
	font-style: normal;
	font-weight: 700;
	text-shadow:1px 1px 1px black;
	font-size:14px;							/* size of MENU font */
	white-space:nowrap;
}
.menuContainer a:hover {					/* all MENU hovers*/
	background-color:red;
	background-color:var(--myMenu1Skin);
	color:yellow;
	color:var(--myMenu1Skin);
}
.toggleMenu {								                  /* reduced MENU   */
	background-image:url('../graphics/bkgrnd-red-menu.png');  /* 1st menu Level */
	background-repeat:repeat;
	border:thin white solid;
	border:thin var(--myMenuBorder) solid;
	color:white;
	color:var(--myMenuFontColor);
	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-image:url('../graphics/bkgrnd-red-menu.png');
	background-repeat:repeat;
	margin:0px auto;
	padding:4px;
	position:relative;
	text-align:center;
}
.nav > li {
	float:left;
	margin:0px auto;
	padding:0px;
	text-align:center;
}
.menuContainer a,
.menuContainer a:link,
.menuContainer a:visited,
.nav a,
.nav a:link,
.nav a:visited {
	color:white;
	margin:0px;
	padding:4px 14px 4px 7px;
	text-decoration:none;
}
#bannerContainer a:hover {
	color:yellow;
}
.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 snow solid;
	border:thin var(--myMenuBorder) solid; 
	background-image:url('../graphics/bkgrnd-red-menu.png');
	background-repeat:repeat;
	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:crimson;
	background-color:var(--myMenu2Skin);
	border:thin white solid;
	border:thin var(--myMenuBorder) solid;
	display:block;
	position:relative;
	z-index:100;
}
.nav li li li a {							/* 3rd menu level */
	background-color:indianred;
	background-color:var(--myMenu3Skin);
	border:thin white solid;
	border:thin var(--myMenuBorder) solid;
	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;
}
/* Narrow Device Styles - - - - - - - - - - - - -*/
/* @media screen is also in tx-tmpl-bodyStyle.css*/
@media screen and (max-width:575px) { 		/* tx-tmpl-menuScript.js  */
.menuContainer, 							/* Allows for larger area */
.menuContainer a {font-size:14px}
#menuDiv {width:100%}						/* Change menu width      */
.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}
}