/* INNER PAGE STYLE SHEET */
#rprightred {  /*  outline: 1px solid lightblue;  border: 1px solid lightblue; */
	z-index: 1;  
}
#rpmiddle {  /*  outline: 1px solid lightblue;  border: 1px solid lightblue; */
	z-index: 20;  
}
#rpmenu {  /*  outline: 1px solid lightblue;  border: 1px solid lightblue; */
	z-index: 20;  
}
html {
	padding: 0; margin: 0;
	background: url(../images/MusicBkg-bw3.gif) #545454 -80px 0px fixed; color: #D1D1D1; color: #E1E1E1; 
}

body {
	margin: 0; padding: 0;
	position: relative;
	top: -1em;
}

#rightstrip {  /* needed to cover the far right edge of the window, because different browsers disagree about the #content width. */ 
	position: fixed;
	float: right;
	margin: 0;
	width: 12%;
	height: 100%;
	right: 0;
	background: #A30001; color: #C1C1C1;
	border-left: 2px solid #000000;
	border-bottom: 2px solid #000000;
	min-height: 787px; 
}

/* MENU LINKS */

#container {
	position: relative;
	width: 88%;   /* SETS RIGHT MARGIN OF ENTIRE CONTENT SECTION  */  
	padding: 0 0 1em 0; margin: 0;
}

#container h1 {
	position: relative;
	height: 15%;
	margin-top: 0;
	margin-right: -14%; /* THIS IS NEEDED TO EXTEND THE TITLE TO THE WINDOW EDGE */
	margin-left: 180px;
	padding-top: 12px; padding-bottom: 12px;
	background: #A30001; color: #FFFFFF;
	font: bold 28px "Times New Roman", Times, serif;
	letter-spacing: 0.05em;
	border-left: 2px solid #000000;
}

#container h1 img {
	left: 20px;
	line-height: 3em;
}

#content {
	position: relative;
	margin: 0; 
	width: 92%;
	margin-right: 0;
	margin-left: 8%; /* SETS LEFT MARGIN OF ENTIRE CONTENT SECTION  */
	left: 0;
}

#navbar { /*  outline: 1px dashed lightgreen;  */
	position: fixed;
	top: 10px;
	left: 0;
	margin-left: 0;
	z-index: 50 !important;
}

#photo_gallery
{
	line-height: 1.4em;
	font-size: 11px;
	font-style: italic;
	font-weight: normal;
	}

#photo_gallery a { 
	text-decoration: none; 
	 }

#photo_gallery a:link, #photo_gallery a:visited {
text-decoration: none;}

#photo_gallery a:hover, #photo_gallery a:active { 
	text-decoration: none;
	 }
#speaker a:link, #speaker a:visited {
text-decoration: none;}

#speaker a:hover, #speaker a:active { 
	text-decoration: none;
	 }


ul#menu { 
	position: relative; 
	top: 20px; 
	left: 0;
	margin-left: 25px;
	list-style-type: none;
	z-index: 15;
} 

#mainpage {
	position: relative; 
	top: -18px;
	margin-left: 180px; /* DISTANCE FROM LEFT EDGE OF CONTAINER TO LEFT EDGE OF MAINPAGE */
	margin-top: 0;
	padding: 2em 3em;
	border: 2px solid #000000;
	border-left: 0;
	border-bottom: 0;
	line-height: 1.4em;
	background-image: url(../images/bkg-FFF-17alpha.png); color: #C1C1C1;
}

#mainpage h2 {
	font: italic 2em Georgia, serif;
	background: transparent; color: #FFFFFF;
}

#mainpage h3 {
	padding: 3px 8px 5px;
	font: italic bold 1.1em/1.1em Georgia, serif;
	font-variant: small-caps;	
	background: #555555; color:#FFFFFF; 
	border: 1px solid #444444;
}

#mainpage h4 {
	width: 10em;
	padding: 2px 8px 3px;
	margin: 2em 2em 2em 0;
	font: bold italic  0.9em Georgia, serif;
	font-variant: small-caps;
	text-align: left; 
	background-color:#868686; color:#FFFFFF; 
	border: 1px solid #656565;
}

