/* *********************************

  TITLE:        NBC_MOOD.CSS
  VERSION:      2.01
  LAST UPDATED: 10/15/2009 
  UPDATED BY:   Viktoriya Eremeeva
  
    @release 2009-10-29 vicky

************************************ */

/* ************** mood for flash ***************** */

#flash_mood_container {
  height:40px;
  left:15px;
  position:absolute;
  top:50px;
  width:650px;
      padding-top: 5px;
}

#flash_mood_container h3 {
  text-align:left;
  margin-top:10px;
}

#flash_mood_container a {
  font-size: bold 20/30px Georgia, serif;
  text-decoration: none;
  cursor: pointer;
  color: #000;
}

#flash_mood_container a span {
   display: inline;
}

#flash_mood_container .flash_mood_furious {   color: #9f0712; }
#flash_mood_container .flash_mood_intrigued { color: #6fae1e; }
#flash_mood_container .flash_mood_sad {       color: #368dd4; }
#flash_mood_container .flash_mood_bored {     color: #6246b1; }
#flash_mood_container .flash_mood_thrilled {  color: #dc380f; }
#flash_mood_container .flash_mood_laughing {  color: #e0ac25; }

/* ********  mood for Article and slideshow ******** */
 
#main #storyDetailRight {
float:left;
width:181px;
margin-left: 0px;
*margin-left: 0px;
}

*html #main #storyDetailRight {
	margin-left: 8px;
	width:200px;
}

.moodScore {
  float: left;
  text-align: center;
}

#slideshow .moodScore, #video .moodScore {
  width: 300px;
}

#video .moodScore {
  background:#fff;
  height:223px;
  margin:5px 0;
  width:300px;
}

.moodScore .moodResult {
  display: inline-block;
  padding: 50px 0 0;
  width: 195px;
  color: #000;
  background: url('http://media.nbcbayarea.com/designimages/nbc_mood_makesus.gif') 20px 15px no-repeat;
}

#slideshow .moodScore .moodResult, #video .moodScore .moodResult {
  float: none;
  width: 255px;
  color: #999;
  background: url('http://media.nbcbayarea.com/designimages/nbc_mood_makesus_b.gif') 50% 15px no-repeat;
}

#video .moodScore .moodResult {
background: transparent url('http://media.nbcbayarea.com/designimages/nbc_mood_makesus.gif') no-repeat scroll 20px 15px;
}

#video .moodScore .moodResult {
  color: #000;
  float: none;
  width: 265px;
}
  
.moodScore .moodResult li {
  float: left;
  border-bottom: 1px solid #e5e5e5;
  padding: 0 0 20px;
  width: 195px;
  font-family: Georgia, serif;
  cursor: pointer;
  height: auto;
}

#slideshow .moodScore .moodResult li, #video .moodScore .moodResult li  {
  border: 0;
  padding: 0 !important;
  width: 85px;
  height: 60px;
}

#video .moodScore .moodResult li  {
	 height: 68px;
}
	
.moodScore .moodResult span {
  display: inline-block;
}

.moodScore .moodResult .score {
  float: left;
  width: 100%;
  text-align: center;
}

* html #slideshow .moodScore .moodResult .score {
  padding-top: 2px;
}

#video .moodScore .moodResult .mood_0, #video .moodScore .moodResult .mood_1, #video .moodScore .moodResult .mood_3, #video .moodScore .moodResult .mood_4 {
	border-right: 1px #e5e5e5 solid;
	border-bottom: 1px #e5e5e5 solid;
	}

#video .moodScore .moodResult .mood_2, #video .moodScore .moodResult .mood_5 {
	border-right: none;
	border-bottom: 1px #e5e5e5 solid;
	}
	
#slideshow .moodScore .moodResult .mood_0, 
#slideshow .moodScore .moodResult .mood_1, 
#slideshow .moodScore .moodResult .mood_3, 
#slideshow .moodScore .moodResult .mood_4 { background: url('http://media.nbcbayarea.com/designimages/dsn_grayLine_38h.gif') 100% 100% no-repeat; }

