/*	——————————————————	GENERAL PAGE CSS DEFAULTS	*/

body	{ margin: 0; font-family: arial; font-size: 12pt; background-color: #888; }
li	{ padding-bottom: 9px; }
.NoBr	{ white-space: nowrap; }
.LogIn	{ position: absolute; bottom: 2px; right: 2px; width: 160px; padding: 1px 3px; background-color: #968; border: 1px solid #dac; 
	border-radius: 8px; font-family: arial; font-size: 9pt; color: #fff; white-space: nowrap; }


/*	--------	HEADER CSS DEFAULTS	*/

.PgHeading1	{ position: relative; width: 100%; background-color: #000; }
.PgHeading2	{ position: relative; margin: 0 auto; width: 90%; max-width: 950px; height: 170px; text-align: center; 
		background-image: url(cosmic-header.jpg); background-position: left top; background-repeat: no-repeat; }
.PgHeading3	{ position: absolute; width: 100%; min-width: 476px; top: 50%; left: 50%; transform: translate(-50%, -50%); 
		color: #fff; font-family: impact; font-size: 40pt; font-style: italic; text-shadow: 0 0 5px #000; line-height: 0.3em; }
.HeadingTxt1	{ padding-right: 370px; }
.HeadingTxt2	{ padding-right: 86px; }
.HeadingTxt3	{ padding-left: 275px; }


/*	--------	NAVIGATION CSS DEFAULTS	*/

summary	{ list-style-type: none; }

.MenuHeading1	{ margin: 0 auto; width: 90%; max-width: 950px; background-color: #857; padding: 4px 0 0; }
.MenuHeading2a		{ position: relative; width: 100%; text-align: center; display: block; }
	.MenuLink	{ position: relative; width: 120px; height: 45px; margin: 1px; border: 1px dotted #000; border-radius: 10px; 
			display: inline-block; color: #fff; font-family: arial; font-size: 12pt; }
	.MenuLink:hover	{ border-color: #fff; background-color: #a79; }
	.MenuLink2	{ text-decoration: none; }
	.MenuLinkAln	{ position: absolute; width: 94%; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.ShowHideDropMenu	{ display: none; cursor: pointer; }
.MenuHeading2b		{ position: relative; left: 100%; transform: translate(-40px, 0); width: 34px; }
	.MenuBurgerGrp	{ padding: 2px; cursor: pointer; }
	.MenuBurger	{ width: 100%; height: 3px; margin: 4px 0; background-color: #fff; }
	.MenuOpened	{ position: absolute; top: 138px; width: 95%; z-index: 2; background-color: #857; padding-bottom: 3px; 
			border-radius: 0 0 13px 13px; }
.ShowBr	{ display: none; }


/*	--------	PAGE BODY CSS DEFAULTS	*/

.Content1	{ position: relative; margin: 0 auto; width: 90%; max-width: 950px; background-color: #fff9d0; padding-bottom: 10px; }
.Content2	{ margin: 0 10px; padding: 15px 10% 70px; border: 3px dotted #db9; border-top: 0; border-radius: 0 0 25px 25px; }
.RedTxt		{ color: #d00; }
.GrnTxt		{ color: #085; }
.Ital		{ font-style: italic; color: #376; }


/*	--------	PAGE FOOTER CSS DEFAULTS	*/

.Footer		{ margin: 0 auto 100px; width: 90%; max-width: 950px; background-color: #333; text-align: center; padding: 8px 0; 
		color: #bbb; font-family: verdana; font-size: 8pt; }
.Footer a	{ color: #eee; background-color: #777; padding: 2px 6px; border-radius: 7px; box-shadow: 0 0 8px #999; margin: 4px 3px;
		text-decoration: none; display: inline-block; }
.Footer a:hover	{ color: #fc0; box-shadow: 0 0 15px #999; }






/*	——————————————————	SET SMALLER DEVICE STYLES	*/

@media only screen and (min-width: 37.6em) and (max-width: 55.0em) {
	.ShowBr	{ display: inline; }
}





/*	——————————————————	MOBILE DEVICE STYLES	*/

@media only screen and (max-width: 37.5em) {
	.PgHeading2	{ width: 95%; height: 100px; }
	.PgHeading3	{ min-width: 300px; font-size: 25pt; }
	.HeadingTxt1	{ padding-right: 240px; }
	.HeadingTxt2	{ padding-right: 60px; }
	.HeadingTxt3	{ padding-left: 170px; }

	.MenuHeading1	{ width: 95%; padding: 2px 0; }
		.MenuLink	{ width: auto; height: 35px; margin: 2px 4px; padding: 4px 10px; display: block; }
		.MenuLinkAln	{ width: 100%; text-align: center; }
	.MenuHeading2a		{ display: none; }
	.ShowHideDropMenu	{ display: block; }

	.Content1	{ width: 95%; }
	.Content2	{ padding: 15px 5% 45px; }

	.Footer		{ width: 95%; }
}