#mainpage p {
	text-align: justify;
	text-indent: 2em !important;
	line-height: 1.4em;	
}

#mainpage p.centre { text-align: center; }

#mainpage p.event {
	text-align: left;
	text-indent: 0 !important;
	line-height: 1.2em;
}

.eventdate {
	bold 1.1em/1.1em Georgia, serif;
	color: #FFFFFF; background: inherit;
}

#mainpage dt {
	margin-top: 0.7em;
}

#mainpage dd {
	margin-bottom: 1em;
}

#mainpage dd ul li {
	line-height: 1.1em;
	margin-bottom: 0.6em;
}

#mainpage li {
	margin: 4px auto;
}

#mainpage a { 
	text-decoration: none; 
	padding: 2px 4px; 
	margin-right: -4px; 
	margin-left: -4px; }

#mainpage a:link, #mainpage a:visited { background: inherit;  color: #CCFFFF; }

#mainpage a:hover, #mainpage a:active { 
	background-color: #585858; background-color: #7E5556; 
	color: #FFFFCC; color: #A30001; color: #FFFFFF; }

/* BIO PAGE LINKS: */

#honours li {
	position: relative;
	left: -8px;
	margin: 5px 11px 1em 0;
	line-height: 1.2em;
	text-indent: -32px;
/*	outline: 1px solid pink; */
}

#honours span.col1 {
	position: relative;
	width: 15em;
	left: 0;	
}

#honours span.col2 {
	position: relative;
	left: 17px;
}

/* COMPOSITIONS PAGE: */

#mainpage p.instructions {
	font: 0.8em/1.3em Verdana, sans-serif;
	color: #FFFFFF; background: transparent;
	text-indent: 0 !important;
}

.worktitle {
	font-style: italic;
	font-weight: bold;
	color: #E1E1E1; background: inherit;
}

.innerworktitle {
	font-style: italic;
	font-weight: bold;	
	color: #E1E1E1; background: inherit;
}

.nametitle {
	font-style: normal;
	font-weight: bold;	
}

ul.nametitle li {
	position: relative;
}

ul.compositions { /*  outline: 1px solid pink;*/
	position:relative; 
	top:0; left:0; bottom:0;
	margin:0; padding:0;  
	text-align: left;
	font-size: 13px;
}

ul.compositions li { /* outline: 1px dashed lightgreen; */
	position:relative;
	top:0; left: 0; bottom:0;
	margin: 0; 
	margin-left: 30px !important; 
	padding:0;
	text-align: left;
	line-height: 1.3em;
}

#mainpage ul.compositions li.col1 { /* outline: 1px dotted yellow; */
	margin-left: 30px !important;
	text-indent: -30px;		
	line-height: 1.2em;	
}

#mainpage ul.compositions ul.col2 li { /* outline: 1px dotted yellow;*/
	margin-left: 90px !important;
	margin-top: 0 !important;
	text-indent: -30px;		
	line-height: 1.2em;	
}

#mainpage ul.compositions ul.col2 li { /* outline: 1px dashed orange; */
	margin-left: 0 !important;
	text-indent: 0;	
}

#mainpage ul.compositions ul.col3 li { /* outline: 1px dashed orange;  */
	margin-left: 30px !important;
	text-indent: 0;	
}

#mainpage ul.compositions ul span.col3 { /* outline: 1px solid lightgreen; */
	display: block;
	margin-top: 0.4em;
	text-indent: 0;	
}

ul.compositions ul {
	position:relative;  
	top:0; left:0; bottom:0;
	margin:0;
	margin-top: 1em;
	padding:0; 
}

ul.compositions li ul li { 
	position:relative; 
	top:0; left:0; bottom:0;
	margin:0; 
	margin-left: 30px !important;
	padding:0; 
	position: relative;	
	text-indent: -30px; 
}

ul.compositions p {
	position:relative; 
	top:0; left:0; bottom:0;
	margin:0;
	padding:0;  
	position: relative;	
}

ul.compositions .col1 {
	position: relative;
	margin-top: 1.5em !important; 
	line-height: 1em;
}

