/**
 * 	@author:
 *	2010 Eric Mantoani <eu@eric.com.br>
 * 	
 * 	@comment:	
 * 
 * 	@documentation:
 * 	http://eric.com.br/doc/css/
 * 	
 * 	@resume:
 *	Hierarquia para declaração de propriedades css
 *	1. Posicionamento; >> position, top, right, bottom, left, z-index
 *	2. Fluxo; >> float, clear 
 *	3. Dimensões; >> width, height, overflow
 *	4. Margens e etc; >> margin, padding, outline, list-style
 *	5. Display; >> display, visibilty
 *	6. Tipografia; >> font, line-height, text, word-spacing, letter-spacing, vertical-align, color
 *	7. Background;
 *	8. Outros; >> opacity, cursor, content, quotes  
 *
 * 	Date: 21/01/2010
 * 	Revision: 1
 */

.center{text-align:center;}

div.margin10{height:10px; width:100%;}
.small{font-size:11px;}

#banner1{margin-left:42px;}

/* default */
body { font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#333; line-height:20px;}
a{text-decoration:none;}
.wrap,
#wrap{ position:relative; width:990px; margin:auto; }
img.youthumb{ width:88px; height:58px; }
p{margin-bottom:20px;}


#content #main #bar #compartilhe.element ul a,
#content #main #texto #compartilhe.element ul a{ float:left; width:22px; height:22px; margin-right:6px; background-repeat:no-repeat; cursor:pointer; }
	#compartilhe ul a#twitter{ background-image:url('../_img/ico-twitter.gif'); }
	#compartilhe ul a#facebook{ background-image:url('../_img/ico-facebook.gif'); }
	#compartilhe ul a#digg{ background-image:url('../_img/ico-digg.gif'); }
	#compartilhe ul a#delicious{ background-image:url('../_img/ico-delicious.gif'); }
	#compartilhe ul a#reddit{ background-image:url('../_img/ico-reddit.gif'); }
	#compartilhe ul a#blogger{ background-image:url('../_img/ico-blogger.gif'); }
	#compartilhe ul a#myspace{ background-image:url('../_img/ico-myspace.gif'); }
	#compartilhe ul a#orkut{ background-image:url('../_img/ico-orkut.gif'); }
	
	#compartilhe #url{border:1px solid #404040; }

/* CONTENT programas */
#content.programas{ width:100%; }

#content.programas h1{ padding:5px 0; font-size:20px; font-weight:bold; }
#content.programas h2{ padding:5px 0; font-size:24px; font-weight:bold; }
#content.programas h1 a,
#content.programas h2 a{ color:#000; }
#content.programas a{ color:#a1a1a1; }
#content.programas li{list-style:none;}

#content.programas h2.content-title{ color:#505050; margin:20px 0; }

img{margin:10px 0;}

#content.programas #main{ float:left; width:805px; }
#content.programas #main .header{ float:left; width:805px; border-bottom:1px #d5d5d5 solid; }
#content.programas #main .logo{ float:left; }
#content.programas #main .menu{ float:right; }
#content.programas #main .menu ul{ margin-top:30px; }
#content.programas #main .menu ul li{ float:left; margin:0 5px; padding:2px; height:17px; background:url(../_img/i-programas-menu-bg.gif) repeat-x; }
#content.programas #main .menu ul li .bg-left{ float:left; margin:-2px 0 0 -2px; height:21px; width:3px; background:url(../_img/i-programas-menu-bg-left.gif) no-repeat; }
#content.programas #main .menu ul li a{ float:left; margin:0 3px; color:#5e5e5e; font-size:11px; }
#content.programas #main .menu ul li .bg-right{ float:right; margin:-2px -3px 0 0; height:21px; width:3px; background:url(../_img/i-programas-menu-bg-right.gif) no-repeat; }
#content.programas #main .credito{ float:left; font-size:smaller; color:#000;}
#content.programas #main .credito .source{ color:#a1a1a1; }

#content.programas #main img.big{margin-top:10px;}
#content.programas #main #texto{ float:left; padding-top:10px; width:700px; /*white-space:pre-line;*/ }

#content.programas #main #texto .autor{ color: #999; font-size:12px; margin-bottom:30px; }
#content.programas #main #texto .nome{ text-transform:uppercase; }
#content.programas #main #texto .data{ clear:both; margin-top:30px; color: #999; font-size:smaller; }
#content.programas #main #texto .respiro{ height:22px; }
#content.programas #main #texto .element{ margin-top:30px; }
#content.programas #main #texto h4{ font-size:18px; font-weight:bold; line-height:30px; color:#505050; }
#content.programas #main #texto #compartilhe.element ul li{ float:left; width:22px; height:22px; margin-right:6px; background-repeat:no-repeat; cursor:pointer; }

#content.programas #main #texto #comment.element .single-comment{ padding:10px; margin:6px 0; background-color:#ebf2f8; }
#content.programas #main #texto #comment.element .single-comment img{ max-width:80px; max-height:80px; }
#content.programas #main #texto #comment.element .single-comment .avatar{ float:left; }
#content.programas #main #texto #comment.element .single-comment .comment_comment{ float:right; width:430px; }
#content.programas #main #texto #comment.element .single-comment .comment_comment p.pre{width:430px; white-space:pre-line;}

#content.programas #main #bar{ float:right; width:78px; margin-left:10px; }

#agenda{margin:10px; width:240px; font-size:12px;}
#agenda h3{margin-top:25px; font-size:22px; font-weight:bold; text-align:center}
#agenda h4{margin-top:10px; font-size:18px; font-weight:bold;}
#agenda li{margin:10px 0;}

/** Audio Player  */
/* Se for mexer aqui, dá uma revisada no controle-remoto.css também */
#player_container { position:relative; width:262px; height:82px; background-image:url('../_img/jPlayer/container.gif'); background-repeat:no-repeat; }
#player_container  ul#player_controls {	padding:0; margin:0; list-style-type:none; }
#player_container  ul#player_controls li { overflow:hidden; text-indent:-9999px; }

#player_play,
#player_pause { position:absolute; top:0; left:0; margin:6px 44px; display: block; width:32px; height:32px; cursor: pointer; }

#player_play { background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0 -1px no-repeat; }
#player_play.jqjp_hover { background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") -34px -1px no-repeat; }

#player_pause {	background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0 -35px no-repeat; }
#player_pause.jqjp_hover { background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") -34px -35px no-repeat;}

#ctrl_prev { position: absolute; top:0; left:0; margin:10px 0 0 12px; width:27px; height:27px; background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0 -69px no-repeat;  cursor: pointer; }
#ctrl_prev:hover { background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") -28px -69px no-repeat; }

#ctrl_next { position: absolute; top:0; left:0; margin:10px 0 0 80px; width:27px; height:27px; background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0 -96px no-repeat;  cursor: pointer; }
#ctrl_next:hover { background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") -28px -96px no-repeat; }

#player_stop { position: absolute; top:0; left:0; margin:10px 0 0 120px; width:27px; height:27px; background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0 -123px no-repeat;  cursor: pointer; }
#player_stop:hover { background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") -28px -123px no-repeat; }

#player_volume_max,
#player_volume_min { position: absolute; top:0; left:0; margin:12px 0 0 170px; width:25px; height:25px; background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0 -150px no-repeat; cursor: pointer; }

#player_volume_max.jqjp_hover,
#player_volume_min.jqjp_hover {	background: url("../_img/jPlayer/radiocultura-player-ctrl.jpg") 0px -150px no-repeat; }

#player_volume_bar { position: absolute; top:0; left:0; margin:20px 0 0 196px; background: url("../_img/jPlayer/volume_bar.gif") repeat-x top left; width:46px; height:8px; cursor: pointer; }
#player_volume_bar_value { background: url("../_img/jPlayer/volume_bar_value.gif") repeat-x top left; width:0px; height:8px; }

#play_time { position: absolute; top:0; left:0; margin:56px 0 0 15px; font-size:11px; }
#total_time { position: absolute; top:0; left:0; margin:56px 0 0 212px; font-size:11px; }

#player_progress { position: absolute; top:0; left:0; margin:56px 0 0 55px; width:146px; height:15px; }
#player_progress_load_bar { background: url("../_img/jPlayer/bar_load.gif")  top left repeat-x; width:0px; height:15px; cursor: pointer; }
#player_progress_load_bar.jqjp_buffer { background: url("../_img/jPlayer/bar_buffer.gif")  top left repeat-x; }
#player_progress_play_bar { background: url("../_img/jPlayer/bar_play.gif") top left repeat-x ; width:0px; height:15px; }

/** Playlist */
#culturaPlaylist{ padding:10px; margin-bottom:12px; margin-left:4px; width:235px; background-color:#f1f1f1; }
#culturaPlaylist ul{ margin:8px 0; }
#culturaPlaylist ul li{ font-size:12px; font-weight:lighter; color:#5a5a5a; cursor:pointer; }
#culturaPlaylist ul li.nome-musica{ float:left; margin-bottom:5px; width:200px; font-size:11px; }
#culturaPlaylist ul li.fechar-musica{ float:right; }
#culturaPlaylist ul .nowPlaying{ font-weight:bold; }
#culturaPlaylist .divisor{ clear:both; height:1px; width:100%; background-color:#d7d7d7; }

/*
 	<div id="culturaPlaylist">
		<ul id="media_id_$id">
			<input value="$id" type="hidden">
			<input value="$file.mp3" type="hidden">
			<li class="left" onclick="Player.playNow($id, '$file.mp3')">$name</li>
			<li class="right" onclick="Playlist.removeItem($id)"> [x] </li>
			<div class="clear divisor"></div>
		</ul>
	</div>
*/