/* * Cliente: Hiperconectado * Projeto: Website * Ultima revisao: 07/05/2010 */ /* -- RESET -- */ * { margin: 0; padding: 0; } html { font-size: 100%; } body { background-color: #fff; font: .75em arial, helvetica, sans-serif; color: #000; } img, fieldset { border: 0 none; } a { text-decoration: none; color: #7d006c; } a:hover { text-decoration: underline; } button { cursor: pointer; } input, textarea { font: 1em arial, helvetica, sans-serif; padding:2px; border-top:1px solid #000; border-left:1px solid #000; border-bottom:1px solid #808080; border-right:1px solid #808080;} :focus { outline: 0 none; } ul.error, p.error { color: #900 !important; } ul.updated, p.updated { color: #039 !important; } input.error, select.error, textarea.error { background-color: #fdd; } /* -- ESTRUTURA -- */ #geral {position:relative; width:950px; margin:0 auto; overflow:hidden} #topo {position:relative; width:950px; height:200px; background:url(../imagens/bg-topo.gif) no-repeat bottom left} #conteudo {position:relative; width:950px; overflow:hidden; float:left} #banner-lateral {position:relative; text-align:right; width:121px; float:right;} #conteudo-principal {position:relative; width:710px; float:left;} #coluna-lateral {position:relative; width:235px; float:right;} #container-rodape {position:relative; width:100%; background-color:#9f9f9f; clear:both; margin:45px auto 0} #rodape {position:relative; width:950px; margin:0 auto; padding:6px;} #banner {width:950px} /* -- BANNER SKY -- */ #geral.banner {width:1075px !important} #banner-lateral{display:none;} /* -- TOPO -- */ h1.logo {position:absolute; width:406px; height:183px; left:17px; bottom:0; background:url(../imagens/hiperconectado.gif) no-repeat top left; text-indent:-9999px} h1.logo a {width:406px; height:183px; display:block} ul#navegacao-auxiliar {position:absolute; right:0; top:78px; list-style:none} ul#navegacao-auxiliar li {float:left; margin-left:5px} ul#navegacao-auxiliar li a {display:block; height:17px; width:115px; text-align:center; color:#fff; font-weight:bold; text-transform:uppercase;background-color:#b3b3b3; padding-top:2px} ul#lista-links {position:absolute; right:0; top:100px; list-style:none; width:230px} ul#lista-links li {margin:10px 0;} ul#lista-links li a {display:block; text-indent:-9999px; height:19px; } ul#lista-links li.palestras a {background:url(../imagens/palestras-e-eventos.gif) no-repeat top left; width:154px;} ul#lista-links li.newsletter a {background:url(../imagens/receba-a-newsletter.gif) no-repeat top left; width:160px} ul#lista-links li.rss a {background:url(../imagens/assine-o-rss.gif) no-repeat top left; width:104px} /* -- CONTEUDO -- */ #conteudo-principal h2.titulo-pagina {background-color:#faaf3a; text-transform:uppercase; height:17px; padding:2px 2px 2px 8px; display:block; font-size:15px; margin-bottom:2px; clear:both} #conteudo-principal h2.titulo-pagina a {color:#000} /* -- MODELOS DA P�GINA INICIAL -- */ .box-post {overflow:hidden} .box-post p {color:#fff; margin:4px 0} .box-post a {color:#fff; font-size:11px} .box-post h2 {color:#fff; font-size:15px} .box-post h3 {color:#fff; font-size:12px} .box-post h2 a {color:#fff; font-size:15px} .box-post h3 a {color:#fff; font-size:12px} /*.box-post img {width:170px; height: 105px;}*/ p.box_img_home{ width:215px; height: 105px; overflow: hidden; text-align: center;} p.box_img_home_grd{ height: 330px; overflow: hidden; } p.leia-mais {position:absolute; display:block; width:100px; right:9px; bottom:5px; margin:0 !important} p.leia-mais a {text-transform:uppercase; font-weight:bold; font-size:12px; float:right} .box-post:hover {background-color:#fff !important} .box-post:hover p {color:#000} .box-post:hover a {color:#7d006c;} .box-post:hover h2 {color:#7d006c;} .box-post:hover h3 {color:#7d006c;} .box-post:hover h2 a {color:#7d006c;} .box-post:hover h3 a {color:#7d006c;} /* -- COLUNA LATERAL -- */ #coluna-lateral h3 {background-color:#faaf3a; padding:3px} #coluna-lateral ul {list-style:none} #coluna-lateral ul li {margin:5px} #coluna-lateral ul li a {background-color:#e1d3bb; padding:3px; display:block; color:#000; text-transform:uppercase} #coluna-lateral ul li ul li {margin-left:25px; margin-right:0; } #coluna-lateral ul li ul li a {text-transform:none; background-color:#f0e9dd; padding:2px} #coluna-lateral .secoes {margin-bottom:15px} #coluna-lateral .secoes h3 {background:url(../imagens/titulo-secoes.gif) no-repeat top left; display:block; width:236px; height:15px; text-indent:-9999px;} #coluna-lateral .secoes li a { text-transform: uppercase; } #coluna-lateral .pesquisa {margin-bottom:15px; overflow:hidden} #coluna-lateral .pesquisa h3 {background:url(../imagens/titulo-pesquisa.gif) no-repeat top left; display:block; width:236px; height:21px; text-indent:-9999px;} #coluna-lateral .pesquisa input { padding:4px; float:left; width:185px} #coluna-lateral .pesquisa button {background:url(../imagens/botao-ok.gif) no-repeat top left; width:35px; height:24px; text-indent:-9999px; border:0 none; float:left; margin-left:5px} #coluna-lateral .tags {margin-bottom:60px; height:135px;} #coluna-lateral .tags h3 {background:url(../imagens/titulo-tags.gif) no-repeat top left; display:block; width:236px; height:21px; text-indent:-9999px;} #coluna-lateral .tags a {color:#000; text-decoration:none} #coluna-lateral .tags a:hover {text-decoration:underline} #coluna-lateral .ultimas-noticias {margin-bottom:15px} #coluna-lateral .ultimas-noticias h3 {background:url(../imagens/titulo-ultimas-noticias-lateral.gif) no-repeat top left; display:block; width:236px; height:21px; text-indent:-9999px;} #coluna-lateral .ultimas-noticias .box-noticia {position:relative; width:100%; border-top:1px solid #000; padding:10px 0} #coluna-lateral .ultimas-noticias .box-noticia.primeira-noticia {border-top:0} #coluna-lateral .ultimas-noticias .box-noticia h4 {font-size:14px} #coluna-lateral .ultimas-noticias .box-noticia h4 a {color:#000} /* -- PAGINA�AO -- */ ul#paginacao {position:relative; width:100%; clear:both; list-style:none; overflow:hidden; padding:8px 0} ul#paginacao li.recentes {float:left} ul#paginacao li.anteriores {float:right} ul#paginacao li a {font-size:14px; color:#000; font-weight:bold} /* -- GUIA COMPRAS -- */ .passo {position:relative; float:left; width:234px; height:211px; margin:2px 4px 25px 0; background-color:#4ca6ba;} .passo h3 {height:95px} .passo p {margin:50px 20px 20px; color:#fff; font-size:14px; font-weight:bold} .passo p a {color:#fff} .passo.um h3 {background:url(../imagens/passo-um.gif) #1f90a9 no-repeat 20px 20px; text-indent:-9999px} .passo.dois h3 {background:url(../imagens/passo-dois.gif) #1f90a9 no-repeat 20px 20px; text-indent:-9999px} .passo.tres {margin:2px 0 2px 0;} .passo.tres h3 {background:url(../imagens/passo-tres.gif) #1f90a9 no-repeat 20px 20px; text-indent:-9999px} /* -- PAGINA INTERNA -- */ #titulo-post {position:relative; width:100%; margin-top:10px} #titulo-post h1 {font-size:30px; font-weight:bold; color:#7d006c; text-transform:uppercase; margin-bottom:10px} #titulo-post h4 {font-size:14px; font-weight:bold; color:#7d006c;} #titulo-post ul {overflow:hidden; list-style:none; margin-bottom:10px} #titulo-post ul li {font-size:14px; color:#7d006c; float:left; padding-right:5px; border-right:1px solid #7d006c;} #titulo-post ul li.sem-borda {border-right:0; padding-left:5px} #titulo-post ul li a {font-size:14px; color:#7d006c; font-weight:bold} #conteudo-interno {position:relative; width:510px; float:left;} #conteudo-interno p.wp-caption-text {margin-top:0; color:#fff; font-weight:bold; padding:5px 15px 5px 5px; font-size:12px; background:url(../imagens/bg-legenda.gif) no-repeat top right} #conteudo-interno p.creditos {font-size:10px; color:#000; position:absolute; display:block; top:0; right:10px; width:auto} #conteudo-interno .wp-caption {padding-top:13px; position:relative; margin-bottom:20px} #conteudo-interno .wp-caption p {margin:0} #conteudo-interno h2 {color:#7d006c; font-size:14px} #conteudo-interno h3 {color:#7d006c; font-size:12px} #conteudo-interno p {margin-bottom:20px; font-size:14px} #comentarios {position:relative; width:100%} #comentarios h3 {margin-bottom:10px} #comentarios h3 span {font-weight:normal} #comentarios p {font-size:12px; margin:0} #comentarios p.responder-comentario {margin-top:15px} #comentarios .box-comentario {position:relative; width:100%; border-top:1px solid #000; padding:15px 0} #comentarios .box-comentario.primeiro-comentario {border-top:0} #comentarios table tr td {padding:7px 0} #comentarios table tr td button {background:url(../imagens/botao-ok.gif) no-repeat top left; width:35px; height:24px; text-indent:-9999px; border:0 none; float:right; margin-left:5px} #comentarios table tr td button.botao-cancelar {background:url(../imagens/botao-cancelar.gif) no-repeat top left; width:97px; height:24px; text-indent:-9999px; border:0 none; float:left; margin-left:0} #comentarios input, #comentarios textarea {padding:6px; color:#6d6e71} #comentarios input.titulo-comentario {width:498px} #comentarios input.nome-comentario {width:245px} #comentarios input.email-comentario {width:230px; margin-right:10px} #comentarios textarea.mensagem-comentario {width:498px; height:100px} #redes-sociais {position:relative; width:160px; float:right} #redes-sociais ul {clear:both; list-style:none;} #redes-sociais ul li {margin-bottom:17px; font-size:11px} #redes-sociais ul li a {color:#adadad; padding:0 0 2px 24px} #redes-sociais ul li a:hover {color:#000; text-decoration:none} #redes-sociais ul li a.delicious {background:url(../imagens/ico-delicious.gif) no-repeat top left} #redes-sociais ul li a:hover.delicious {background:url(../imagens/ico-delicious.gif) no-repeat bottom left} #redes-sociais ul li a.yahoo {background:url(../imagens/ico-yahoo.gif) no-repeat top left; padding-bottom:0} #redes-sociais ul li a:hover.yahoo {background:url(../imagens/ico-yahoo.gif) no-repeat bottom left} #redes-sociais ul li a.google-bookmarks {background:url(../imagens/ico-google-bookmarks.gif) no-repeat top left} #redes-sociais ul li a:hover.google-bookmarks {background:url(../imagens/ico-google-bookmarks.gif) no-repeat bottom left} #redes-sociais ul li a.digg {background:url(../imagens/ico-digg.gif) no-repeat top left; padding-bottom:0} #redes-sociais ul li a:hover.digg {background:url(../imagens/ico-digg.gif) no-repeat bottom left} #redes-sociais ul li a.windows {background:url(../imagens/ico-windows.gif) no-repeat top left; padding-bottom:0} #redes-sociais ul li a:hover.windows {background:url(../imagens/ico-windows.gif) no-repeat bottom left} #redes-sociais ul li a.reddit {background:url(../imagens/ico-reddit.gif) no-repeat top left} #redes-sociais ul li a:hover.reddit {background:url(../imagens/ico-reddit.gif) no-repeat bottom left} #redes-sociais ul li a.stumbleupon {background:url(../imagens/ico-stumble-upon.gif) no-repeat top left; padding-bottom:1px} #redes-sociais ul li a:hover.stumbleupon {background:url(../imagens/ico-stumble-upon.gif) no-repeat bottom left} #redes-sociais ul li a.twitter {background:url(../imagens/ico-twitter.gif) no-repeat top left} #redes-sociais ul li a:hover.twitter {background:url(../imagens/ico-twitter.gif) no-repeat bottom left} #redes-sociais ul li a.facebook {background:url(../imagens/ico-facebook.gif) no-repeat top left; padding-bottom:0} #redes-sociais ul li a:hover.facebook {background:url(../imagens/ico-facebook.gif) no-repeat bottom left} #redes-sociais #tweets {position:relative; width:50px; float:left; margin-bottom:20px; margin-right:10px} #redes-sociais #share {position:relative; width:50px; float:left; margin-bottom:20px} .botao-envie-amigo {margin:20px 0} .botao-imprimir {margin:20px 0} /* -- PAGINA DE PALESTRA E EVENTOS - INTERNA -- */ table.dados-do-evento {margin:15px 0} table.dados-do-evento tr td {font-size:14px; font-weight:bold; padding-right:15px} /*-- PÁGINA DE RESULTADOS DA BUSCA --*/ div#paginacao {position:relative; padding:4px 10px; background-color:#87a0b3; height:15px; margin:20px 0} div#paginacao a {color:#fff} div#paginacao a.anterior {float:left} div#paginacao a.proxima {float:right} div#paginacao ul {list-style:none; overflow:hidden; position:absolute; left:280px} div#paginacao ul li {float:left; color:#fff} div#paginacao ul li a {padding:3px; margin:0 4px; text-decoration:underline } div#paginacao ul li a:hover {text-decoration:none } div#paginacao ul li a.ativo {font-weight:bold} .item-resultado {position:relative;width:675px; margin:0 auto; padding:20px 0; border-top:1px solid #000} .item-resultado.primeiro-item {border:0 none} .item-resultado h2 {color:#7d006c; font-size:16px;} .item-resultado h2 a {color:#7d006c; font-size:16px;} .item-resultado p.data {font-weight:bold; font-size:12px} .item-resultado p {font-size:14px; line-height:18px} /* -- RODAPE -- */ #rodape p {color:#fff; text-align:center; font-size:11px} #rodape a {color:#fff} /* Begin Images */ p img { padding: 0; max-width: 100%; } /* Using 'class="alignright"' on an image will (who would've thought?!) align the image to the right. And using 'class="centered', will of course center the image. This is much better than using align="center", being much more futureproof (and valid) */ img.centered { display: block; margin-left: auto; margin-right: auto; } img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; } img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; } .alignright { float: right; } .alignleft { float: left; } /* End Images */ #primeiro-box h2 a { text-transform: uppercase; } #segundo-box h2 a{ text-transform: uppercase; } #terceiro-box h2 a{ text-transform: uppercase; } #quarto-box h2 a{ text-transform: uppercase; } #quinto-box h2 a{ text-transform: uppercase; } #sexto-box h2 a{ text-transform: uppercase; } #setimo-box h2 a{ text-transform: uppercase; } #oitavo-box h2 a{ text-transform: uppercase; } #nono-box h2 a{ text-transform: uppercase; } /*-- MODALS --*/ #mask {position:absolute;z-index:9000;background-color:#000;display:none;} .window {position:fixed;display:none;z-index:9999;} .modal {position:fixed; top:0; left:0} .modal p.fechar {background-color:#104167; text-align:right; color:#fff; padding:5px 12px;} .modal p.fechar a {color:#fff;} .modal p.fechar a:hover {text-decoration:none; color:#faaf3a} .modal p.fechar a span {text-decoration:underline; margin-right:8px;} h2.titulo-modal {background-color:#faaf3a; padding:1px 8px; font-size:16px; text-transform:uppercase; margin:5px 0} .modal .conteudo-modal {position:relative; background-color:#fff; padding:20px} .container-formulario {position:relative; border:1px solid #faaf3a; padding:15px; overflow:hidden} .container-formulario p {font-size:14px} .container-formulario input, .container-formulario textarea {display:block; margin:5px 0; background-color:#feebce; width:348px; border:0 none; padding:8px 10px; border:1px solid #feebce;} .container-formulario input.ativo, .container-formulario textarea.ativo {border:1px solid #c00} .container-formulario span.campo-obrigatorio {position:relative; float:right; font-size:11px; color:#c00} .container-formulario textarea {height:70px} .container-formulario table {margin:20px 0 0} .container-formulario button {background:url(../imagens/botao-enviar.gif) no-repeat top left; text-indent:-9999px; width:65px; height:24px; border:0 none; float:right; margin:15px 0 0} #msg_retorno {padding:0 7px; margin-top:10px; text-align:center} #modal-loading #loading_ajax { background-color:#ffffff; text-align:center; padding:25px; background-repeat:no-repeat; background-position:center;} #modal-loading .container-formulario {padding:100px 0;} #modal-loading .container-formulario p {text-align:center} #modal-loading #loading_ajax img {float:none;} /*-- contato --*/ .modal.contato {width:440px;} /*-- retorno --*/ #retorno_operacoes #container_contato{padding:100px 0; overflow:hidden} .modal.retorno {width:440px;} /*-- aguarde --*/ .modal.aguarde {width:440px;} /*-- newsletter --*/ .modal.newsletter {width:440px} h2.titulo-modal.newsletter {background:url(../imagens/ico-bg-modal-newsletter.gif) #faaf3a no-repeat center right;} /*-- envie para um amigo --*/ .modal.envie-para-um-amigo {width:670px} h2.titulo-modal.envie-para-um-amigo {background:url(../imagens/ico-bg-modal-newsletter.gif) #faaf3a no-repeat center right;} .modal.envie-para-um-amigo table {width:280px;} .modal.envie-para-um-amigo table input {width:260px} .modal.envie-para-um-amigo table.tabela-esquerda {margin-right:14px; float:left} .modal.envie-para-um-amigo .container-tabela-amigo {position:relative; background-color:#8fc7d4; padding:12px; float:left; width:280px; overflow:hidden} .modal.envie-para-um-amigo .container-tabela-amigo table {margin-top:0} a.excerpt_busca { color: #000000; text-decoration: none; } a.excerpt_busca:hover { text-decoration: underline; }