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

	STORIES page styles/alterations
	For repeated module/column layout basics see relevant default.css section
*/

	/* story/stories styles/alterations  */
		/* rounded corners for top/bottom of boxes/columns */
			.story #content #feature {
				width:719px !important;
				background: url(../images/bgs/content/feature-white-Xwide.png) top left repeat-y;
			}
			.story #content #feature .boxHeading{
				width:719px ;
				background: url(../images/bgs/content/top-Xwide-green.png) top left no-repeat; 
			}
			.story #content #feature .pad{
				width:697px;
				padding-bottom:12px;
				background: url(../images/bgs/content/base-Xwide-white.png) bottom left no-repeat;
			}
			.story #feature .pad .stepThrough{ 
				width: 690px;
			}
			
		/* shared feature styles */
			.story #feature li{ 
				background-image:none;
				padding-left:0px;
			}
			.story #feature .contentText li{ 
				background:url(../images/icons/bullet.gif) left top no-repeat;
				padding-left:18px;
			}
			.story #feature  a{ 
				color:#333333;
				text-decoration:underline;
			}

			.story #feature .shortcuts  {
				float:left; 
				display:inline;
				width:110px;
			}
			.story #feature .shortcuts li {padding-bottom:1em;}
			.story #feature .shortcuts li a{padding:0px 5px 3px 20px;}
			.story #feature .shortcuts li.transcript a{ 
				background: url(../images/icons/transcriptGreen.gif) 0px 0px no-repeat; 
			}
			.story #feature .shortcuts li.play a{background: url(../images/icons/restreamGreen.gif) 0px 0px no-repeat; }

		/* filter menu */
			.story #feature .filterMenu{
				background: #C4EB9F;			
				position:relative;
				z-index:0;
				top: 0px;
				margin:-12px -12px 15px -10px;
				padding: 3px 0 0 0;
				width:712px ;
				border-bottom:25px solid #DCF3C5;
			}
			.story #feature .filterMenu .filters a,
			.story #feature .filterMenu li.active li a{ 
				color:#666666;
				padding-bottom:6px;
				text-decoration:underline;
				font-weight:normal;
				background-image: none ;
			}
			.story #feature .filterMenu a:hover,
			.story #feature .filterMenu li.active li a:hover{ color:#333333;}

			.story #feature .filterMenu .active a,
			.story #feature .filterMenu li li.active a{
				font-weight:bold;
				text-decoration:none;
				color:#333333;
				background:  url(../images/bgs/content/stories/filter-li.gif) center bottom no-repeat;
			}

			.story #feature .filterMenu li li.active a{
				background:  url(../images/bgs/content/stories/subFilter-li.gif) center bottom no-repeat;
			}

			.story #feature .filterMenu h2,
			.story #feature .filterMenu .filters h3,
			.story #feature .filterMenu .filters ul{
				z-index:100;
				position:absolute;
			}
			.story #feature .filterMenu h2,
			.story #feature .filterMenu .filters h3{
				width:85px;
				text-align:right;
			}
			.story #feature .filterMenu h2{
				top:6px;
				font-size: 1.2em;
				text-indent:10px;
			}
			.story #feature .filterMenu ul li{
				display:inline;
				padding-right:12px;
			}
			.story #feature .filterMenu .filters{
				height:22px;
				padding:0 0 0 95px;
			}
			.story #feature .filterMenu .filters ul{
				left:0;
				top:28px;
				z-index:0;
				padding:0 0 0 95px;
				width:617px;
				background: #DCF3C5;
			}
			.story #feature .filterMenu .filters h3{
				top: 31px;
				left:0;
				text-indent:10px;
				color:#000000;
			}
			.story #feature .filterMenu .filters ul,
			.story #feature .filterMenu .filters h3{
				display:none;
			}
			.story #feature .filterMenu .filters li.active ul,
			.story #feature .filterMenu .filters li.active h3{
				display:block;
			} 

		/* multiple stories page  */
			.story #feature .storyDates {
				border-bottom: 1px solid #aeccb7;
				width:690px;
			}
			.story #feature .storyDates li.storyDay{
				padding: 0;
				float:left;
				width:690px;
				border-top: 1px solid #aeccb7;
			}
			.story #feature .storyDates h2.date{
				float:left; 
				display:inline; 
				width: 100px;
				font-size:1.2em;
				font-weight:normal;
				color: #1A6E30 ;
				padding-top:10px;
			}
			.story #feature .storyDates h2.date span{font-size:1.2em;}
			.story #feature .storyDates .storyList{
				float:left;
				display:inline; 
				width:590px;
				padding-bottom:.2em; 
			}

			.story #feature .storyDates .storyInfo,
			.story #feature .storyDates .storyInfo .inlinepic,
			.story #feature .storyDates .storyInfo .summary{
				float:left; 
				display:inline;
			}
			.story #feature .storyDates .storyInfo {
				position:relative;
				margin-top:-1px;
				width:570px;
				padding: 10px ;
				border-top: 1px solid #aeccb7;
			 }
			.story #feature .storyDates li.first {border-top: 0px solid #aeccb7; }
			.story #feature .storyDates .storyInfo .inlinepic { padding-right:10px; }
			.story #feature .storyDates .storyInfo .summary{width:440px;}
			.story #feature .storyDates .storyInfo .narrow {width:360px; }
			.story #feature .storyDates .storyInfo  h3{
				font-size:1.4em;
				font-weight:normal; 
			}
			.story #feature .storyDates .storyInfo dl { padding-bottom:.2em;}
			.story #feature .storyDates .storyInfo dl dt,
			.story #feature .storyDates .storyInfo dl dd{
				color:#666666;
				font-size:.95em;
				font-weight:normal; 
			}
			.story #feature .storyDates .storyInfo dl dt{ 
				float:left;
				display:inline;
				width:auto;
				padding-right:5px;
			 }


		/* single story page  */
			.story #feature .storyItem {
				padding:10px 0px;
				border-top: 1px solid #aeccb7;
				border-bottom: 1px solid #aeccb7;
				width:680px;
			}
			.story #feature .shortcuts  {float:right; }
			.story #feature .storyItem .mainPic{
				float:left; 
				display:inline;
				width: 155px;
				margin-bottom:10px;
			}
			.story #feature .storyItem .mainPic img{
				padding-left:5px;
				max-width:150px !important; 
			}
			.story #feature .storyItem .detail{ margin-left: 170px;width:390px;}
			.story #feature .storyItem .detail dl { padding-bottom:.5em;}
			.story #feature .storyItem .detail dl dt,
			.story #feature .storyItem .detail dl dd{
				color:#666666;
				font-size:1.1em;
				font-weight:normal;
			 }
			.story #feature .storyItem .detail dl dd.showName,
			.story #feature .storyItem .detail dl dt{ 
				float:left;
				display:inline;
				width:auto;
				padding-right:4px; 
			}
			.story #feature .storyItem .detail dl .publishDate { color: #1A6E30;}
			.story #feature .storyItem div.transcript{
				clear:both;
				padding:10px 5px 10px 170px;
				border-top: 1px solid #aeccb7;
				background: url(../images/icons/transcriptLg.gif) 123px 10px no-repeat;
			}