#slideshow .moodScore .moodResult .mood_0 .score, #video .moodScore .moodResult .mood_0 .score { padding-top: 5px;  height: 40px; }
#slideshow .moodScore .moodResult .mood_1 .score, #video .moodScore .moodResult .mood_1 .score { padding-top: 9px;  height: 36px; }
#slideshow .moodScore .moodResult .mood_2 .score, #video .moodScore .moodResult .mood_2 .score { padding-top: 13px; height: 32px; }
#slideshow .moodScore .moodResult .mood_3 .score, #video .moodScore .moodResult .mood_3 .score { padding-top: 17px; height: 28px; }
#slideshow .moodScore .moodResult .mood_4 .score,
#slideshow .moodScore .moodResult .mood_5 .score, 
#video .moodScore .moodResult .mood_4 .score, #video .moodScore .moodResult .mood_5 .score
 { padding-top: 21px; height: 24px; }

.moodScore .moodResult li .percent {
  vertical-align: top;
}

.moodScore .moodResult .mood_0 .percent { font-size: 60px; }
.moodScore .moodResult .mood_1 .percent { font-size: 50px; }
.moodScore .moodResult .mood_2 .percent { font-size: 40px; }
.moodScore .moodResult .mood_3 .percent { font-size: 30px; }
.moodScore .moodResult .mood_4 .percent,
.moodScore .moodResult .mood_5 .percent,
.moodScore .moodResult .percentsymb     { font-size: 20px; }

#slideshow .moodScore .moodResult .mood_0 .percent, #video .moodScore .moodResult .mood_0 .percent { font-size: 36px; line-height: 40px; }
#slideshow .moodScore .moodResult .mood_1 .percent, #video .moodScore .moodResult .mood_1 .percent { font-size: 32px; line-height: 36px; }
#slideshow .moodScore .moodResult .mood_2 .percent, #video .moodScore .moodResult .mood_2 .percent { font-size: 28px; line-height: 32px; }
#slideshow .moodScore .moodResult .mood_3 .percent, #video .moodScore .moodResult .mood_3 .percent { font-size: 24px; line-height: 28px; }
#slideshow .moodScore .moodResult .mood_4 .percent, #video .moodScore .moodResult .mood_4 .percent,
#slideshow .moodScore .moodResult .mood_5 .percent, #video .moodScore .moodResult .mood_5 .percent, #video .moodScore .moodResult .percentsymb, 
#slideshow .moodScore .moodResult .percentsymb     { font-size: 20px; line-height: 24px; }

.moodScore .moodResult .feeling {
  width: 100%;
  height: 15px;
}

.moodScore .moodResult .furious {        background: url('http://media.nbcbayarea.com/designimages/nbc_mood_fur.gif') 50% 0 no-repeat; }
.moodScore .moodResult .intrigued {      background: url('http://media.nbcbayarea.com/designimages/nbc_mood_intr.gif') 50% 0 no-repeat; }
.moodScore .moodResult .sad {            background: url('http://media.nbcbayarea.com/designimages/nbc_mood_sad.gif') 50% 0 no-repeat; }
.moodScore .moodResult .feeling.bored  { background: url('http://media.nbcbayarea.com/designimages/nbc_mood_bored.gif') 50% 0 no-repeat; }
.moodScore .moodResult .laughing {       background: url('http://media.nbcbayarea.com/designimages/nbc_mood_laught.gif') 50% 0 no-repeat; }
.moodScore .moodResult .thrilled {       background: url('http://media.nbcbayarea.com/designimages/nbc_mood_thr.gif') 50% 0 no-repeat; }

#slideshow .moodScore .moodResult .furious {   background: url('http://media.nbcbayarea.com/designimages/nbc_mood_fur_b.gif') 50% 0 no-repeat; }
#slideshow .moodScore .moodResult .intrigued { background: url('http://media.nbcbayarea.com/designimages/nbc_mood_int_b.gif') 50% 0 no-repeat; }
#slideshow .moodScore .moodResult .sad {       background: url('http://media.nbcbayarea.com/designimages/nbc_mood_sad_b.gif') 50% 0 no-repeat; }
#slideshow .moodScore .moodResult .bored {     background: url('http://media.nbcbayarea.com/designimages/nbc_mood_bor_b.gif') 50% 0 no-repeat; }
#slideshow .moodScore .moodResult .laughing  {  background: url('http://media.nbcbayarea.com/designimages/nbc_mood_lau_b.gif') 50% 0 no-repeat; }
#slideshow .moodScore .moodResult .thrilled {  background: url('http://media.nbcbayarea.com/designimages/nbc_mood_thr_b.gif') 50% 0 no-repeat; }


