/* 
	RTR secondary CSS document. 
	AUTHOR: T Morris/ Papercut Media 

	INDEX page styles/alterations
	For repeated module/column layout basics see relevant default.css section
*/
	html,
	body.index{	background: #D2D1A0 url(../images/bgs/body-bg.gif) 960px 595px no-repeat;}
	.index #innerWrap{
		background: url(../images/bgs/innerWrap-bg-index.gif) 0px 711px no-repeat;
	}
	
	.index #feature li{ 
		background-image:none;
		padding-left:0px;
	}
	#content #feature,
	#content #supplement { /* for index page we move the feature bg down the chain a step to the module boxes rather than the feature/supplemental div */
		background-image:none;
	}
	#content .column,
	#content #colFeat{
		width:237px;
		float:left;
		display:inline;
		position:relative;
	}
	#content #colFeat{ width:479px;}
	#content #colOne { width:241px; }
	
		#content .module{ /* for index page we move the feature bg down the chain a step to the module boxes rather than the feature div */
			float:left;
			display:inline;
			position:relative;
			width: 237px;
			background: url(../images/bgs/content/feature-white.png) top left repeat-y;
			margin:56px 0 1px 0;
			padding:0;
		}
		#content #colFeat .module{
			color:#fff;
			width:479px;
			margin:60px 0 1px 0;
			background: url(../images/bgs/content/feature-black.png) top left repeat-y;
		}
		#content #colFeat .first,
		#content #supplement .first{
			margin-top:0;
		}

	/* rounded corners for bottom of boxes/columns */
		#content .module .pad{
			width:208px;
			background: url(../images/bgs/content/index/base-narrow-white.gif) bottom left no-repeat;}
		#colFeat .module .pad{ 
			width:450px;
			background: url(../images/bgs/content/index/base-wide-black.gif) bottom left no-repeat;	}
		
		/* ensure first box in third column is taller than gradient bg */
		#supplement .first .pad {min-height:230px; }


		#content .module .pad .item{
			margin-bottom:12px;
		}
		#content .module .pad .inlinepic{
			float:left; 
			display:inline;
			margin:0 10px 10px 0;
		}
		#content .module p a{ text-decoration:underline;}
		#content .module .pad .more a{ font-weight:bold;font-size:1.3em;text-decoration:none;}
		#content .module .pad .more a:hover{ text-decoration:underline;}
		#colFeat h2.boxHeading{ 
			font-size: 2.2em;
		}


	/* mimics base supplement boxHeading styles for narrow columns */
		#content .boxHeading{ 
			position:relative;
		}
		#content .column .boxHeading{ 
			margin-top:-38px;
			padding-top:12px;
			width: 237px;
			height:26px;
			background: url(../images/bgs/content/top-narrow-lime.png) top left no-repeat;
		}



	
	/* coloured headings/rounded corners for boxes/columns */
		/* wide box - default .boxHeading bg green */ 
		#colFeat .box1 .boxHeading{ background: url(../images/bgs/content/top-wide-green.png) top left no-repeat; }
		#colFeat .box2 .boxHeading{ background: url(../images/bgs/content/top-wide-pink.png) top left no-repeat; }
		#colOne .box1 .boxHeading{ background: url(../images/bgs/content/top-narrow-lime.png) top left no-repeat; }
		#colOne .box2 .boxHeading{ background: url(../images/bgs/content/top-narrow-aqua.png) top left no-repeat; }
		#colOne .box3 .boxHeading{ background: url(../images/bgs/content/top-narrow-orange.png) top left no-repeat; }
		#colTwo .box1 .boxHeading{ background: url(../images/bgs/content/top-narrow-violet.png) top left no-repeat; }
		#colTwo .box2 .boxHeading{ background: url(../images/bgs/content/top-narrow-pink.png) top left no-repeat; }
		#colTwo .box3 .boxHeading{ background: url(../images/bgs/content/top-narrow-lime.png) top left no-repeat; }
		#supplement .box1 .boxHeading{ background: url(../images/bgs/content/top-narrow-orange.png) top left no-repeat; }
		#supplement .box2 .boxHeading{ background: url(../images/bgs/content/top-narrow-red.png) top left no-repeat; }
		#supplement .box3 .boxHeading{ background: url(../images/bgs/content/top-narrow-green.png) top left no-repeat; }
		

	.module .pad a{ font-weight:bold;color:#333333;}
	.module .pad h3,
	.module .pad h3 a{ color:#555555;}
	#colFeat .module .pad h3,
	#colFeat .module .pad a{ color:#999999;}

	.module ul h3 {font-size: 1.4em; }
	.module ul h4{ font-size: 1.2em; font-weight:normal;}



	/* numeric box based module colours for index pages */
		/* GREEN */
			/* wide box - colFeat box1 & box3 */
			#colFeat .module .pad .tint, 
			#colFeat .module .pad .tint a,
			#colFeat .module .pad dd.cost /* Events */
				{ color:#8AD83F; }
			#colFeat .module .pad .more a{ color:#538226;}

			/* narrow box - colThree box3 */
			#supplement .box3 .pad .tint, 
			#supplement .box3 .pad .tint a,
			#supplement .box3 .pad dd.cost /* Events */
				{ color:#6BB423; }
			#supplement .box3 .pad .more a{ color:#8AD83F;}

			/* shared colours */
			#colFeat .module .pad .bgTint,
			#supplement .box3 .pad .bgTint,
			#colFeat .module dt span.day, /* Charts */
			#supplement .box3 dt span.day
				{ background:#8AD83F;}


		/* PINK */
			/* wide box - colFeat box2 */
			#colFeat .box2 .pad .tint,
			#colFeat .box2 .pad .tint a,
			#colFeat .box2 .pad dd.cost /* Events */
				{ color:#FF99CC; }
			#colFeat .box2 .pad .more a{ color:#B36B8F;}
	
			/* narrow box - colTwo box2 */
			#colTwo .box2 .pad .tint,
			#colTwo .box2 .pad .tint a,
			#colTwo .box2 .pad dd.cost /* Events */
				{ color:#FF6FB7; }
			#colTwo .box2 .pad .more a{ color:#FF99CC;}

			/* shared colours */
			#colFeat .box2 .pad .bgTint,
			#colTwo .box2 .pad .bgTint,
			#colFeat .box2 dt span.day, /* Charts */
			#colTwo .box2 dt span.day 
				{ background:#FF99CC;}

	
		/* LIME - narrow colOne box1 & colTwo box3 */
			#colOne .box1 .pad .tint, 
			#colOne .box1 .pad .tint a,
			#colOne .box1 .pad dd.cost, /* Events */
			#colTwo .box3 .pad .tint, 
			#colTwo .box3 .pad .tint a,
			#colTwo .box3 .pad dd.cost /* Events */
				{ color:#ABB322; }
			#colOne .box1  .pad .more a,
			#colTwo .box3  .pad .more a{ color:#ABB322;}
			#colOne .box1 .pad .bgTint,
			#colOne .box1 dt span.day, /* Charts */
			#colTwo .box3 .pad .bgTint,
			#colTwo .box3 dt span.day /* Charts */
				{ background:#D0D729;}
		
		
		/* AQUA - narrow colOne box2  */
			#colOne .box2 .pad .tint, 
			#colOne .box2 .pad .tint a,
			#colOne .box2 .pad dd.cost /* Events */
				{ color:#18B4B8; }
			#colOne .box2 .pad .more a{ color:#1BC5CA;}
			#colOne .box2 .pad .bgTint,
			#colOne .box2 dt span.day /* Charts */
				{ background:#1BC5CA;}
		
		
		/* ORANGE - narrow colOne box3 & colThree box1  */
			#colOne .box3 .pad .tint, 
			#colOne .box3 .pad .tint a,
			#colOne .box3 .pad dd.cost,/* Events */
			#supplement .box1 .pad .tint, 
			#supplement .box1 .pad .tint a,
			#supplement .box1 .pad dd.cost /* Events */
				{ color:#FF6600; }
			#colOne .box3 .pad .more a,
			#supplement .box1 .pad .more a{ color:#FF6600;}
			#colOne .box3 .pad .bgTint,
			#colOne .box3 dt span.day,/* Charts */
			#supplement .box1 .pad .bgTint,
			#supplement .box1 dt span.day/* Charts */
				{ background:#FF6600;}
		
		
		/* VIOLET - narrow colTwo box1  */
			#colTwo .box1 .pad .tint, 
			#colTwo .box1 .pad .tint a,
			#colTwo .box1 .pad dd.cost /* Events */
				{ color:#666699; }
			#colTwo .box1 .pad .more a{ color:#666699;}
			#colTwo .box1 .pad .bgTint,
			#colTwo .box1 dt span.day /* Charts */
				{ background:#666699;}


		/* RED - narrow colThree box2  */
			#supplement .box2 .pad .tint, 
			#supplement .box2 .pad .tint a,
			#supplement .box2 .pad dd.cost /* Events */
				{ color:#CC0000; }
			#supplement .box2 .pad .more a{ color:#CC0000;}
			#supplement .box2 .pad .bgTint,
			#supplement .box2 dt span.day /* Charts */
				{ background:#CC0000;}







	/* Featured modules with large images */
		#colFeat .module,
		#colFeat .Events .pad,
		#colFeat .Stories .pad,
		#colFeat .News .pad,
		#colFeat .SponsorNews .pad,
		#colFeat .Presenters .pad,
		#colFeat .other .pad,
		{float:left; display:inline;margin-bottom:10px;}

		#colFeat .module .pad .leaderImage{float:left; display:inline; margin:0 0 0 -2px;width:210px;}
		#colFeat .module .pad .leaderImage img{max-width:210px !important; margin-bottom:10px;}
		#colFeat .module .pad .detail{margin-left:220px;}
		#colFeat .module .pad .more {display:block;text-align:right;}


	/* Events Module */
		.Events .pad dt{ float:left;display:inline;padding-right:5px;}
		.Events .pad dd.cost{ font-weight:bold;}


	/* Stories Module  */
		#colFeat .Stories .pad .leaderImage{width:150px;}
		#colFeat .Stories .pad .leaderImage img{max-width:150px !important;}
		#colFeat .Stories .pad .detail{margin-left:160px;}
		.column .Stories .pad .leaderImage{ 
			margin:-3px 0 5px 0;
			}


	/* Presenter Module (supplement column only) */
		.Presenters h3 .imgLink{ 
			float:left; 
			display:inline; 
			margin:0 9px 10px 0;
			}


	/* Charts Module (tabs & stuff that doesn't get used on other pages)*/
		#content .Charts .pad{
			padding:0 0 0 7px;
			width:230px;
		}
		#content #colFeat .Charts .pad{	width:470px;}

		#content .Charts .pad ul{
			position:relative;
			top:-14px;
			width:227px;
			padding:0 0 0 3px;
			background: url(../images/bgs/content/index/charts-ul.gif) top left repeat-x;
		}
		#content #colFeat .Charts ul{
			width:467px;
			font-weight:bold;
		}
		#content .Charts li{
			float:left;
			display:inline;
			padding:0;
			font-size:1.1em; 
			line-height:26px;
			color:#000;
			background: url(../images/bgs/content/index/charts-li.gif) bottom left no-repeat;
		}
		#content .Charts li.active{
			color:#000;
			background:#fff url(../images/bgs/content/index/charts-li.gif) top left no-repeat;
		}
		#content #colFeat .Charts li.active{
			color:#fff;
			background:#000 url(../images/bgs/content/index/charts-li.gif) top left no-repeat; 
		}
		#content .Charts li .header{
			float:left;
			display:block;
			border-top:3px solid #ffcc33;
			padding:0 3px;
			background: url(../images/bgs/content/index/charts-span.gif) bottom right no-repeat;
		}
		#content .Charts li.active .header{
			background:url(../images/bgs/content/index/charts-span.gif) top right no-repeat;
		}

		#content .Charts ul dl{
			position:absolute;
			left:0;
			top:26px;
			padding:0;
			width:230px;
			background:#fff;
		}
		#content #colFeat .Charts ul dl{
			width:470px;
			background:#000;
		}
		#content .Charts ul dt.more{
			padding-top:1em;
		}
		#content .Charts ul dd.more a{
			font-size:1.1em !important;
		}



/* On Air / Shows module */
		#content .Shows .restream .play{padding:2px 5px 3px 20px; background: url(../images/icons/restreamOrange.gif) 0px 0px no-repeat; }
		#supplement .Shows .pad{min-height:135px;height:135px; }
		#supplement .box1.Shows .pad {
			background: url(../images/bgs/content/index/base-narrow-shows.gif) bottom left no-repeat;
		}