/*
+----------------------------------------------------------------+
	CSS Reset
+----------------------------------------------------------------+
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
ol,ul {list-style:none;}
a, a:link {text-decoration:none; color: #f43b3c}
a:hover{text-decoration:underline; color: #863b3c}
a:visited {color: #d30102}
a:active {color: #B96264}

/*
+----------------------------------------------------------------+
	Class
+----------------------------------------------------------------+
*/
.fr {float: right;}
.borderNone {border: none;}
.textLeft {text-align: left;}
.textCenter {text-align: center;}
a.saibaMais {float: right; text-align: right; width: 100%; font: 700 11px arial; color: #008672; background: url(../imagens/mais.jpg) no-repeat center right; padding: 3px 15px 3px 0;}
.listaForm label.error, .erro {color: red; font-size: 11px;}
.colorVervelho {font-size: 11px; color: red; font-weight: 700;}

/*
+----------------------------------------------------------------+
	Mensagens de alerta
+----------------------------------------------------------------+
*/
.statusNaoRealizado, .statusRealizado, .statusAlerta {float: left; clear: both; border:solid 1px #EDDBB1; padding:15px 30px 15px 50px; font-weight:700; width:85%; margin:0 0 5px 0px;}
.statusNaoRealizado {color:#8A1F11; background:#FBE3E4 url(../imagens/icones/erro-ico.jpg) no-repeat 10px center; border: solid 2px #FBC2C4;}
.statusRealizado {color:#264409; background:#E6EFC2 url(../imagens/icones/confirme-ico.jpg) no-repeat 10px center; border: solid 1px #C6D880;}
.statusAlerta {color:#514721; background:#FFF6BF url(../imagens/icones/alerta-ico.jpg) no-repeat 10px center; border: solid 1px #FFD324;}

/*
+----------------------------------------------------------------+
	Galery Style
+----------------------------------------------------------------+
*/
.photo {position: relative; width: 125px; height: 85px; float: left;}
.photo img { margin: 3px 0 0 0;}
.sample6 span {width: 133px; height: 96px; display: block; position: absolute; top: -5px; left: -5px; background: url(../imagens/molduraImg.png) no-repeat;}

/*
+----------------------------------------------------------------+
	Geral
+----------------------------------------------------------------+
*/
body {background: #EBDFC5 url(../imagens/bg_site.jpg) no-repeat center top}
#site {width: 840px; margin: 0 auto; padding: 33px 0; font: normal 12px tahoma; }

/* Títulos */
.titInterna {background-repeat: no-repeat; text-indent: -9000px; float: left; clear: both;}
.tit-carnaval10 {width: 188px; background-image: url(../imagens/titulos/carnaval10.jpg);}
.tit-programacao {width: 200px; height: 25px; background-image: url(../imagens/titulos/programacao.jpg);}
.tit-imagens {width: 120px; height: 25px; background-image: url(../imagens/titulos/imagens.jpg);}
.tit-aCobra {width: 210px; height: 25px; background-image: url(../imagens/titulos/aCobra.jpg);}
.tit-listaVideos {width: 210px; height: 25px; background-image: url(../imagens/titulos/listaVideo.jpg);}
.tit-videos {width: 210px; height: 25px; background-image: url(../imagens/titulos/videos.jpg);}
.tit-facaPedido {width: 210px; height: 25px; height: 25px; background-image: url(../imagens/titulos/facaPedido.jpg);}
.tit-listaCds {width: 210px; background-image: url(../imagens/titulos/listaCds.jpg);}
.tit-faleConosco {width: 210px; background-image: url(../imagens/titulos/faleConosco.jpg);}
.tit-destaque {width: 210px; background-image: url(../imagens/titulos/destaque.jpg);}

/*
+----------------------------------------------------------------+
	Cabeçalho
+----------------------------------------------------------------+
*/
#cabecalho {float: left; clear: both; width: 810px; margin: 0 0 0 16px; overflow: auto;}
#cabecalho #containerHead {float: left; clear: both; width: 100%;}
#cabecalho #containerHead h1 {float: left; width: 286px; height: 95px; margin: 0 73px 0 0; background: url(../imagens/logo.jpg) no-repeat;}
#cabecalho #containerHead h1 a {display: block; width: 100%; height: 90px; text-indent: -9000px;}
#cabecalho #bannerPublicidade {float: left; width: 450px; margin: 6px 0 0 0;}

/* Menu */
#menu {float: left; clear: both; width: 806px; margin: 22px 0 14px 0;}
#menu li {float: left; width: auto;}
#menu li~li{background: url(../imagens/menu/divisor.jpg) no-repeat left center;}
#menu li a {display: block; height: 22px; text-indent: -9000px;}
#menu li.home a {width: 65px; padding: 0 10px 0 0; background: url(../imagens/menu/home.jpg) no-repeat 0 0;}
#menu li.programacao a {width: 149px; padding: 0 9px 0 13px; background: url(../imagens/menu/programacao.jpg) no-repeat 14px 0;}
#menu li.imagens a {width: 99px; padding: 0 9px 0 13px; background: url(../imagens/menu/imagens.jpg) no-repeat 14px 0;}
#menu li.videos a {width: 78px; padding: 0 9px 0 13px; background: url(../imagens/menu/videos.jpg) no-repeat 14px 0;}
#menu li.comprarCD a {width: 146px; padding: 0 9px 0 13px; background: url(../imagens/menu/compraCD.jpg) no-repeat 14px 0;}
#menu li.faleConosco a {width: 149px; padding: 0 9px 0 13px; background: url(../imagens/menu/faleConosco.jpg) no-repeat 14px 0;}
#menu li a:hover {background-position: 14px -24px;}
#menu li.home a:hover {background-position: 0px -24px;}

/* Banner principal */
#bannerPrincipal {float: left; clear: both; width: 808px; height: 238px; margin: 0 0 30px 0; padding: 16px; overflow: auto; background: url(../imagens/molduraBanner.jpg) no-repeat;}
#bannerPrincipal li {position: absolute;}
#bannerPrincipal .imagem  {float: left;}

/*
+----------------------------------------------------------------+
	Corpo do site
+----------------------------------------------------------------+
*/
#corpo {float: left; clear: both; width: 840px; overflow: auto;}
.boxConteudo {float: left; width: 475px; }
.boxConteudoSecundario {float: left; width: 300px; padding: 0 15px; margin: 0 20px 0 0;}
.boxConteudoSecundario img {margin: 0 0 10px 0;}

/* Box que recebe texto formatado */
.recebeTexto {float: left; clear: both; margin: 25px 0 0 0; width: 100%; line-height: 20px;}
.recebeTexto h1, .recebeTexto h2, .recebeTexto h3, .recebeTexto h4, .recebeTexto h5, .recebeTexto h6 {color: #007379; margin: 0 0 10px 0; width: 100%; float: left; clear: both;}

/* Carnaval 2010 INDEX */
.carnaval2010 {float: left; clear: both; width: 300px; height: 320px; padding: 0 15px; margin: 0 20px 0 0; background: url(../imagens/bgCarnaval10.jpg) no-repeat 0 45px;}
.carnaval2010 .conteudo {float: left; clear: both; width: 250px; padding: 50px 0 0 35px;}

/* Programação */
.listaProgramacao {float: left; clear: both; width: 475px; margin: 15px 0 0 0;}
.listaProgramacao li {float: left; clear: both; width: 100%; padding: 10px 0;}
.listaProgramacao li~li {background: url(../imagens/divisorProg.jpg) no-repeat center top;}
.listaProgramacao li .data {float: left; background: url(../imagens/bgDataProg.jpg) no-repeat; font: 700 12px arial; color: #fff; padding: 15px 20px; text-align: center; line-height: 12px;} 
.listaProgramacao li h3{font-size: 13px; margin: 7px 0 0 0; color: #007379;}

/* Imagens INDEX*/
.boxImagens {float: left; clear: both; width: 810px; margin: 10px 0 0 16px;}

/* Lista Imagens */
.boxImagens .listaImg {background: url(../imagens/sombraImgIndex.jpg) no-repeat center bottom; float: left;}
.boxImagens .listaImg li {margin: 0; padding: 0 0 0 35px;}
.listaImg {float: left; clear: both; width: 100%; margin: 20px 0 0 0; padding: 0 0 18px 0;}
.listaImg li {float: left; width: 120px; margin: 0 0 35px 0; padding: 0 28px 0 10px; text-align: center;}

/* Lista CDs */
.listaCDs {float: left; clear: both; width: 300px; margin: 30px 0 0 0;}
.listaCDs li {float: left; clear: both; width: 100%; line-height: 17px; margin-bottom: 15px;}
.listaCDs li img {float: left; margin: 0 10px 10px 0;}
.listaCDs li strong {color: #007279; font-size: 13px; display: block;}

/* Lista Form */
.listaForm {float: left; clear: both; margin: 25px 0 0 0; width: 100%;}
.listaForm li {float: left; clear: both; margin: 0 0 10px 0; width: 100%;}
.listaForm li label {display: block; width: 100%; font-weight: 700; color: #007279; font-size: 13px; margin: 0 0 5px 0;}
.listaForm .campoGrande {width: 95%;}
.listaForm .campoMedio {width: 70%;}
.listaForm .campoPequeno {width: 25%;}
.listaForm .campoGrande, .listaForm .campoMedio, .listaForm .campoPequeno, .listaForm textarea  {border: solid 2px #007279; padding: 3px; color: #666; font-size: 13px;}
.listaForm .campoGrande:hover, .listaForm .campoMedio:hover, .listaForm .campoPequeno:hover, .listaForm textarea:hover,
.listaForm .campoGrande:focus, .listaForm .campoMedio:focus, .listaForm .campoPequeno:focus, .listaForm textarea:focus {border: solid 2px #00C0CA;}
.listaForm .campoGrande:focus, .listaForm .campoMedio:focus, .listaForm .campoPequeno:focus, .listaForm textarea:focus {background: #ECFAEB; font-weight: 700;}
.listaForm .botaoGradiente {background: #137E81 url(../imagens/botaoGradiente.jpg) repeat-x; border: none; padding: 5px 8px; color: #fff; font-weight: 700; border: solid 1px #11595B;}

/*
+----------------------------------------------------------------+
	Vídeos
+----------------------------------------------------------------+
*/
/* Lista de vídeos */
.listaVideos {width: 100%; padding: 4px; margin: 5px 0;}
.listaVideos, .listaVideos li {float: left; clear: both; overflow: auto;}
.listaVideos li {padding: 15px 0 10px 0px; margin: -10px 0 10px 0; width: 95%;}
.listaVideos li~li {background: url(../imagens/divisorProg.jpg) no-repeat left top;}
.listaVideos li a {display: block; padding: 0 0 0 10px; color: #333; line-height: 16px; width: 95%}
.listaVideos li a img {float: left; margin: 0 10px 0px 0; border: solid 2px #654423;}
.listaVideos li a:hover img {border: solid 2px #15BF15;}
.listaVideos li a h3 {margin: 0; font-size: 12px;}
.listaVideos li a p {font-size: 11px; color: #333;}
/* Hack Chrome e Safari */
@media screen and (-webkit-min-device-pixel-ratio:0){.listaVideos {margin: 5px 0 175px 0;}}

/* Descrição do vídeo em execução */
.descricaoVideo {float: left; clear: both; width: 470px; margin: 25px 0 0 0;}
.descricaoVideo h3, .descricaoVideo p {display: block; width: 100%;}
.descricaoVideo h3 {color: #0D740B;}
.descricaoVideo p  {color: #735B31;}

/* Player de vídeo */
.boxConteudoVideo {float: left; width: 400px; height: 500px; padding: 0 0 0 10px;}
#player {float: left; clear: both; width: 400px; margin: 10px 0 0 0;}

/* Box de lista de vídeos (jScrollPane) */
.jScrollPaneContainer {position: relative; overflow: hidden; z-index: 1;}
.jScrollPaneTrack {position: absolute; cursor: pointer; right: 0; top: 0; height: 100%; background: #D1C092;}
.jScrollPaneDrag {position: absolute;background: #69582C; cursor: pointer; overflow: hidden;}
.jScrollPaneDragTop {position: absolute; top: 0; left: 0; overflow: hidden;}
.jScrollPaneDragBottom {position: absolute; bottom: 0; left: 0; overflow: hidden;}
a.jScrollArrowUp {display: block; position: absolute; z-index: 1; top: 0; right: 0; text-indent: -2000px; overflow: hidden; background:#E7D9BE url(../imagens/scrollTop.gif) no-repeat left top; height: 9px;}
a.jScrollArrowUp:hover {/*background-color: #f60;*/}
a.jScrollArrowDown {display: block; position: absolute; z-index: 1; bottom: 0; right: 0; text-indent: -2000px; overflow: hidden; background:#E7D9BE url(../imagens/scrollBottom.gif) no-repeat left top; height: 9px;}
a.jScrollArrowDown:hover {/*background-color: #f60;*/}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/}
.holder { background: #E9E0C9; float: left; margin: 0px; width: 300px; height: 340px; border: solid 2px #B5984A;}
.scroll-pane {width: 300px; overflow: auto; float: left;}
#pane2 {height: 340px;}

/*
+----------------------------------------------------------------+
	Rodapé
+----------------------------------------------------------------+
*/
#rodape {float: left; clear: both; width: 840px; margin: 20px 0 0 0; padding: 5px 0 20px 0; font: normal 10px verdana; border-top: solid 2px #dacdb3; color: #af8f3d;}
#rodape .infoRodape {float: left; width: 550px;}
#rodape .infoRodape .p4 {margin: 5px 0; float: left;}
#rodape .listaLinks {float: right; width: 250px; margin: 10px 0 0 0;}
#rodape .listaLinks li {float: right; width: auto; margin: 0 5px;}