#video .moodScore .moodResult .furious {background: url('http://media.nbcbayarea.com/designimages/nbc_mood_fur_sm_w.gif') 50% 0 no-repeat;}
#video .moodScore .moodResult .intrigued {background: url('http://media.nbcbayarea.com/designimages/nbc_mood_intr_sm_w.gif') 50% 0 no-repeat;}
#video .moodScore .moodResult .sad {background: url('http://media.nbcbayarea.com/designimages/nbc_mood_sad_sm_w.gif') 50% 0 no-repeat;}
#video .moodScore .moodResult .bored {background: url('http://media.nbcbayarea.com/designimages/nbc_mood_bored_sm_w.gif') 50% 0 no-repeat;}
#video .moodScore .moodResult .laughing {background: url('http://media.nbcbayarea.com/designimages/nbc_mood_laughing_sm_w.gif') 50% 0  no-repeat;}
#video .moodScore .moodResult .thrilled {background: url('http://media.nbcbayarea.com/designimages/nbc_mood_thrilled_sm_w.gif') 50% 0  no-repeat;}


.moodScore .moodResult .number {
  display: none !important;
}

.moodScore .moodSelectContainer {
  float: left;
  padding: 20px 0 0 30px;
  width: 165px;
  height: 40px;
 /* background: url('http://media.nbcbayarea.com/designimages/nbc_your_mood_big.gif') 18px 30px no-repeat; */
}


#video .moodScore .moodSelectContainer {
  padding-top:16px;
}

.moodScore .moodSelectContainer .iam {
    background: url('http://media.nbcbayarea.com/designimages/nbc_your_mood_big.gif') 0px 0px no-repeat;
    width: 30px;
    height: 14px;
    display:block;
  float:left;
  margin-top: 5px;
  padding-left: 5px;
}

.moodScore .moodThankYou {
  float: left;
  padding: 24px 0 0 12px;
  width: 165px;
  height: 36px;
  background: none;
  display: none;
}

.moodScore .moodThankYou  span.thankYouVoted {
  display: block;
  width: 171px;
  height: 34px;
  background: url('http://media.nbcbayarea.com/designimages/nbc_mood_thankyou.gif') 0 0 no-repeat;
}


#ssUtils .moodScore .moodThankYou {
  display: none;
  float: left;
  padding: 24px 12px 0 12px;
  width: 300px;
  height: 36px;
  text-align:center;
  background: none;
}

#ssUtils .moodScore .moodThankYou  span.thankYouVoted {
  display: inline-block;
  width: 250px;
  height: 20px;
  background: url('http://media.nbcbayarea.com/designimages/nbc_mood_thankyou_slideshow.gif') 0 0 no-repeat;
}

#videoContainerRight .moodScore .moodThankYou {
  display: none;
  float: left;
  padding: 24px 12px 0 12px;
  width: 250px;
  height: 36px;
  text-align: center;
  background: none;
}

#videoContainerRight .moodScore .moodThankYou  span.thankYouVoted {
  display: inline-block;
  width: 171px;
  height: 34px;
  background: url('http://media.nbcbayarea.com/designimages/thank-you-for-rating-this-video.gif') 0 0 no-repeat;
} 

* html .moodScore .moodThankYou, * html .moodScore .moodSelectContainer {
  padding-top: 10px;  
  height: 34px;
}

#slideshow .moodScore .moodSelectContainer, #video .moodScore .moodSelectContainer {
  padding-left: 75px;
 /* background: url('http://media.nbcbayarea.com/designimages/nbc_your_mood_big_b.gif') 18px 30px no-repeat; */
}

#slideshow .moodScore .moodSelectContainer .iam  {
  padding-left: 5px;
  background: url('http://media.nbcbayarea.com/designimages/nbc_your_mood_big_b.gif') 0px 0px no-repeat;
}

