/* Nightlyre's Realm CSS (Navigation) */

/* So IE understands what to do with the hovers */
* html a:hover		{visibility:visible}

img					{border: 0}

.navplaceholder		{display: block;
					position: absolute;
					width: 81px;
					height: 101px;
					left: 0;
					background: url(/images/mapcorner_open.gif) no-repeat;
					cursor: move;
					z-index: 101;}

/* Holds .nav on sub-pages (Artwork, Halloween, etc.) */
.navappear			{display: none;
					position: absolute;
					left: 8px;
					top: 0;
					z-index: 100;}

/* Holds everything that appears on all pages */
.nav				{display: block;
					position: relative;
					top: -10px;
					left: -10px;
					margin: auto;
					width: 615px;
					height: 428px;
					font: 13px "Times New Roman", serif;
					color: #513826;}

.nav a:link, .nav a:visited
					{color: #513826;}

/* This is to include the text of the nav for browsers without CSS */
.invistext			{display: none;}

.navmain, .navtop, .navleft, .navright, .navbottom
					{display: block;
					position: absolute;}

.navmain			{background: url(/images/map_main.jpg) no-repeat;
					width: 567px;
					height: 392px;
					top: 24px;
					left: 15px;}

.navtop				{background: url(/images/map_main_top.gif) no-repeat;
					width: 615px;
					height: 24px;
					top: 0;
					left: 0;
					z-index: 10;}

.navleft			{background: url(/images/map_main_left.gif) no-repeat;
					width: 15px;
					height: 392px;
					top: 24px;
					left: 0;
					z-index: 9;}

.navright			{background: url(/images/map_main_right.gif) no-repeat;
					width: 33px;
					height: 392px;
					top: 24px;
					left: 582px;
					z-index: 9;}

.navbottom			{background: url(/images/map_main_bottom.gif) no-repeat;
					width: 566px;
					height: 12px;
					top: 416px;
					left: 15px;
					z-index: 9;}



.nav a span			{display: none;}

/* These are to define the location of the spacer.gifs used for the actual links */
a.navartwork		{width: 76px;
					height: 67px;
					top: 285px;
					left: 220px;}

a.navcostumes		{width: 100px;
					height: 40px;
					top: 116px;
					left: 210px;}

a.navhalloween		{width: 100px;
					height: 40px;
					top: 77px;
					left: 454px;}

a.navabout			{width: 70px;
					height: 40px;
					top: 268px;
					left: 474px;}

a.navhome			{width: 205px;
					height: 70px;
					top: 25px;
					left: 30px;}


.nav a:hover span	{display: block;
					position: absolute;
					background: url(/images/map_main.jpg) no-repeat bottom left;
					width: 165px;
					height: 310px;}

a.navartwork, a.navcostumes, a.navhalloween, a.navabout, a.navhome
					{display: block;
					position: absolute;
					text-decoration: none;
					cursor: pointer;}

/* These are to define the location of the box that appears on hover, relative to the actual links */
a.navartwork:hover span
					{left: -205px;
					top: -179px;}

a.navcostumes:hover span
					{left: -195px;
					top: -10px;}

a.navhalloween:hover span
					{left: -439px;
					top: 29px;}

a.navabout:hover span
					{left: -459px;
					top: -162px;}

a.navhome:hover span
					{left: -15px;
					top: 81px;}

/* These are the images that appear on mouseovers on the left hand side of the map */
.navimgwelcome, .navimgcompass1, .navimghome, .navimgcompass2, .navimgabout, .navimgspider, .navimgcostumes, .navimgcoyote, .navimghalloween, .navimgwerewolf, .navimgartwork, .navimgdragon
					{display: block;
					position: absolute;}

.navimgwelcome		{width: 146px;
					height: 150px;
					top: 106px;
					left: 29px;}

.navimgcompass1		{width: 120px;
					height: 134px;
					top: 264px;
					left: 42px;}

.navimghome			{width: 140px;
					height: 68px;
					top: 0;
					left: 14px;}

.navimgcompass2		{width: 120px;
					height: 134px;
					top: 158px;
					left: 27px;}

.navimgabout		{width: 131px;
					height: 140px;
					top: 0;
					left: 14px;}

.navimgspider		{width: 90px;
					height: 95px;
					top: 186px;
					left: 40px;}

.navimgcostumes		{width: 147px;
					height: 140px;
					top: 0;
					left: 14px;}

.navimgcoyote		{width: 146px;
					height: 93px;
					top: 212px;
					left: 16px;}

.navimghalloween	{width: 146px;
					height: 176px;
					top: 0;
					left: 14px;}

.navimgwerewolf		{width: 111px;
					height: 163px;
					top: 145px;
					left: 3px;}

.navimgartwork		{width: 133px;
					height: 162px;
					top: 0;
					left: 13px;}

.navimgdragon		{width: 136px;
					height: 208px;
					top: 99px;
					left: 29px;}


/* These are spacers for text to go around images */
.navltspacer		{font-size: 14px;
					float: left;
					clear: left;
					position: relative;}

.navrtspacer		{font-size: 14px;
					float: right;
					clear: right;
					position: relative;}

.navcontact			{position: absolute;
					right: 50px;
					bottom: 13px;
					text-align: right;
					font-size: 11px;
					background-color: transparent;
					color: #000000;}

.navcontact a:hover	{color: #eeeebb;}



/* These are the breadcrumb trails and titles for each page.  The opacity and colors are filled in on the section-specific css files */

.pagetitlebar		{display: block;
					position: absolute;
					font-size: 14px;
					top: 0;
					left: 0;
					width: 100%;
					z-index: 8;}
.pagetitlebar1		{position: relative;
					height: 1em;}
.pagetitlebar2		{position: relative;
					height: 2.3em;}

.pagetitle			{display: block;
					position: absolute;
					font-size: 9px;
					top: 0;
					left: 0;
					width: 100%;
					z-index: 50;}
.pagetitle p		{position: relative;
					height: 1em;
					font-family: Verdana, Helvetica, sans-serif;
					padding-left: 80px;
					padding-top: .1em;}
.pagetitle h1		{position: relative;
					font-size: 30px;
					font-weight: normal;
					font-family: "Maiandra GD", Verdana, Helvetica, sans-serif;
					padding-left: 85px;
					padding-top: .04em;}
.pagetitle h2		{position: relative;
					font-size: 13px;
					font-weight: bold;
					font-family: Arial, Helvetica, sans-serif;
					padding-left: 95px;
					padding-top: .4em;}
.pagetitle h2 a:link, .pagetitle h2 a:visited
					{text-decoration: underline;}
.pagetitle a, .pagetitle a:link, .pagetitle a:visited
					{text-decoration: none;}
.pagetitle a:hover	{text-decoration: underline;}



/* Copyright and popup - the text color and background color are controlled on the section-specific css files */
.crfull				{position: relative;
					float: left;
					top: -10px;
					width: 100%;
					height: 10px;
					margin-bottom: -10px;
					z-index: 20;}

.copyright			{position: absolute;
					left: 0;
					bottom: 0;
					font-family: Arial, Helvetica, sans-serif;
					font-size: 11px;
					padding: 5px;}

.copyright a:link, .copyright a:visited
					{text-decoration: underline;}

.copyright a:hover	{text-decoration: none;}

a.crpopup span		{display: none;}

a.crpopup:hover span
					{display: block;
					position: absolute;
					bottom: 0;
					left: 0;
					width: 25em;
					padding: 5px;}


/* Text alignments and such */
p.center			{text-align: center;
					text-indent: 0;}
p.rt				{text-align: right;
					text-indent: 0;}


/* The 'atmospheric' text that appears on each index page */
h1.atmosphere		{font: italic 18px "Maiandra GD", Verdana, Helvetica, sans-serif;
					text-align: justify;
					margin: 0 0 40px 0;}