ul.compositions p { /* outline: 1px dotted magenta;  THIS PARAGRAPH TEXT IS NOT INDENTED */
	position:relative;  
	top:0; left:0; bottom:0;
	margin:0; 
	margin-left: -30px !important;
	padding:0;
	text-align: left !important;
	text-indent: 0 !important;
	line-height: 1.2em !important;
}

/* SOUND CLIPS PAGE: */

div.playingclip {
	position: relative;
	top: 10px;
	left: 8px;
	margin-left: 65px !important; /* ?? */
	padding: 5px 0 17px;
	width: 150px;
	height: 80px;
	background: #444444; color: #CCCCCC;
	font: 11px/1.2em Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	border: 1px solid #333333;
	z-index: 5 !important;
}

div.playingclip p { margin: 0 5px 7px 5px; text-align: left; }

div.playingclip object { position: absolute; top: 62px; left: 0; } /* FOR USE WITH AUDIO OBJECT FOR IE */
div.playingclip object object{ position: absolute; top: 0; left: 0; } /* FOR USE WITH NESTED AUDIO OBJECTS */
div.playingclip object#controller2, div.playingclip object#controller2a { top: 60px !important; } /* Needed for Safari, Gecko/Mozilla and Opera *
/*div.playingclip object embed{ position: absolute; top: 0; left: 0; } *//* FOR USE WITH EMBEDDED AUDIO NESTED IN OBJECT FOR STANDARDS BROWSERS */
/* div.playingclip embed { position: absolute; top: 62px; left: 0; } *//* FOR USE WITH EMBEDDED AUDIO ONLY */

div.playingclip a.back:link, div.playingclip a.back:visited { 
	position: absolute;
	display: block;
	width: 4em !important;
	height: 1em !important;
	right: 0;
	bottom: 0 !important;
	margin: 3px 5px 5px auto !important;
	padding: 2px 2px 3px 2px !important; 
	background-color: #646464; color: #000000;
	font-size: 0.8em !important;
	line-height: 1em;
	text-align: center;
	text-decoration: none;
}

div.playingclip a.back:hover { 
	background-color: #646464; color: #FFFFFF;
	border: 1px solid #333333;	
}

#controller {	
	background-color: #444444; color: #E1E1E1;	
}

/* LISTED LINKS ON THE "LINKS" PAGE: */

#ullinks li { 
	position: relative;
	left: -20px;
	max-width: 100%;
	margin-bottom: 0; 
	padding: 0 4px; 
}

#ullinks a {
	position: relative;
	display: block;
	height: 36px; 
	max-width: 100%;
	padding: 4px 10px 0;	
	font-weight: bold;
	line-height: 1.1em;
	text-decoration: none;
}

#ullinks a:link, #ullinks a:visited {
	background: inherit; color: #CCFFFF;
}

#ullinks a:link span, #ullinks a:visited span {
	visibility: hidden;
}

#ullinks a:hover, #ullinks a:active {
	visibility: visible;	
}

#ullinks a:hover { 
	background: #585858; color: #FFFFFF;  /* background: #7E5556; */
}

#ullinks a:hover span, #ullinks a:active span {
	visibility: visible;
	margin-left: 2em;
	font: 0.8em Verdana, sans-serif;	
}

#ullinks a:hover span {
	background: inherit; color: #FFFFFF; background: transparent;
}

#ullinks a:active { 
	background: inherit; color: #BBBBBB;
}

#ullinks a:active span {
	background: inherit; color: #BBBBBB;
}

/*  "CONTACT" PAGE: */


#form p {
	position: relative;
	text-indent: 0;
	margin-bottom: 1.5em;
}

#form p input.indent2 {
	margin-left: 2em !important;
	background: #727272 !important; color: #DDDDDD;
}

#form .req {
	font-size: 1.5em;
	vertical-align: bottom;
	color: #FF9999; background: inherit;
}

#form span.col2 {
	position: absolute; 
	left: 90px;
	margin-bottom: 1.5em;
}

#form span.col2a {
	position: absolute; 
	top: 1.8em;
	left: 90px;
}

