.overviewTitle											{color:#C09060}
.location, .location a, h1.details, h1.normal {color:#B08050}
h2.normal, h3.normal, div.appendix {color:#9D6B40}
#nextMonth a, #prevMonth a							{color:#FCC483}	/* same as .page-bg-color */
#nextMonth a:hover, #prevMonth a:hover			{color:#EF6D03}	/* same as * a:hover */
#fixedTitle												{background-color:white}
.detailsMusician a, .smallNavigation a, th.eventHeaderBar, .bandTable * th {color:white}
.smallNavigation a:hover							{color:#FFB273}
.detailsMusician a:hover, .location a:hover	{color:#EF6D03}
div.dateSquare, div.square, div.innerTime		{background-color:#EF6D03}
.eventFooter, .eventTitle div.appendix			{color:#9E8D7A}
.eventDayOWAdvance, .eventDayAdvance, .eventTitleAdvance, .eventLocAdvance {color:#9E8D7A}

.detailsImage img    {border-color:#bbb; border-style:solid;margin-left:0;}

.bandTable, .detailsMusician a, th.eventHeaderBar
	{background-color:#D6BD9C;border-color:#D6BD9C;}
							
#nextMonth, #prevMonth, div.headerBar, .eventHeaderBar, h1.overviewTitle, h1.details, h1.normal, 
	h2.normal, h2.location, h2.location a, div.appendix, a.email
 		{font-family:georgia,times,serif}
.eventFooter, .smallNavigation, .detailsMusician, .detailsInstrument, .eventTitle div.appendix, 
   .bandTable * th
		{font-family:arial,helvetica,sans-serif}
.eventDayOW, .eventTitle, .eventLoc, .eventDayOWAdvance, .eventTitleAdvance, .eventLocAdvance,
   .eventTitleList h5, .eventInnerPresenters, .innerLoc
		{font-family:tahoma,arial,helvetica,sans-serif}
.eventDay  {font-family:times,serif}

td {
  /* border:solid 1px yellow; */
}

#swingPage {
	max-width:1200px;
 	margin-left:162px;
	margin-top:0px;
	margin-right:10px;
	display:block;
	padding:7px;
	overflow:auto;
   background:url(img/SwingBG.gif) no-repeat top left;}
	
h1.overviewTitle {
	margin-top:16px;
	margin-bottom:6px;
	margin-left:2px;
	font-weight:normal;
	font-size:40px; }

h1.overviewTitle span.attention {font-size:16px; color:white;}

#monthNavigation {
	float:right;
	margin:13px 0 0 0;
	padding:0;
	width:32px;
	height:32px;
   /* background-color:green; */ }

#monthNavigation, .eventDayOW, .eventDayOWAdvance {width:32px}

#monthNavigation img {
	float:right;
	margin:13px 0 0 0;
	padding:0;
	height:32px;}
 	
#nextMonth a, #prevMonth a, #nextMonthDisabled a, #prevMonthDisabled a  {
	float:right;
	width:32px;
	height:14px;
	text-decoration:none;
	text-align:right;
	font-size:10px;
	letter-spacing:0.1em;
	font-weight:normal; }

#nextMonth a {background:url(img/nextMonth.gif) no-repeat bottom right;}

#prevMonth a {background:url(img/prevMonth.gif) no-repeat top right;}

#nextMonthDisabled a {background:url(img/nextMonthDisabled.gif) no-repeat bottom right; color:#FDD9B3;}

#prevMonthDisabled a {background:url(img/prevMonthDisabled.gif) no-repeat top right; color:#FDD9B3;}

#nextMonth a:hover  { background:url(img/nextMonthHL.gif) no-repeat bottom right; }
#prevMonth a:hover  { background:url(img/prevMonthHL.gif) no-repeat top right; }

#nextMonth a span { position:relative; left:-12px; top:0px; }
#prevMonth a span { position:relative; left:-12px; top:-2px;}

.swingTable {border-collapse:collapse; width:98%;}

.eventDateHeader {
	vertical-align:top;
	color:black;
	padding:0;
	margin-left:0;
   font-size:100%; } 

.eventMonth {vertical-align:middle; padding:0;}

.eventDay, .eventDayAdvance {vertical-align:top; padding:0.25em 0.25em 0.25em 0;}

td.eventHeaderBar, th.eventHeaderBar {
	padding:0 0 0.2em 0;
	margin:0;
	font-size:100%;
	vertical-align:top;}

th.eventHeaderBar {text-align:left; padding-top:2px; padding-left:0.2em; border-top:10px solid #FCC483}
.bandTable * th   {font-size:13px}

div.headerBar, div.headerBarLeft {
	margin:0;
	vertical-align:middle;
	text-align:right;
	padding:0.2em 0.3em 0.2em 0;
	font-weight:bold;
	font-size:100%;
	letter-spacing:0.2em;
	color:white;}

div.headerBarLeft {text-align:left;padding-left:0.25em}

div.dateSquare, div.square {
	width:1.25em;
	height:1.25em;
	text-align:center;
	padding:0.1em 0 0 0.1em}

.eventFooter, .eventTitle div.appendix {
	padding:17px 5px 5px 5px;
	font-variant:normal;
	font-style:normal;
	font-size:75%;
	letter-spacing:0;
	font-weight:normal;}

.eventDayOW, .eventTitle, .eventTitleList, .eventInnerText, .eventInnerTextNB, .eventInnerPresenters {
   vertical-align:top;
	padding:5px 5px 5px 5px;
   font-size:100%; 
   font-weight:normal;} 

.eventLoc, .eventDayOWAdvance, .eventTitleAdvance, .eventLocAdvance {
	vertical-align:top;
	padding:5px 5px 5px 5px;
   font-size:100%; 
   font-weight:normal;} 

.eventDayOW, .eventDayOWAdvance {
	padding-left:0.5em;}

.eventTitle, .eventTitleAdvance, .eventTitleList {
	font-variant:small-caps;
	letter-spacing:0.1em;}

#detailsText .eventTitleList h4 {
   font-size:110%;}
   
.eventTitleList h5 {
   margin:0.5em 0 0.3em 0;
   font-variant:normal;
   font-weight:normal;
   font-size:90%;
   letter-spacing:0;}
  
.eventTitle, .eventTitleAdvance, .eventInnerText, .eventInnerPresenters {border-bottom:1px solid #E88F38;}

.emptyEvent {width:80px}

.eventTitle div.appendix {margin:0.2em 0 0 0; padding:0}
	
.eventLoc, .eventLocAdvance, .eventBand {
   font-size:80%; 
	border-bottom:1px solid #E88F38;}

td.eventBand         {text-align:left; width:35%}
td.eventBand.empty   {width:5%; height:3em}
td.eventBandPic      {width:318px}
td.eventBandPic div.bandTable, div.bandTable.withPic {width:325px}
td.eventBandPic div.detailsImage {
	clear:right;
	width:auto;
	height:auto;
	padding:0;
}

/* Details page */

* html .smallNavigation {position:absolute;}

#fixedTitle {
	left:180px;
	right:10px;
	margin-right:20px;
	padding:5px;
	font-size:80%;}

.smallNavigation {
	position:fixed;
	right:31px;
	width:55px;
	height:53px;
	padding:2px;}

.smallNavigation a {
	display:block;
	text-align:center;
	margin-top:4px;
	margin-bottom:8px;
	font-weight:normal;
	font-size:7pt;
	letter-spacing:1px;}

h1.details {
	width:80%;
	margin:0 0 0 -2px;
	padding:0;
	font-weight:normal;
	font-size:20pt}

h2.location, h2.location a {
	font-size:14pt;
	margin:4pt 0 0.5em -2px;}

h2.location {font-weight:normal}

div.appendix {
	font-size:12pt; 
	font-weight:normal; 
	font-style:italic;}

div.appendix img {vertical-align:middle; margin-right:5px}

.bandTable {
   border-collapse:collapse;
	margin:5px 0px 2px 0;
	/* min-width:130px;*/
	width:87%;
	padding:5px 0 5px 7px;}
   
div.bandTable.fullPage {    /* Use inside of detail pages without nested events */
   margin-left:15px;
   float:right;
   width:25%;}

div.bandTable.fullPage.withPic {    /* Use inside of detail pages without nested events */
   width:320px;}
   
div.bandTable.inside {width:70%;}
.bandTable table {border-collapse:collapse; padding:0; margin:0; width:90%}

.detailsMusician, .detailsInstrument, .detailsInstrument {
	vertical-align:bottom;
	padding:3px 0 3px 4px;
	font-size:10pt;
	line-height:12pt;
   min-width:20px;
   /* white-space:nowrap; do not use as it will overflow div box */
}

.detailsMusician, .detailsNNMusician {
	text-indent:-7px;
	padding-left:7px;
	padding-right:15px;}
.detailsMusician {background:url(img/MusicianBG.gif) repeat bottom left;}

.detailsNNMusician {font-family:Arial; font-size:75%}

.detailsMusician a {
	font-weight:normal;
	padding-right:3px;
}

.detailsImage {
	float:right;
	width:auto;
	height:auto;
	padding:5px 0 2px 15px;
}

#detailsText p {
	margin-top:0em;
	margin-bottom:0.3em;
	margin-left:-5px;
	padding: 2px 5px 2px 5px;
   font-family: garamond, times;
	font-size:100%;
	line-height:118%;
	text-indent:2px;
	text-align:justify;
	background:url(img/JCParaBG.gif) top left no-repeat}
	
#detailsText p.arrow {
	background:url(img/arrowAnimated.gif) left no-repeat;
	margin-left:-5px; padding-left:8px}

#detailsText p.first:first-letter {
	font-family:arial,sans-serif; font-size:118%; line-height:118%; color:#DA6608}
   
#detailsText td.left-column div p {
   font-family:times; font-size:inherit; line-height:inherit; color:inherit; text-align:left}
   
#detailsText p.first {
	text-indent:-4px;
	background:url(img/JCPageBG.gif) no-repeat top left;}
   
#detailsText table.archive tr td p {text-indent:0; background:inherit} 

#detailsText p.first-bold:first-letter {
	font-family:arial,sans-serif; font-weight:bold; font-size:118%; line-height:118%; color:#DA6608}
	
#detailsText p.first-bold {
	text-indent:-4px;
	background:url(img/JCPageBG.gif) no-repeat top left;}

#detailsText p.first-sub {
	background:url(img/JCPageBG.gif)}

#detailsText h4 {
	margin:0;
	padding:0;
   font-family: garamond, times;
	font-size:100%;
	font-weight:bold;
	line-height:118%;
	text-align:left}

