/* global.css (originally vert.side.css)
 * 
 * The styles to create an overall image for Magical Times 
*/

body { background-color: #CC99FF; color: #000000; 
 text-align: justify; padding: 0 1em; 
 font-family: "Black Chancery", "Verdana", sans-serif; }

#header { clear: both; border-bottom: 3px solid #0000FF; 
  background: #CC99FF url(images/logo.gif) no-repeat center left;
  padding: 0 0 0 55px; height: 75; }
#header img { float: right; }
#header h1 { color: #0000FF; font-size: 400%; text-align: center; 
 font-family: "Vivaldi", "Comic Sans MS", serif; }

#title { text-align: center; clear: both; }

#nav { float: left; width: 30%; } 
#nav a { text-decoration: none; color: #0000FF; }
#nav a:visited { color: #CC9900; }
#nav a:hover { background-color: #FFFFFF; }
#nav ul { margin-left: 1em; padding-left: 1em; }
#nav ul li { font-size: x-large; 
 font-family: "Vivaldi", "Black Chancery", "Comic Sans MS", serif;  }
#nav ul ul { margin-left: 0; padding-left: .5em; }
#nav li li { margin-left: 0; padding-left: 0; vertical-align: middle; 
 font-size: large; 
 font-family: "Black Chancery", "Comic Sans MS", serif; }

/*default nav images - will change for subsections */
#nav li { list-style-image: url(images/brown_box_closed.gif); }
#nav li.here { list-style-image: url(images/brown_box_open.gif); }
#nav li li { list-style-image: url(images/pearl.gif);}
#nav li li.here { list-style-image: url(images/pearl.gif);}

#content { width: 69%; float: right; } 
#content h1 { font-size: 400%; margin-bottom: 0; }
#content h2 { font-size: xx-large; }
#content h4 { clear: both; }
h1 + h2 { margin-top: 0; padding-top: 0; }
#content div + p:first-letter { 
 font-size: 400%; float: left; margin-right: .3em;
 font-family: "Vivaldi", "Impact", "Charcoal", sans-serif; }

dt { font-size: x-large; }
dt:first-letter { font-size: 300%; }
dd { font-size: large; }

#content .parentinfo { 
 font-family: "Black Chancery", "Verdana", sans-serif; }
#content .parentinfo p:first-letter { 
 font-size: 2em; float: left; margin-right: .3em; 
 font-family: "Vivaldi", "Impact", "Arial Black", serif; }

/* *********************************************** */
/* These are standard sIFR styles... do not modify */
/*                                   ^^^^^^^^^^^^^ */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}


/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash #header h1 {
	visibility: hidden;
 	width: 80%;
	text-align: center;
	font-size: 50px;
}

.sIFR-hasFlash #content h1 {
	visibility: hidden;
	text-align: center;
}

.sIFR-hasFlash #content h2 {
	visibility: hidden;
	text-align: center;
}

.sIFR-hasFlash #content h3 {
	visibility: hidden;
	text-align: center;
	font-size: 30px;
}

.sIFR-hasFlash #content h4 {
	visibility: hidden;
	text-align: center;
	font-size: 25px; 
}
