.above { 
	background: url(/img/above.png) no-repeat 0 0;
	height: 327px;
	position: relative;
	overflow: hidden;
	clear: both; }

#featured { text-align: left; } 

#topstory .photo { 
	background-position: 160px 0;
	background-repeat: no-repeat;
	width: 940px; } 
#topstory .photo .mask { 
	background: url(/img/mask.png) no-repeat 0 0; 
	height: 267px;
	padding: 30px 620px 30px 30px;
	text-shadow: #000 1px 1px 2px } 
.ie6 #topstory .mask { background-image: url(/img/mask8.png); } 	

#topstory .mask h1, 
#topstory .mask h1 a { 
	color: #d3242a; 
	font-size: 42px; 
	line-height: 36px; 
	font-weight: 400;	
	display: block; } 
	#topstory .mask:hover h1 a, 
	#topstory .mask:hover h1 a { color: #fff; } 

#topstory .mask p { 
	padding-top: 15px; 
	color: #fff; 
	font-size: 16px;
	line-height: 20px; }
	#topstory .mask p a { 
		color: #fff; 
		display: block; }
	#topstory .mask:hover p a { color: #cde7ff; }		

#topstory .mask a.btn { 
   background: url(/img/read-more.png) no-repeat 0 0;
   width: 150px;
	height: 45px;
	float: left;
	margin-top: 16px;
	display: block;
	clear: both; } 

#topstory .mask a.button { 
   background-repeat: no-repeat;
   width: 150px;
	height: 45px;
	float: left;
   text-indent: -1000px;
   overflow: hidden;
	margin-top: 16px;
	display: block;
	clear: both; } 
	#topstory .mask a.button:hover { background-position: 0 -45px !important; } 	
	#topstory .mask a.button:active { background-position: 0 -90px !important; } 
	
   #topstory .mask a.button.learn-more { background-image: url(/img/buttons/learn-more.png); } 	
   #topstory .mask a.button.contribute { background-image: url(/img/buttons/contribute.png); }    
   #topstory .mask a.button.watch { background-image: url(/img/buttons/watch.png); }    
   #topstory .mask a.button.go-now { background-image: url(/img/buttons/go-now.png); }    
   #topstory .mask a.button.take-part { background-image: url(/img/buttons/take-part.png); }    
   #topstory .mask a.button.join { background-image: url(/img/buttons/join.png); }    
   #topstory .mask a.button.what { background-image: url(/img/buttons/what.png); }    
   #topstory .mask a.button.read-more { background-image: url(/img/buttons/read-more.png); }    
   #topstory .mask a.button.click-here { background-image: url(/img/buttons/click-here.png); }    
   #topstory .mask a.button.weigh-in { background-image: url(/img/buttons/weigh-in.png); }    
   #topstory .mask a.button.fight-back { background-image: url(/img/buttons/fight-back.png); }    
	
	 
	 
/* Controls */

#controls {
    position: absolute;
    left: 28px; 
    top: 290px;
    margin: 0;
    padding: 0;
    list-style: none; }
	
#controls ul {
	margin: 0; 
	padding: 0; }
	
#controls li {
    float: left;
    margin: 0 5px; 
    width: 17px;
    height: 17px; }

.ie6 #controls li { margin: 0 4px; }
		
#controls .frame { 
	background: url(/img/controls.png) no-repeat 0 0;
    overflow: hidden;
    width: 17px;
	height: 17px;
    margin: 0 2px 0 0;	
    display: block; }
	
#controls .frame:hover { background-position: 0 -17px; }	
#controls .frame:active { background-position: 0 -34px; }	
#controls .ui-tabs-selected .frame { background-position: 0 -51px; }	

#controls .selected a:link, 
#controls .selected a:visited { cursor: default; }

#controls a:hover, 
#controls a:focus, 
#controls a:active { cursor: pointer; }

	 
#topstory .hidden { display: none; }	


.above .actions {
	width: 283px;
	position: absolute;
	top: 12px;
	right: -7px; }

/* Below */
   