.quotation {font-style:oblique;font-family:Georgia;font-size:90%}

.innerEvent {border-collapse:collapse; width:auto}

#detailsText p.bottom-space {padding-bottom:100px; background:url(img/JCPageBG.gif)}

/* Normal pages */

h1.normal {
	margin:0 6pt 12pt -4px;
	padding:0;
	font-weight:normal;
	font-size:20pt}
	
h2.normal {
	margin:16pt 0 4pt -2px;
	font-weight:normal;
	font-size:14pt}
	
h3.normal {
	margin:16pt 0 4pt -2px;
	font-weight:normal;
	font-size:14pt}
	
a.email {font-size:75%}
div.innerTime {
   padding:0.1em 0.25em 0 0.25em; 
   margin-top:0.1em;
   white-space:nowrap;}
   
td.innerTime, td.innerTimeNB {
   padding:0.25em 0 0 0; 
   vertical-align:top; 
   width:20%;}
td.innerLoc {
   vertical-align:top;
   padding-top:0.5em;
   font-size:90%}

td.innerTime {border-bottom:1px solid #E88F38;}
td.innerTime.small, td.innerTimeNB.small {width:10%}

div.cancellation {
  width:auto;
  text-align:center;
  background-color:#E88F38;
  padding:5px; 
  font-weight:bold;
  font-variant:normal;
  color:white;}

.eventInnerPresenters {
   font-size:80%;
   color:#BD8B55;}
   
div.sponsorImage {
  /* Nothing special, should be directly assigned by @html-css-style */
}
p.copyright {margin:0; font-size:80%}