#video .moodScore .moodSelectContainer .iam {
  padding-left: 5px;
  background: url('http://media.nbcbayarea.com/designimages/nbc_your_mood_big.gif') 0px 0px no-repeat;
} 
.moodScore .moodSelect {
  padding: 2px;
  width: 110px;
  font: bold 12px/14px Arial, helvetica, sans;
  color: #525252;
  float:left;
}

* html .moodScore .moodSelect {
  width: 114px;
}

/********** style for mood aggregate and hover ************/

div.story ul.moodBar li {
  display: inline;
  margin: 0 0 5px;
  padding: 0;   white-space: nowrap;
  list-style-type: none; }

.moodBar .phi .pissed .mood {
  background: none;
}
 
.mood_aggregate_block ul {
  display: block;
  float: left;
  margin: 0 0 0 5px;   padding: 0;   width: auto;   height: 12px;
  color: #fff;
}
  
.mood_aggregate_block li.percent ul {
  margin-left: 0; }
  
.mood_aggregate_block ul li {
  float: left;
  margin: 0;   padding: 0 1px;
  text-align: center;
  background: transparent;
}

.moodResult ul li {
  float: left;
  display: inline;
  margin: 0 0 5px;   padding: 0;   white-space: nowrap;
  list-style-image: none;   list-style-position: inside;   list-style-type: none; }
  
.mood_aggregate_block ul li span {
  display: block;
  float: left;
  margin: 0;   padding: 2px 1px 1px;
  width: 7px;   height: 11px;   font: bold 11px/10px Arial, helvetica, sans;    text-transform: uppercase;
  text-align: center;
  background: #9F0712;
}

.mood_aggregate_block li.percent ul {
  margin-top: 1px;
  top: 0; }

.mood_aggregate_block .aggr_mood_furious li span {   background: #9f0712; }
.mood_aggregate_block .aggr_mood_intrigued li span { background: #6fae1e; }
.mood_aggregate_block .aggr_mood_sad li span {       background: #368dd4; }
.mood_aggregate_block .aggr_mood_bored li span {     background: #6246b1; }
.mood_aggregate_block .aggr_mood_thrilled li span {  background: #dc380f; }
.mood_aggregate_block .aggr_mood_laughing li span {  background: #e0ac25; }

.story .cat_mood {
  display: none;
  padding-left: 0;   background: none; }

.story .cat_mood {
  padding: 1px 0;
  width: auto;   height: 16px;
  text-align: left;
}
  
.mood_aggregate_block .city_abbr_furious_phi {
  float: left;
  width: 10px;
  height: 12px;
}

.mood_aggregate_block .percent {
  margin-left: 30px;
}
  
.mood_aggregate_block .city_abbr_furious_phi span {
  display: block;
  width: 30px;
  height: 16px;
  background: transparent url('http://media.nbcbayarea.com/designimages/nbc_ny_furious.gif') no-repeat 0 0;
}

.mood_aggregate_block .city_abbr_thrilled_phi span {
  display: block;
  width: 30px;
  height: 16px;
  background: transparent url('http://media.nbcbayarea.com/designimages/nbc_ny_thrilled1.gif') no-repeat 0 0;
}

.mood_aggregate_block .city_abbr_sad_phi span {
  display: block;
  width: 30px;
  height: 16px;
  background: transparent url('http://media.nbcbayarea.com/designimages/nbc_ny_sad.gif') no-repeat 0 0;
}

.mood_aggregate_block .city_abbr_bored_phi span {
  display: block;
  width: 30px;
  height: 16px;
  background: transparent url('http://media.nbcbayarea.com/designimages/nbc_ny_bored.gif') no-repeat 0 0;
}

.mood_aggregate_block .city_abbr_intrigued_phi span {
  display: block;
  width: 30px;
  height: 16px;
  background: transparent url('http://media.nbcbayarea.com/designimages/nbc_ny_intrigued.gif') no-repeat 0 0;
}

.mood_aggregate_block .city_abbr_laughing_phi span {
  display: block;
  width: 30px;
  height: 16px;
  background: transparent url('http://media.nbcbayarea.com/designimages/nbc_ny_laughing.gif') no-repeat 0 0;
}

.mood_aggregate_block ul {
  margin: 1px 0 0 3px;
}
 
 
 
 
 