.below { background: #fff; } 	
.below .top { 
	background: url(../img/below-top.png) no-repeat center top;
	min-height: 381px;
	padding: 0 !important; } 
.below-bot { 
	background: url(../img/below-bot.png) no-repeat center top;
	height: 5px;
	overflow: hidden; } 
	
.below .discuss,   
.below .suggest,
.below .feed { 
	float: left;
	text-align: left; }
   
.below .discuss { 
   width: 430px;
	padding: 20px 20px 15px; }	   
.below .suggest { 
	width: 433px;
	padding: 5px 20px 15px 17px; }	
.below .feed { 
	width: 450px;
	padding: 5px 10px 15px; }	
	
.suggest h2 { 
		margin: 7px 0 15px 0;
		text-indent: -1000px;
		overflow: hidden; }
.ie7 .suggest h2 { padding: 7px 0 0 0 !important; }    
.suggest h2 a { 
   	background: url(../img/h2-suggest.png) no-repeat 0 0;	
		height: 24px;
		display: block; }      
	
.feed .title { position: relative; }
.feed h2 { 
	width: 112px; 
	float: left; 
   margin: 7px 0 15px; }	
	.feed .title h2 a { 
		background: url(/img/h2-latest.png) no-repeat 0 0;	
		height: 19px;
		display: block; }	
	.feed .title h2 a:hover { background-position: 0 -19px; }
	.feed .title h2 a:active { background-position: 0 -38px; }		
   	
.suggest h3 { 
	font-size: 20px;
	line-height: 20px;
	color: #d3242a;
   margin: 0;
	padding: 7px 0 14px 3px; }	
   
.suggest ol { margin: 10px 0 10px 25px; } 

.suggest form { margin: 10px 0; } 

.discuss h2 { text-indent: -1000px;}   
.discuss h2 a { 
   	background: url(/img/join-discussion.png) no-repeat 0 0;	
      display: block;
		height: 11px;
		overflow: hidden; } 
.discuss h2 a:hover { background-position: 0 -11px; }       
      
.discuss .topic { padding-bottom: 15px; }
      
.discuss .topic h3 { 
		font-size: 27px;
		line-height: 27px;
		color: #2784ab;
		margin-bottom: 8px; }			

.discuss p { 
		font-size: 14px;
		line-height: 16px;
		color: #616161; }	
      

/* Tabs */

#feed-tabs { 
	position: absolute;
	top: 3px;
	right: 0; }
#feed-tabs ul { 
	width: 243px; 
	height: 28px; 
	list-style: none;	
	float: right; 
	margin: 0; }
#feed-tabs .ui-tabs-nav li { float: left; }
#feed-tabs .ui-tabs-nav li a {  }

#feed-tabs .all,
#feed-tabs .blogtab,
#feed-tabs .facebook,
#feed-tabs .twitter { 
	background: url(/img/tabs.png) no-repeat 0 0; 
	height: 28px; 
	text-indent: -10000px;	
	overflow: hidden; 
	float: left; 
	display: block;
	margin: 0;
	padding: 0; }

	
	#feed-tabs .all { background-position: 0 0; width: 63px; }
	#feed-tabs .all:hover { background-position: 0 -28px; }
	#feed-tabs .ui-tabs-selected .all { background-position: 0 -56px; }
		
	#feed-tabs .blogtab { background-position: -63px 0; width: 47px; }
	#feed-tabs .blogtab:hover { background-position: -63px -28px; }
	#feed-tabs .ui-tabs-selected .blogtab { background-position: -63px -56px; }
	
	#feed-tabs .facebook { background-position: -110px 0; width: 74px; }
	#feed-tabs .facebook:hover { background-position: -110px -28px; }
	#feed-tabs .ui-tabs-selected .facebook { background-position: -110px -56px; }

	#feed-tabs .twitter { background-position: -184px 0; width: 59px; }
	#feed-tabs .twitter:hover { background-position: -184px -28px; }
	#feed-tabs .ui-tabs-selected .twitter { background-position: -184px -56px; }
	
	

#feed-tabs .ui-tabs-panel { padding-top: 20px; }

