
/* final.css
The style for the musical tribute to life site, based on the forms

created by mary wior

++ remember, shortcut notation is top, right, bottom, left ++
*/


/****** Basic stuff  ** */

body { 
	background: #FFF;  color: #000; padding: 2em; 
	font-family: Verdana, Arial, Helvetica, sans-serif; }
.header { 
	background: 
		url('../images/tribute_logo_large.gif') no-repeat center left;
	padding-left: 100px;   
	border-bottom: 2px solid #0c3f6f; 
	clear: both; }
.footer { font-size: x-small; clear: both; }


/* using border instead of text decoration 
so that the underline can be a diff color */
a { color: #0c3f6f; text-decoration: none; font-weight: bold;
	border-bottom: 1px dotted #99c3ff; padding-bottom: 0; }
a:hover { background-color: #99c3ff; } 
a img { border: none; }


.highlight { color: #FCF0CC; background-color: #093c6c; 
	text-align: center; font-size: medium;}
.vip { float: right; position: relative; z-index: 5; margin-left: 1em; }


.content { 
 	margin-left: 21%; text-align: center; padding: 2em; }
.content p { text-align: justify; }
.content ul { 
	list-style-image: url('../images/notes-bullet.gif'); 
	list-style-position: inside; }
.content ol {
	list-style-type: none; }

/*  Page Specific Stuff  */

#sponsorship_info { width: 45%; margin-left: 50%; }
/* IE workaround for stupid float bug(s?) */
* html #sponsorship_info { margin-left: 1%; }
#sponsors { width: 45%; float: left; }
#sponsors p { text-align: justify; }

.xboxcontent .xsnazzy p { 
	font-size: small; 
	margin-bottom: 0; margin-top: 0; 
	padding-top: .3em; padding-bottom: 0;}
.xboxcontent .xsnazzy p + p { 
	font-size: x-large;
	font-family: Harrington, Times New Roman, Times Roman, serif; }

.photo_album { margin: auto; width: 100%; }
.photo_entry { width: 50%; float: left; }
.photo_album > .photo_entry:first-child { width: 100%; float: none; }

#event_page  ul { 
	list-style-type: none; 
	list-style-image: none; }
#event_page  ol { 
	list-style-image: url('../images/notes-bullet.gif'); 
	list-style-position: inside; }

#auction h3 { 
	font-size: x-large; color: #0C3F6F; background-color: #C0C6FF;
	border: .3em ridge #0C3F6F;
	font-family: Harrington, Times New Roman, Times Roman, serif;   }
#auction h4 { 
	margin-top: 1em; margin-bottom: 0; padding: 0; 
	border-top: .2em solid #0C3F6F;
	border-bottom: .1em dotted #0C3F6F;
	font-family: Harrington, Times New Roman, Times Roman, serif;  
	color: #0C3F6F; font-size: large;}
#auction img { float: right; margin: .5em; }
#auction .navigation img { float: none; margin: 0;}
#auction ul { text-align: left; }
#auction .price { font-size: small; font-face: italic;}
#auction .donator { font-size: small; font-face: italic; clear: right;}

#progads table { margin: auto; }
#progads td { padding: 0 1em 1em 1em; }
#progads table + p, #progads p + p { text-align: center; }


/* ********** navigation ****
markup is adapted from
http://alistapart.com/articles/taminglists/
*/
.navigation { 
	width: 20%; float: left;
	background-color: #FFF;
	color: #0C3F6F;
	font-family: Harrington, serif;  
	text-align: center;
	}
.navigation ul {
	margin: 0; padding: 0; border: none;
	list-style-type: none;  
	text-align: left; 
	}
.navigation li {
	border-bottom: 1px solid #C0C6FF;
	margin: 0;
	}
.navigation li a {
	display: block; 
	padding: 5px 5px 5px 15px;
	line-height: 30px;
	border-left: 5px solid #0C3F6F;
	border-right: 5px solid #C0C6FF;
	border-bottom: none;
	background-color: #639CC0;
	color: #0C3F6F;
	text-decoration: none;
	width: 100%;
	}
/* IE work around */
html>body #button li a {
	width: auto;
	}
.navigation li a:hover {
	font-weight: bolder;
	background: url('../images/notes-bullet.gif') no-repeat center left; 
	border-left: 5px solid #0C3F6F;
	border-right: 5px solid #639CC0;
	background-color: #C0C6FF;
	color: #0C3F6F;
	font-family: Harrington, Times New Roman, Times Roman, serif;  
	}
.navigation li.here {
	border-left: 5px solid #C0C6FF;
	}
.two_level { letter-spacing: 5px; }
.top_split { font-size: x-small; }
.bottom_split { letter-spacing: 10px;  }

.navigation a /* not inside a list - so those pics */ {
	border: none; }
.navigation a:hover { background-color: transparent; }


/* ***********************
Snazzy Rounded Corners
adapted slightly from http://www.cssplay.co.uk/boxes/snazzy.html
who adapted from http://pro.html.it/esempio/nifty/
************************ */

.xsnazzy {
	background: transparent; 
	margin-left: 0.5em; 
	position: relative; z-index: 1;
	text-align: center;}

.xtop, .xbottom { display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {
	background:#093c6c; 
	border-left:1px solid #093c6c; border-right:1px solid #093c6c;}
.xb1 {margin:0 5px; background:#093c6c;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {
	display:block; background:#FFF; 
	border:0 solid #093c6c;   border-width:0 1px;}
.xboxcontent p { margin: 0; padding: 1em; text-align: justify; }
.xboxcontent ul { margin: 0; padding: 1em; }
.xboxcontent h3 { margin: 0; padding: .5em; }

/* ditch the righthand border on the front page, cuz it's on the wrong side of the pic */
.intro .xboxcontent { border-right: 0; position: relative; z-index: 1;}

/* nested boxes! */
.xboxcontent .xsnazzy { width: 75%; margin: auto;  } /* auto margins center */
.xboxcontent .xsnazzy p { text-align: center; } /* mind the cascade! */

