/* Cliente: Midia Digital Projeto: Redesenho */ /* -------------- PALETA DE CORES -------------- #282d2d - Textos #ec0000 - Vermelho #fff - Branco #0099b6 - Azul #ccc - Cinza */ /* -------------- ELEMENTOS e CLASSES -------------- */ /* ------- GERAL ------- */ * { margin: 0; padding: 0; z-index: 1; } /* ------- CLASSES ------- */ .direita, .alignright { float: right; } .esquerda, .alignleft { float: left; } p.direita, p.esquerda { float: none; } p.direita { text-align: right; } p.esquerda { text-align: left; } .centro { text-align: center; } /* contendo float */ .contemfloat:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .contemfloat { display: inline-block; } /* Hides from IE-mac \*/ * .contemfloat { height: 1%; } .contemfloat { display: block; } /* End hide from IE-mac */ /* pop up de aviso */ #pop_up_aviso { display: none; position: absolute; top: 60%; left: 60%; width: 337px; height: 95px; margin: -47px 0 0 -168px; background: url(../imagens/bg_pop_aviso.png) no-repeat; font-size: 1.45em; } #pop_up_aviso a { display: block; width: 87px; height: 27px; margin: 0 auto; background: url(../imagens/bt_continuar.png) no-repeat; text-indent: -999em; overflow: hidden; } #pop_up_aviso p { margin: .8em 0 .5em; } #pop_up_aviso.erro { width: 287px; padding: 0 25px; background-position: 0 bottom; color: #fff; } #pop_up_aviso.erro p { margin: 0 0 .5em; } input.erro, textarea.erro, select.erro { border-color: #ec0000; background-color: #fcc; } /* ------- ELEMENTOS ------- */ html, body { min-height: 100%; } html { background: #ddd url(../imagens/bg_html.jpg) left top repeat-x; font-size: 100%; } body { background: url(../imagens/bg_body.jpg) center top no-repeat; font: .68em "Trebuchet MS", times; color: #282d2d; } a { color: #6d6865; text-decoration: none; } a:hover { color: #ec0000; } h1, h3, p strong { color: #ec0000; } input, textarea { padding: 2px 3px; border: 1px solid #a1a1a1; font: 1.2em "Trebuchet MS", times; } #limites { width: 870px; margin: 0 auto; } /* ------- ACESSIBILIDADE ------- */ #topo #acessibilidade { padding: 10px 9px 0 0; text-align: right; } #topo #acessibilidade li { display: inline; font-size: .9em; line-height: 13px; } #topo #acessibilidade li a { color: ; } /* ------- TOPO ------- */ #topo { position: relative; height: 236px; } /* idiomas */ #topo #idiomas { padding-top: 10px; text-align: right; } #topo #idiomas li { display: inline; font-size: 1.1em; line-height: 13px; } #topo #idiomas li.english { padding-right: 23px; background: url(../imagens/bandeira_usa.gif) right no-repeat; } /* menu */ #topo #menu { height: 43px; margin-top: 55px; list-style: none; } #topo #menu li { float: right; margin-left: 30px; padding: 0 10px 10px 0; background: url(../imagens/base_link_1.gif) 0 bottom no-repeat; } #topo #menu li a, #topo #menu li strong { display: block; height: 30px; background: url(../imagens/links_menu.gif) no-repeat; text-indent: -999em; overflow: hidden; } #topo #menu li.blog a { width: 51px; } #topo #menu li.blog a:hover { background-position: 0 -30px; } #topo #menu li.contato a, #topo #menu li.contato strong { width: 91px; background-position: 0 -60px; } #topo #menu li.contato a:hover, #topo #menu li.contato strong, #topo #menu li.contato.ativo a { background-position: 0 -90px; } #topo #menu li.trabalhe_conosco a, #topo #menu li.trabalhe_conosco strong { width: 215px; background-position: 0 -120px; } #topo #menu li.trabalhe_conosco a:hover, #topo #menu li.trabalhe_conosco strong, #topo #menu li.trabalhe_conosco.ativo a { background-position: 0 -150px; } #topo #menu li.home { background: none; } #topo #menu li.home a { width: 34px; height: 25px; background: url(../imagens/icone_home.gif) no-repeat; } #topo #menu li.home a:hover { background-position: 0 bottom; } #topo h2 { position: absolute; top: 67px; left: -10px; width: 400px; height: 169px; } #topo #flash_topo { position: absolute; top: 6px; left: -98px; width: 520px; height: 320px; z-index: 2; } /* ------- CONTEUDO ------- */ #conteudo h1, #conteudo h3 { font: bold 1.45em "Trebuchet MS", times; } #conteudo h3 { font-weight: normal; font-size: 1.8em; } #conteudo p { margin-bottom: 1em; line-height: 1.63em; } #conteudo p strong { font-size: 1.27em; } /* ------- COLUNA 1 ------- */ #coluna1 { float: left; width: 250px; } /* certificados */ #coluna1 #certificados { width: 152px; margin: 115px auto 0; list-style: none; } #coluna1 #certificados li, #coluna1 #certificados li a { display: block; width: 58px; height: 60px; text-indent: -999em; overflow: hidden; } #coluna1 #certificados li.yahoo { width: 152px; height: 54px; margin-bottom: 10px; background: url(../imagens/selo_yahoo.png) no-repeat; } #coluna1 #certificados li.adwords, #coluna1 #certificados li.analytics { width: 58px; height: 60px; } #coluna1 #certificados li.adwords { margin-left: 10px; background: url(../imagens/selo_adwords.jpg) center center no-repeat; } * html #coluna1 #certificados li.adwords { margin-left: 5px; } #coluna1 #certificados li.analytics { margin-right: 10px; background: url(../imagens/selo_analytics.jpg) no-repeat; } * html #coluna1 #certificados li.analytics { margin-right: 5px; } /* ------- COLUNA 2 ------- */ #coluna2 { min-height: 300px; margin-left: 250px; padding: 10px 12px; } * html #coluna2 { height: 300px; } /* ------- TRABALHOS ------- */ #trabalhos { margin-top: 100px; } #trabalhos dt { height: 30px; padding-left: 15px; background: url(../imagens/bg_titulos.gif) 0 center no-repeat; font-size: 2.2em; line-height: 30px; color: #555959; } #trabalhos dd { margin-bottom: 57px; } #trabalhos dd .trabalho_flash { position: relative; width: 950px; margin: 0 -40px 15px; } #trabalhos dd .botao { display: block; width: 118px; height: 32px; background: url(../imagens/bt_visite_site.gif) no-repeat; text-indent: -999em; overflow: hidden; } #trabalhos dd .botao:hover { background-position: 0 bottom; } #trabalhos dd p { width: 690px; } /* ------- RODAPE ------- */ #rodape { padding-bottom: 60px; } #rodape #clientes { position: relative; width: 896px; height: 376px; margin: 0 0 60px -5px; padding-top: 7px; background: url(../imagens/bg_clientes.png) no-repeat; } #rodape #clientes h4 { width: 102px; height: 13px; margin-left: 30px; background: url(../imagens/bg_clientes_titulo.gif) no-repeat; text-indent: -999em; overflow: hidden; } #rodape #clientes ul { width: 848px; margin: 35px auto 0; list-style: none; } #rodape #clientes ul li { float: left; width: 212px; height: 60px; margin-bottom: 15px; /*background: url(../imagens/separador_clientes.gif) 0 center no-repeat;*/ text-align: center; } #rodape #clientes ul li.primeiro { background: none; } #rodape #clientes ul li a { outline: 0; } #rodape #clientes ul li a img { border: 0; } #rodape .twitter { float: right; width: 203px; height: 52px; background: url(../imagens/twitter.png) no-repeat; } #rodape .twitter a { display: block; width: 100%; height: 100%; text-indent: -999em; overflow: hidden; } #rodape .vcard .fn, #rodape .vcard .org { display: none; } #rodape .vcard address { font-style: normal; } /* -------------- PAGINAS -------------- */ /* ------- HOME ------- */ #home #topo h2 { background: url(../imagens/logo_midia_digital.png) no-repeat; text-indent: -999em; overflow: hidden; } #home #coluna2 h3 { margin-bottom: 14px; } /* ------- INTERNA ------- */ /* .interna #topo h2 { position: absolute; z-index: 3; top: 67px; left: -10px; width: 410px; height: 169px; } .interna #topo h2 a { display: block; width: 410px; height: 169px; background: url(../imagens/logo_midia_digital.png) no-repeat; text-indent: -999em; overflow: hidden; } .interna #topo #flash_topo h2 { top: 61px; left: 85px; } .interna #topo #flash_topo h2 a { width: 420px; background: none; } */ .interna #conteudo h1 { margin-bottom: 25px; font-size: 2em; } .interna #menu_local { list-style: none; } .interna #menu_local li { padding: 0 0 8px 0; background: url(../imagens/base_link_2.gif) 0 bottom no-repeat; } .interna #menu_local li a { font-size: 1.5em; text-transform: lowercase; color: #ec0000; } .interna #menu_local li a:hover { color: #282d2d; } .interna #rodape { margin-top: 30px; } /* ------- CONTATO ------- */ #contato #coluna2 { /* position: relative; */ padding-right: 0; } #contato #frmcontato { margin-bottom: 50px; } #contato #frmcontato fieldset { position: relative; border: 0; } #contato #frmcontato ol { padding-bottom: 10px; list-style: none; } #contato #frmcontato li { margin-bottom: 12px; } #contato #frmcontato li label { float: left; display: block; width: 60px; padding-left: 20px; font-size: 1.45em; } #contato #frmcontato li.mensagem label { width: 90px; } #contato #frmcontato li input { width: 520px; } * html #contato #frmcontato li input { width: 514px; } #contato #frmcontato li textarea { width: 490px; padding: 3px; } * html #contato #frmcontato li textarea { width: 484px; } #contato #frmcontato button { display: block; width: 86px; height: 32px; border: 0; background: url(../imagens/bg_bt_comentario.gif) no-repeat; text-indent: -999em; overflow: hidden; } #contato #frmcontato button:hover { background-position: 0 bottom; } /* ------- TRABALHE CONOSCO ------- */ #contato #coluna2 h3 { margin-bottom: 25px; font-weight: bold; font-size: 2em; } #contato #frmtrabalhe { margin-bottom: 50px; } #contato #frmtrabalhe fieldset { position: relative; border: 0; } #contato #frmtrabalhe ol { padding-bottom: 10px; list-style: none; } #contato #frmtrabalhe li { margin-bottom: 12px; } #contato #frmtrabalhe li label { float: left; display: block; width: 60px; padding-left: 20px; font-size: 1.45em; } #contato #frmtrabalhe li input { width: 520px; } #contato #frmtrabalhe li input#site { width: 236px; } * html #contato #frmtrabalhe li input { width: 514px; } #contato #frmtrabalhe li.descricao label { float: none; width: auto; } #contato #frmtrabalhe li.descricao textarea { width: 580px; margin: 5px 0 0 20px; padding: 3px; } * html #contato #frmtrabalhe li.descricao textarea { width: 574px; } #contato #frmtrabalhe li.anexo label { width: 265px; } #contato #frmtrabalhe li.anexo input { width: auto; } #contato #frmtrabalhe button { display: block; width: 86px; height: 32px; border: 0; background: url(../imagens/bg_bt_comentario.gif) no-repeat; text-indent: -999em; overflow: hidden; } #contato #frmtrabalhe button:hover { background-position: 0 bottom; } /* ------- USABILIDADE ------- */ #contato #frmusabilidade { margin-bottom: 50px; padding-top: 20px; } #contato #frmusabilidade fieldset { position: relative; border: 0; } #contato #frmusabilidade ol { padding-bottom: 10px; list-style: none; } #contato #frmusabilidade li { margin-bottom: 12px; } #contato #frmusabilidade li label, #contato #frmusabilidade li.radio span.label { float: left; display: block; width: 80px; font-size: 1.45em; line-height: 25px; } #contato #frmusabilidade li.radio label { float: none; display: inline; width: auto; padding: 0 5px; font-size: 1.45em; } #contato #frmusabilidade li.radio input { width: auto; } #contato #frmusabilidade li.mensagem label { width: 120px; } #contato #frmusabilidade li.mensagem p { margin-left: 120px; } #contato #frmusabilidade li input { width: 500px; } #contato #frmusabilidade li input#idade_usabilidade { width: 25px; } #contato #frmusabilidade li input#tel_cod { width: 30px; } #contato #frmusabilidade li input#tel_usabilidade { width: 70px; } #contato #frmusabilidade li input#profissao_usabilidade { width: 280px; } #contato #frmusabilidade li input#email_usabilidade { width: 280px; } * html #contato #frmusabilidade li input { width: 514px; } #contato #frmusabilidade li textarea { width: 480px; padding: 3px; } * html #contato #frmusabilidade li textarea { width: 484px; } #contato #frmusabilidade button { display: block; width: 86px; height: 32px; border: 0; background: url(../imagens/bg_bt_comentario.gif) no-repeat; text-indent: -999em; overflow: hidden; } #contato #frmusabilidade button:hover { background-position: 0 bottom; } #contato #frmusabilidade #pop_up_aviso { margin-top: -15px; }