.item {
	padding: 8px 12px 8px 0;
	font-size: 12px;
	line-height: 12px;
	color: #393939; }		
.item a { color: #095a82; display: block; }
.item a { color: #343434; }

.item h3 {
	margin: 0;
	padding-bottom: 2px;
	font-size: 18px;
	line-height: 18px;
	color: #4c4c4c; }	
.item h3 a { color: #095a82; }	
.item h3 a:hover, .item:hover h3 a { color: #810000; }	
	
	.item .date {
		background: #d6d6d6;
		-moz-box-shadow: inset 3px 3px 4px #adadad;
		-webkit-box-shadow: inset 3px -3px 4px #adadad;
		box-shadow: inset 3px 3px 4px #011a25;
		-moz-border-radius: 5px; 
		-webkit-border-radius: 5px;
		width: 30px; 
		padding: 7px 6px;
		margin-right: 12px;	
		float: left;
		font-size: 13px;
		line-height: 15px;
		color: #4c4c4c;
		text-transform: uppercase;
		text-align: center; } 
		.item .date strong {
			font-size: 18px;
			display: block;
			font-weight: normal; }
			
	.item:hover .date {
		background: #c3c3c3;
		-moz-box-shadow: inset 3px 3px 4px #9b9b9b;
		-webkit-box-shadow: inset 3px -3px 4px #9b9b9b;
		box-shadow: inset 3px 3px 4px #9b9b9b; } 	
	.item:active .date {
		background: #b5b5b5;
		-moz-box-shadow: inset 3px 3px 5px #9b9b9b;
		-webkit-box-shadow: inset 3px 3px 5px #9b9b9b;
		box-shadow: inset 3px 3px 5px #9b9b9b; } 			
				

/* Rotator & Controls
-------------------------------------------------------------- */

.hidden {display: none;}

.rotator_controls  {
    height: 11px;
    overflow: hidden;
    list-style: none;
    margin: auto;
    padding: 4px 0;
    }

.rotator_controls  li {
    float: left;
    margin: 0;
    min-width: 11px; /* be nice to Opera */
    }

.rotator_controls  .selected a {
    z-index: 2;
    }

.rotator_controls  .frame-prev,
.rotator_controls  .frame-1,
.rotator_controls  .frame-2,
.rotator_controls  .frame-3,
.rotator_controls  .frame-4,
.rotator_controls  .frame-5,
.rotator_controls  .frame-6,
.rotator_controls  .frame-next {
    float: left;
    height: 11px;
    overflow: hidden;
    text-align: center;
    display: block;
    outline: 0;
    }

.rotator_controls  .frame-prev {
    background: url('/assets/img/rotator_back.png') no-repeat left top;
    width: 11px;
    }

.rotator_controls  .frame-1,
.rotator_controls  .frame-2,
.rotator_controls  .frame-3,
.rotator_controls  .frame-4,
.rotator_controls  .frame-5,
.rotator_controls  .frame-6 {
    display: none;
    }

.rotator_controls  .frame-next {
    background: url('/assets/img/rotator_next.png') no-repeat left top;
    display: none;
    }

.rotator_controls  .frame-prev:hover,
.rotator_controls  .frame-1:hover,
.rotator_controls  .frame-2:hover,
.rotator_controls  .frame-3:hover,
.rotator_controls  .frame-4:hover,
.rotator_controls  .frame-5:hover,
.rotator_controls  .frame-6:hover,
.rotator_controls  .frame-next:hover  {
    background-position: left -23px;
   background: blue;	
    }

.rotator_controls  .ui-tabs-selected .frame-prev,
.rotator_controls  .ui-tabs-selected .frame-1,
.rotator_controls  .ui-tabs-selected .frame-2,
.rotator_controls  .ui-tabs-selected .frame-3,
.rotator_controls  .ui-tabs-selected .frame-4,
.rotator_controls  .ui-tabs-selected .frame-5,
.rotator_controls  .ui-tabs-selected .frame-6,
.rotator_controls  .ui-tabs-selected .frame-next {
   background-position: left -45px;
   background: red;
   }

.rotator_controls  .ui-tabs-selected a:link,
.rotator_controls  .ui-tabs-selected a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: default;
    }

.rotator_controls  .ui-tabs-hide {
  display: none;
}

.rotator_controls  a:hover,
.rotator_controls  a:focus,
.rotator_controls  a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
    }

.rotator_controls a span,
.rotator_controls .ui-tabs-selected a span {
    display: none;
    }
