/* CSS - guia rodoviario 3 rodas PRO */ * { margin: 0; padding: 0; } html, body { height: 100%; background: url(../imagens/all_bg.gif) #cccccc repeat-x; font-family: Arial, sans-serif; font-size: 11px; color: #000; } * html { overflow-x: hidden; } body #all { min-height: 100%; height: auto; width: 769px; margin: 0 auto -74px; padding: 0 4px; background: #fff; border-left: 1px #999999 solid; border-right: 1px #999999 solid; } * html body #all { height: 100%; } #all a.home { float: right; margin-top: 8px; padding-left: 16px; background: url(../imagens/icone_home.gif) no-repeat; text-decoration: none; color: #000; } #all a.home:hover { text-decoration: underline; } a.cinza { display: block; min-width: 1%; height: 22px; padding-left: 7px; background: url(../imagens/botao_cinza_esquerda.gif) no-repeat; color: #000; font-weight: bold; text-decoration: none; white-space: nowrap; } * html a.cinza { width: 1%; } a.cinza span { display: block; height: 19px; padding: 3px 7px 0 0; background: url(../imagens/botao_cinza_direita.gif) right top no-repeat; cursor: hand; } a.botao_amarelo { height: 39px; text-decoration: none; color: #000; font-size: 16px; font-family: "Trebuchet-MS", sans-serif; font-weight: bold; cursor: hand; } a.botao_amarelo span { display: block; height: 30px; padding: 9px 40px 0 0; text-align: center; white-space: nowrap; } a.voltar { display: block; min-width: 10px; margin-top: 4em; padding-left: 10px; background: url(../imagens/seta_esquerda.gif) left center no-repeat; text-decoration: none; color: #000; } * html a.voltar { width: 10px; } a.voltar:hover { text-decoration: underline; } img { border: 0; } p { line-height: 1.5; } p.centralizado { text-align: center; } .box_degrade { width: 292px; padding: 1em; } .box_degrade h3 { margin-bottom: 0.5em; padding-bottom: 0.5em; background: url(../imagens/caixa_degrade_linha.gif) bottom repeat-x; font-size: 1.5em; color: #a30a0a; } /* -- topo -- */ #all #topo { height: 99px; background: url(../imagens/topo_bg.gif) repeat-x; } #all #topo h1 { float: left; width: 261px; height: 52px; margin: 23px 22px 0 23px; background: url(../imagens/topo_logo_guia4rodas.gif) no-repeat; text-indent: -999em; overflow: hidden; } * html #all #topo h1 { margin: 23px 22px 0 10px; } #all #topo h1 a { display: block; height: 100%; } #all #topo h2 { width: 462px; height: 99px; background: url(../imagens/topo_bg2.gif) no-repeat; text-indent: -999em; overflow: auto; } /* -- menu -- */ #all ul#menu { width: 769px; height: 35px; background: #a30a0a; border-bottom: 1px #3e0000 solid; list-style: none; } #all ul#menu li { float: left; min-width: 40px; height: 35px; border-left: 1px #e41111 solid; border-right: 1px #620303 solid; white-space: nowrap; } * html #all ul#menu li { width: 40px; } #all ul#menu li.ultimo { border-right: none; } #all ul#menu li a { display: block; height: 23px; padding: 12px 18px 0 18px; text-decoration: none; color: #fff; font-size: 14px; } #all ul#menu li.ativo a, #all ul#menu li a:hover { background: url(../imagens/menu_ativo.gif) repeat-x; } /*-- conteudo -- */ #all #conteudo { min-height: 100%; padding: 22px 0 84px; background: url(../imagens/conteudo_bg.gif) top repeat-x; } * html #all #conteudo { height: 100%; } /* contendo float */ #all #conteudo:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #all #conteudo { display: inline-block; } /* Hides from IE-mac \*/ * html #all #conteudo { height: 1%; } #all #conteudo { display: block; } /* End hide from IE-mac */ /* -- coluna1 -- */ #all.inicial #conteudo #coluna1 { float: left; width: 468px; padding-left: 40px; background: url(../imagens/inicial_coluna1_bg.jpg) 265px 200px no-repeat; } html > body #all.inicial #conteudo #coluna1 { width: 460px; } #all #conteudo h2 { font-size: 20px; margin-top: 14px; padding-bottom: 10px; background: url(../imagens/titulo_linha.gif) bottom repeat-x; font-family: "Trebuchet-MS", sans-serif; color: #a30a0a; } #all.inicial #conteudo #coluna1 h3 { font-size: 18px; margin: 11px 0 20px 0; } #all.inicial #conteudo #coluna1 ul { float: left; height: 180px; list-style: inside; } #all.inicial #conteudo #coluna1 ul li { width: 200px; color: #333333; margin-bottom: 6px; } #all.inicial #conteudo #coluna1 ul li.destaque { list-style: none; font-size: 13px; font-family: Arial; } /* -- botao amarelo -- */ #all #conteudo #coluna1 a.botao_amarelo { float: left; min-width: 180px; padding-left: 40px; background: url(../imagens/botao_amarelo_esquerda.jpg) no-repeat; } * html #all #conteudo #coluna1 a.botao_amarelo { width: 180px; } #all #conteudo #coluna1 a.botao_amarelo span { background: url(../imagens/botao_amarelo_direita.jpg) right -1px no-repeat; } /* -- coluna 2 -- */ #all.inicial #conteudo #coluna2 { float: right; width: 170px; height: 300px; padding-left: 40px; } html > body #all.inicial #conteudo #coluna2 { width: 225px; } #all.inicial #conteudo #coluna2 a.placa_azul { display: block; width: 178px; height: 39px; padding-top: 7px; background: url(../imagens/placa_azul.gif) no-repeat; color: #fff; text-decoration: none; font-size: 10px; text-align: center; } * html #all.inicial #conteudo #coluna2 a.placa_azul { margin-top: -5px; } /* ------- secoes internas ------- */ #all.interna #conteudo { padding-left: 19px; padding-right: 19px; } #all.interna #conteudo h2 { margin: 0 0 10px; } #all.interna #conteudo #breadcrumb { margin-bottom: 10px; color: #666; } #all.interna #conteudo #breadcrumb a { color: #666; text-decoration: none; } #all.interna #conteudo #breadcrumb a:hover { text-decoration: underline; } #all.interna #conteudo #breadcrumb span { color: #ff0000; } /* ------- o que ------- */ /* ------- coluna 1 ------- */ #all.oque #conteudo #coluna1 { float: left; width: 374px; } #all.oque #conteudo #coluna1 p, #all.oque #conteudo #coluna1 ul { margin-bottom: 1em; } #all.oque #conteudo #coluna1 ul { margin-left: 15px; list-style: disc; } #all.oque #conteudo #coluna1 ul li { margin-bottom: 10px; } #all.oque #conteudo #coluna1 ul.botoes { list-style: none; } #all.oque #conteudo #coluna1 ul.botoes li { float: left; margin-right: 20px; } /* ------- coluna 2 ------- */ #all.oque #conteudo #coluna2 { margin-left: 404px; } #all.oque #conteudo #coluna2 .box_cinza, .box_degrade { background: url(../imagens/caixa_bg.gif) #dedddd repeat-x; border: 1px solid #ccc; } #all.oque #conteudo #coluna2 .box_cinza { width: 302px; padding: 5px; text-align: center; } #all.oque #conteudo #coluna2 .box_cinza a { color: #000; text-decoration: none; } #all.oque #conteudo #coluna2 .box_cinza img { display: block; margin-bottom: 5px; } /*------- o que - light, standard e premium ------- */ #all.oque #conteudo #coluna2 .box_degrade p.preco { margin: 10px 0; font-size: 2em; } #all.oque #conteudo #coluna2 a.botao_amarelo { display: block; margin: 10px auto; padding-left: 20px; background: url(../imagens/botao_amarelo_cinza_esquerd.jpg) no-repeat; } #all.oque #conteudo #coluna2 a.botao_amarelo span { padding-right: 20px; background: url(../imagens/botao_amarelo_cinza_direita.jpg) right 0 no-repeat; } /* ------- como funciona ------- */ #all.comofunciona #conteudo p { padding-bottom: 1.5em; } #all.comofunciona #conteudo ol { margin-left: 15px; } html > body #all.comofunciona #conteudo ol { margin-top: 25px; } #all.comofunciona #conteudo ol li { clear: both; } #all.comofunciona #conteudo ol li img { float: right; margin-bottom: 20px; } #all.comofunciona #conteudo ol li p { margin-top: -15px; } #all.comofunciona #conteudo ol li .cinza { width: 300px; margin-top: 10px; text-align: center; } /* ------- compre ja ------- */ #all.compreja #conteudo table { clear: both; margin: 1em 0; background: #cacaca; border: 0; border-spacing: 1px; } #all.compreja #conteudo table thead tr th#funcionalidades, #all.compreja #conteudo table thead tr th#versoes { background: #990000; color: #fff; } #all.compreja #conteudo table tr.tipo th, #all.compreja #conteudo table tbody tr th, #all.compreja #conteudo table .vermelho, #all.compreja #conteudo table tr td form label span { color: #990000; } #all.compreja #conteudo table tr.tipo th { background: #FFFF00; } #all.compreja #conteudo table tr td, #all.compreja #conteudo table tr th { padding: 1px; background: #fff; background-repeat: no-repeat; } #all.compreja #conteudo table tr.cinza td, #all.compreja #conteudo table tr.cinza th { background-color: #F4F4F4; } #all.compreja #conteudo table tr th { text-transform: uppercase; } #all.compreja #conteudo table tr th#pontos { text-align: left; } #all.compreja #conteudo table tr.cinza th, #all.compreja.interna #conteudo table tr.branco th { color: #000; text-align: left; text-transform: none; } #all.compreja #conteudo table tr td.check { background-position: center; text-indent: -9999em; } #all.compreja #conteudo table tr th img.novo { margin: 3px 0 -2px 5px; } #all.compreja #conteudo table tr.cinza td.check { background-image: url(../imagens/compreja_check_cinza.gif); } #all.compreja #conteudo table tr.branco td.check { background-image: url(../imagens/compreja_check_branco.gif); } #all.compreja #conteudo table tr td span strong, #all.compreja.interna #conteudo table tr td span.vermelho { display: block; } #all.compreja #conteudo table tr td span.vermelho { margin-top: 1em; } #all.compreja.interna #conteudo table tfoot tr td span.vermelho { display: inline; font-weight: bold; } #all.compreja #conteudo table tr td label { display: block; text-align: center; font-weight: bold; color: #603333; } #all.compreja #conteudo table tr td select { margin-left: 5px; background: #F4F4F4; border-width: 1px; font-weight: bold; font-size: 0.8em; color: #666; } #all.compreja #conteudo table tr td #plight.vermelho, #all.compreja #conteudo table tr td #pstandard.vermelho, #all.compreja #conteudo table tr td #ppremium.vermelho { text-align: center; font-weight: bold; } #all.compreja #conteudo table tr td a.botao_cinza { display: block; width: 106px; height: 17px; background: url(../imagens/bot-comprar-cd-guia4rodas.gif) no-repeat; text-indent: -9999em; overflow: hidden; } #all.compreja #conteudo ul.formas_pagamento { width: 300px; margin: 1em auto; list-style: none; } #all.compreja #conteudo ul.formas_pagamento li { float: left; } #all.compreja #conteudo iframe { float: right; width: 134px; height: 60px; margin-top: -20px;} html > body #all.compreja #conteudo .atendimento { margin-bottom: 2em; } /* ------- FAQ ------- */ #all.faq #conteudo ol li { margin: 0 0 15px 15px; font-weight: bold; } #all.faq #conteudo ol li p { margin-top: 1em; font-weight: normal; } /* ------- fale conosco e suporte ------- */ /* ------- coluna 1 -------*/ #all.faleconosco #conteudo #coluna1, #all.suporte #conteudo #coluna1 { float: left; width: 350px; } #all.faleconosco #conteudo #coluna1 form, #all.suporte #conteudo #coluna1 form { margin-top: 1em; } #all.faleconosco #conteudo #coluna1 form ol, #all.suporte #conteudo #coluna1 form ol { list-style: none; } #all.faleconosco #conteudo #coluna1 form ol li, #all.suporte #conteudo #coluna1 form li { clear: left; margin-bottom: 10px; } #all.faleconosco #conteudo #coluna1 form ol li label, #all.suporte #conteudo #coluna1 form label { float: left; width: 150px; margin-right: 10px; text-align: right; } #all.faleconosco #conteudo #coluna1 form ol li input, #all.faleconosco #conteudo #coluna1 form ol li textarea, #all.faleconosco #conteudo #coluna1 form button, #all.suporte #conteudo #coluna1 form ol li input, #all.suporte #conteudo #coluna1 form ol li textarea, #all.suporte #conteudo #coluna1 form button { background: #F4F4F4; border: 1px solid #000; font-size: 1em; } #all.faleconosco #conteudo #coluna1 form ol li input, #all.faleconosco #conteudo #coluna1 form ol li textarea, #all.suporte #conteudo #coluna1 form ol li input, #all.suporte #conteudo #coluna1 form ol li textarea { width: 150px; } #all.faleconosco #conteudo #coluna1 form ol li input#ddd, #all.suporte #conteudo #coluna1 form ol li input#ddd { width: 30px; } #all.faleconosco #conteudo #coluna1 form ol li input#telefone, #all.suporte #conteudo #coluna1 form ol li input#telefone { width: 115px; } #all.faleconosco #conteudo #coluna1 form ol li textarea, #all.suporte #conteudo #coluna1 form ol li textarea { height: 50px; } #all.faleconosco #conteudo #coluna1 form div, #all.suporte #conteudo #coluna1 form div { margin-left: 160px; } #all.faleconosco #conteudo #coluna1 form button, #all.suporte #conteudo #coluna1 form button { margin-right: 10px; padding: 0 5px; } #all.faleconosco #conteudo #coluna1 .atendimento { display: block; width: 134px; height: 60px; padding-top: 10px; margin: 20px 0 0 176px; background: url(../imagens/compreja_atendimento_online.jpg) no-repeat; text-indent: -999em; overflow: auto; } * html #all.faleconosco #conteudo #coluna1 .atendimento { margin-left: 180px; } /* ------- coluna 2 -------*/ #all.suporte #conteudo #coluna2 { margin-left: 400px; } #all.faleconosco #conteudo #coluna2 img { display: block; margin: 0 auto; } #all.suporte #conteudo #coluna2 .box_degrade { width: 200px; } /* -- rodape -- */ #rodape { clear: both; width: 769px; height: 74px; margin: 0 auto; padding: 0 5px; background: url(../imagens/rodape_bg2.gif) #fff repeat-y; } #rodape div { height: 74px; background: url(../imagens/rodape_bg.gif) #a30a0a repeat-x; } #rodape .publicidade { float: left; width: 110px; height: 36px; margin: 20px 0 0 22px; } #rodape .publicidade span { color: #fff; font-family: Tahoma, sans-serif; font-size: 10px; } #rodape ul li { float: right; } #rodape ul.contato h3 { float: right; margin: 20px 20px 0 0; color: #fff; font-size: 12px; font-family: Tahoma, sans-serif; } #rodape ul.contato { width: 200px; height: 43px; margin: 20px 20px 0 0; list-style: none; text-align: right; float: right; } #rodape ul.contato li { width: 200px; color: #fff; text-align: right; } #rodape ul.contato li a { text-decoration: none; color: #fff; } #rodape ul.contato h3 { margin: 0; color: #fff; font-size: 12px; font-family: Tahoma, sans-serif; } #rodape a#maplink { float: left; width: 99px; height: 22px; background: url(../imagens/logo_maplink.gif) no-repeat; text-indent: -9999em; overflow: hidden; }