#form span.nameline {
	position: relative;
	top: 1.5em !important;
	margin-left: 85px;
}

#form input.name {
	width: 140px;
}

#form input.right {
	width: 286px;
}

#form span#spacer span {
	margin-left: 105px;
}

#form p.leftcol1 {
	position: relative;
	margin-bottom: 2em;
}

#form p.col3 {
	margin-left: 90px;
}

#form p.leftcol2 {
	position: relative; 
	top: 2.5em !important;
}

#form textarea, #form input {
	background-color: #CCCCCC !important;
}

#contact1 p#submitform {
	position: relative;
	margin-top: 140px;
	text-align: center;
}

#formresponse {
	width: 90%;
	padding: 5%;
	border: 2px solid #333333;
	background-color: #EEEEEE; color: #333333;
}

#formresponse a:link, #formresponse a:visited {
	padding: 0; margin: 0;
	color: #5588BB; background: inherit;
}

#formresponse a:hover, #formresponse a:active {
	color: #003399; background: inherit;
}

#formresponse p {
	text-indent: 0 !important;
	text-align: left;
	line-height: 1.1em !important;
	padding-bottom: 0;
}

#formresponse h3 {
	text-align: center;
}

#formresponse .boldred {
	font-weight: bold;
	line-height: 1em;
	color: #D63334; background: inherit;
}

#formresponse .returnbutton {
	margin-top: 2em;
	padding-top: 3px;
	padding-bottom: 5px;
	text-align: center;
}

#formresponse .returnbutton a:link, #formresponse .returnbutton a:visited {
	width: 16em;
	padding: 4px 6px;
	font: normal 12px Verdana, Arial, sans-serif;
	color: #000000; background: #999999;
	border: 3px solid;
	border-left-color: #CCCCCC; border-top-color: #CCCCCC;
	border-right-color: #777777; border-bottom-color: #777777;
}

#formresponse .returnbutton a:hover, #formresponse  .returnbutton a:active {
	color: #FFFFFF; background-color: #999999;
	border-left-color: #777777; border-top-color: #777777;
	border-right-color: #CCCCCC; border-bottom-color: #CCCCCC;
}

#form a.formresponse2 {
	display: block; 
	height: 1.1em; width: 5em; 
	margin: 1em auto; 
	border: 2px solid; 
	font: 1em bold Arial, sans-serif; 
	text-align:center;
}

#form a.formresponse2:link, #form a.formresponse2:visited {
	background: #CCCCCC; color:#000000; 
	border-left-color: #E6E6E6; border-top-color: #E6E6E6;
	border-right-color: #888888; border-bottom-color: #888888;
}

#form a.formresponse2:hover, #form a.formresponse2:active {
	background: #AAAAAA; color:#000000; 
	border-left-color: #888888; border-top-color: #888888;
	border-right-color: #CCCCCC; border-bottom-color: #CCCCCC;
}

.h-rule {
	border: 1px solid;
	border-top-color: #545454; 
}

/*  VISIONWEAVER link styling:  */

p.credit {
	text-indent: 0 !important; 
	padding-left: 2em;
}

ul#credit {
	 list-style-type: square;
}
.credit a#visionweaver:link, .credit a#visionweaver:visited {
	background : #006699;
	color : #FFFF99;
	font-family : Verdana, Arial, Helvetica, sans-serif;
	font-size : 9px;
	font-style : italic;
	font-weight : bold;
	padding : 1px;
}

.credit a#visionweaver:hover {
	background : #FFFF99;
	color : #006699;
}



.worktitlerp {
	font-style: italic;
	font-weight: bold;
	color: #E1E1E1;
	background: inherit;
	font-size: 14px;
}

.pdflink {
	font-style: italic;
	font-weight: bold;	
	color: #CCFFFF; background: inherit;
	font-size: 14px;
}

.price {
	font-style: normal;
	font-weight: normal;	
	color: #CCFFFF;
}

.grade {
	font-style: italic;
	font-weight: normal;	
	color: #C1C1C1;
}

/* Hack for Opera 6+ (it must come after values are set for other browsers): */
@media screen and (min-width: 0px) { 
#mainpage { left:2px; }
}