/*  
Theme Name: WI Marcelo Vieira HTML5
Theme URI: http://www.marcelovieira.blog.br/
Description: Tema HTML5 customizado para o jornalista Marcelo Vieira
Version: 1.0
Author: Wersus Interactive!
Author URI: //twitter.com/wersus/
Tags: blue, html5, css3, jQuery, wersus
0O RESET
01 ESTRUTURA
02 CABECALHO
03 CONTEUDO
04 LATERAL
05 RODAPE
*/
/********************************************
0O RESET
 ********************************************/
* { margin:0; padding:0; border:none; list-style:none; text-decoration:none; }
header, section, article, nav, aside, footer, dialog, figure, figcaption, hgroup { display:block; }
/********************************************
01 ESTRUTURA
 ********************************************/
body { font:normal .95em/1.4em arial, helvetica, sans-serif; color:#333; background:url(images/bg-body.gif) repeat-x left 48px;}
#geral { width:990px; margin:auto; }
#cabecalho { position:relative; height:300px; background:url(images/bg-cabecalho.png) no-repeat 727px top; }
#superbanner { width:728px; height:110px; margin:-4.2em 0 1.5em 0; z-index:0; overflow:hidden !important; }
#conteudo { float:left; width:675px; margin:0 0 3em 0; }
#lateral { float:left; width:290px; margin:0 0 0 1em; font-size:.9em; color:#999; }
#rodape { float:left; clear:both; width:100%; min-width:990px; height:119px; margin:2em auto; color:#c6c6c6; background:#f3f3f3 url(images/bg-rodape.gif) repeat-x left top; }
/******************************************** 
02 CABECALHO
 ********************************************/
#superbanner h5 { font-size:.7em; color:#ccc; text-align:left; }
#superbanner img { }
#cabecalho hgroup { float:left; margin:75px 0 0; }
#cabecalho hgroup .logo a,
#cabecalho hgroup .logo a:visited { display:block; width:581px; height:46px; text-indent:-9000px; background:url(images/marca-marcelo-vieira.png) no-repeat left top; }
#cabecalho hgroup .logo a:hover,
#cabecalho hgroup .logo a:focus { background:url(images/marca-marcelo-vieira.png) no-repeat left -46px; }
#cabecalho hgroup .tagline { display:none; }
/* NAVEGACAO CABECALHO */
#cabecalho nav { position:absolute; top:157px; left:0; }
#cabecalho nav ul li { float:left; margin:0 1.8em 0 0; }
#cabecalho nav ul li a { line-height:1.1em; font:bold .85em 'trebuchet ms', arial, helvetica, sans-serif;  text-transform:uppercase; color:#fff; }
#cabecalho nav ul li a:hover,
#cabecalho nav ul li a:focus { color:#222; }
/* FORMULARIO DE BUSCA */
#cabecalho form { position:absolute; top:148px; left:280px; width:302px; height:38px; background:url(images/bg-buscar.gif) no-repeat right top; }
#cabecalho form legend,
#cabecalho form strong { display:none; }
#cabecalho form #s { width:212px; margin:5px 0 0 5px; padding:.27em; font-size:1em; border:1px solid #f3f3f3; color:#666; }
#cabecalho form #searchsubmit { width:67px; height:28px; margin:5px 0 0; font:bold .85em 'trebuchet ms', arial, helvetica, sans-serif; text-transform:uppercase; vertical-align:top; color:#fff; background:url(images/botoes-comentarios.gif) no-repeat left top; cursor:pointer; }
#cabecalho form #searchsubmit:focus,
#cabecalho form #searchsubmit:hover { color:#000; background:none; }
/* CATEGORIA LOCALIZACAO | RESULTADOS DA BUSCA | TAG USUARIO */
.categoria-localizacao,
.resultados-da-busca,
.tag-usuario { position:absolute; bottom:26px; left:260px; font:normal 1.2em 'trebuchet ms', arial, helvetica, sans-serif; line-height:1.1em; text-transform:uppercase; }
.resultados-da-busca span,
.tag-usuario span{ color:#999; }
/********************************************
03 CONTEUDO
 ********************************************/
/* POSTS */
#conteudo article { display:block; position:relative; float:left; clear:both; width:100%; margin:0 0 2.5em; padding:1em; border:1px solid #f3f3f3; background:url(images/bg-article.png) repeat-x left top; }
#conteudo article .tag-o-malagueta { display:block; width:675px; height:90px; overflow:hidden; background:url(images/o-malagueta.jpg) no-repeat 0 0; }
#conteudo article a:link,
#conteudo article a:visited { color:#f90; }
#conteudo article a:focus,
#conteudo article a:hover { color:#000; }
#conteudo article header h1 { display:block; width:590px; margin:0 0 .2em; font-size:2.3em; line-height:1em; letter-spacing:-.01em; font-weight:bold; }
#conteudo article header .informacoesdopost { font-size:.8em; font-weight:bold; color:#c6c6c6; }
#conteudo article header .informacoesdopost time { margin:0 .7em; padding:0 .7em; border-right:1px solid #f3f3f3; border-left:1px solid #f3f3f3; }
#conteudo article header .interacao { position:absolute; top:16px; right:14px; }
#conteudo article header .interacao .comments a { display:block; width:32px; height:31px; padding:5px 0 0; text-align:center; background:url(images/botoes-comentarios.gif) no-repeat -2px -56px; color:#fff; }
#conteudo article header .interacao .comments a:focus,
#conteudo article header .interacao .comments a:hover { background:none; color:#000;}
#conteudo article .post { float:left; margin:1em 0 0; }
#conteudo article .post p { margin:0 0 1.5em; }
#conteudo article .interacoes { display:block; clear:both; height:20px; margin:0 0 1em; padding:.5em; background-color:#f3f3f3; }
#conteudo article .interacoes h5 { float:left; font:normal 1.2em 'trebuchet ms', arial, helvetica, sans-serif; line-height:1.1em; text-transform:uppercase; color:#666; }
#conteudo article .interacoes ul { float:left; }
#conteudo article .interacoes ul li a { margin:0 0 0 1.5em; font-size:.8em; font-weight:bold; }
#conteudo article .tags {font-size:.8em; font-weight:bold; color:#c6c6c6; }
#conteudo article h2,
#conteudo article h3 { margin:0 0 .8em; font-size:1.6em; font-weight:normal; line-height:1.1em; }
/* PAGINACAO */
.wp-pagenavi { clear:both; float:left; margin:0 0 1em; line-height:1.1em; }
.wp-pagenavi a,
.wp-pagenavi a:link { margin:0 .2em; padding:.6em; font-weight:bold; color:#f90; }
.wp-pagenavi a:focus,
.wp-pagenavi a:hover { color:#000; }
.wp-pagenavi a:active { padding:.6em; }
.wp-pagenavi span.pages { display:none; }
.wp-pagenavi a.page { border:1px solid #f3f3f3; }
.wp-pagenavi span.current { padding:.6em; font-weight:bold; color:#ccc; }
.wp-pagenavi span.extend { padding:.6em; }
.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink { font:bold .8em 'trebuchet ms', arial, helvetica, sans-serif line-height:1.1em; text-transform:uppercase; border:none; }
/* COMENTARIOS */
.subcomment { clear:both; font-size:.85em; }
.commentlist { margin-bottom:2em; width:650px; }
.commentlist li { border-top:.1em solid #f3f3f3; border-right:.1em solid #f3f3f3; border-bottom:.5em solid #f3f3f3; border-left:.1em solid #f3f3f3; padding:1.2em; margin:1em 0; }
.commentlist a:link,
.commentlist a:visited { color:#f90; }
.commentlist a:focus,
.commentlist a:hover { color:#000; }
.comentador { float:left; height:48px; width:400px; }
.commentlist li cite { color:#6d6d6d; display:block; font-size:1.4em; font-style:normal; }
html>body .commentlist li cite { padding-top:6px; }
.commentlist li p { clear:left; font-size:0.9em; margin:0; padding:.3em 0 0; }
html>body .commentlist li p { padding:.6em 0 0; }
.commentmetadata  { color:#6d6d6d; font-size:0.75em; }
#commentform { padding-top:15px; }
#commentform legend { display:none; }
#commentform label { display:block; color:#999; font:.9em 'trebuchet ms', arial, sans-serif; margin-bottom:4px; }
#commentform label .oculto { display:none; }
.contactform p { margin: 0; }
#comment, #wpcf_msg { height:150px; padding:4px; margin-bottom:20px; vertical-align:middle; font-size:.8em; border:.1em solid #f3f3f3;}
#author, #email, #url, #new_email, #wpcf_your_name, #wpcf_email, #wpcf_website, #comment  { background-color:#f3f3f3; border-top:1px solid #cecece; border-left:1px solid #cecece; border-bottom:1px solid #f3f3f3; border-right:1px solid #f3f3f3; color:#666; padding:4px; width:645px;}
#submit { width:86px; height:27px; margin:6px 0 0; font:bold .8em 'trebuchet ms', arial, helvetica, sans-serif; text-transform:uppercase; vertical-align:top; color:#fff; background:url(images/botoes-comentarios.gif) no-repeat left -28px; cursor:pointer; }
#submit:focus,
#submit:hover { color:#000; background:none;}
#respond { font:font:bold .8em 'trebuchet ms', arial, helvetica, sans-serif; line-height:1.1em; text-transform:uppercase; color:#999; }
/* CONTATO */
.text-contato { background-color:#f3f3f3; border-top:1px solid #cecece; border-left:1px solid #cecece; border-bottom:1px solid #f3f3f3; border-right:1px solid #f3f3f3; color:#666; padding:4px; width:610px; }
.bt-enviar { width:67px; height:28px; margin:5px 0 0; font:bold .8em 'trebuchet ms', arial, helvetica, sans-serif; text-transform:uppercase; vertical-align:top; color:#fff; background:url(images/botoes-comentarios.gif) no-repeat left top; cursor:pointer; }
.bt-enviar:focus,
.bt-enviar:hover { color:#000; background:none; }
/********************************************
04 LATERAL
 ********************************************/
#lateral h3 { font:normal 1.2em 'trebuchet ms', arial, helvetica, sans-serif; line-height:1.1em; text-transform:uppercase; color:#666; }
#lateral a:link,
#lateral a:visited { color:#f90; }
#lateral a:focus,
#lateral a:hover { color:#000; }
/* TWITTER */
.twitter { float:left; clear:both; width:220px; margin:0 0 2em 3em; padding:.6em; border:1px solid #f3f3f3; background:url(images/ico-twitter.jpg) no-repeat 6px 10px; }
.twitter p { margin:0 0 0 2em; color:#999; }
.twitter p a,
.twitter p a:visited { color:#f90; }
.twitter p a:focus,
.twitter p a:hover { color:#000; }
.twitter p span a { margin:0 0 0 1em; padding:0 0 0 1em; font-size:.82em; font-weight:bold; text-transform:uppercase; border-left:1px solid #f3f3f3; }
/* ENQUETE */
#lateral #enquete { float:left; width:240px; margin:.5em 0 2em 3em; }
#lateral #enquete h3 { margin:.2em 0; font-size:1.2em; font-weight:normal; color:#666; }
#lateral #enquete ul { margin:.6em 0; }
#lateral #enquete ul li { margin:.2em 0; }
#lateral #enquete .bt-enquete { display:block; float:left; margin:0 1em 0 0; padding:.4em .6em; font-size:.7em; font-weight:normal; text-transform:uppercase; background:transparent; color:#000; cursor:pointer; }
#lateral #enquete .bt-enquete:hover,
#lateral #enquete .bt-enquete:focus { color:#fff; background-color:#000; }
/* COMENTARIOS RECENTES */
.comentarios-recentes { float:left; clear:both; width:240px; margin:1em 0 2em 3em; overflow:hidden; }
.comentarios-recentes h3 { margin:0 0 .4em; }
.comentarios-recentes li { display:block; padding:.2em 0; border-bottom:1px solid #f3f3f3; }
/* CATEGORIAS */
.categorias { float:left; width:240px; margin:0 0 2em 3em; }
.categorias ul { margin:.6em 0; }
.categorias ul li { float:left; width:114px; margin:0 6px 0 0; }
.categorias ul li a { display:block; padding:.2em 0; border-bottom:1px solid #f3f3f3; }
/* BLOGROLL */
.blogroll { float:left; clear:both; width:240px; margin:0 0 2em 3em;}
.blogroll ul { margin:.6em 0; }
.blogroll ul li { float:left; width:114px; margin:0 6px 0 0; }
.blogroll ul li a { display:block; padding:.2em 0; border-bottom:1px solid #f3f3f3; }
/* TAGS */
.tags { float:left; clear:both; width:190px; margin:0 0 2em 3em;}
/* ARQUIVOS */
.archive { float:left; clear:both; width:240px; margin:0 0 2em 3em;}
.archive select { width:240px; margin:.6em 0; padding:.3em; border-top:1px solid #cecece; border-right:1px solid #f3f3f3; border-bottom:1px solid #f3f3f3; border-left:1px solid #cecece; background-color:#f3f3f3; }
/* POSTS RECENTES */
.posts-recentes { float:left; clear:both; width:240px; margin:0 0 2em 3em; }
.posts-recentes li a { display:block; padding:.2em 0; border-bottom:1px solid #f3f3f3; }
/* IMAGES */
.alignleft, img.alignleft { display: inline; float:left; margin:0 1em .4em 0; }
.alignright, img.alignright { display: inline; float:right; margin:0 0 .4em 1em; }
.aligncenter, img.aligncenter { display:block; clear:both; margin-left:auto; margin-right:auto; }
.wp-caption { padding-top:.3em; border:1px #000; text-align:center; -moz-border-radius: 3px; -khtml-border-radius:3px; -webkit-border-radius:3px; color:#fff; background-color:#000; }
.wp-caption img { margin:0; padding:0; border:0 none; }
.wp-caption p.wp-caption-text { margin:0; padding:0 .4em .5em; font-size:.8em; line-height:1.5em; }
/* PUBLICIDADE */
#publicidade { margin:0 0 2em 3em; }
#publicidade h5 { margin:0 0 .2em; font-size:.8em; color:#ccc; }
/********************************************
05 RODAPE
 ********************************************/
#rodape div { position:relative; width:990px; margin:auto; }
/* NAVEGACAO RODAPE */
#rodape ul { position:absolute; top:60px; }
#rodape ul li { float:left; margin:0 3em 0 0; }
#rodape a { font:bold .8em 'trebuchet ms', arial, helvetica, sans-serif; line-height:1.1em; text-transform:uppercase; color:#f90; }
#rodape a:hover,
#rodape a:focus { color:#000; }
#rodape p { position:absolute; top:85px; }
#rodape p span { font:bold .8em 'trebuchet ms', arial, helvetica, sans-serif; line-height:1.1em; text-transform:uppercase; }
#rodape .wersus { position:absolute; top:65px; right:0; font-size:.8em; font-weight:bold; text-transform:uppercase; color:#999; }
#rodape .wersus a { display:block; width:162px; height:32px; text-indent:-99999px; background:url(images/marca-wersus-interactive.gif) no-repeat; }
