/* CSS Document */ body { text-align: center; margin:0; padding:0; background-image:url(imagens/bg.jpg); background-repeat:repeat-x;/* deixando o alinhamento do body centralizado */ font-family:Trebuchet MS,Arial, Tahoma; background-color:#FFFDEA; } a:link { color: #000000; text-decoration: underline; } a:visited { color: #CCCCCC; } a:hover { text-decoration: none; color: #F27758; } img{ border:none; } /*boxes*/ #geral { width: 770px; /* definindo 530px para a largura do div */ margin: auto; /* colocando auto, para que o #geral fique de acordo com o alinhamento do body, ou seja, centralizado */ background: #FFF url("imagens/corpo.gif") repeat-y; /* definido o background para branco e a imagem corpo.jpg como fundo repetindo somente na vertical */ } #topo_site{ width:770px; height:159px; padding-bottom:5px; } #topo { background: #FFF url("imagens/topo.gif") no-repeat; /* definido o background para branco e a imagem topo.jpg como fundo sem repetição */ height: 37px; /* definido a altura para que a imagem de background seja visualizada */ } #conteudo { padding: 0 20px; /* definindo padding de 0 para a base e topo e 20px para as laterais para que o conteúdo não cole nas extremidades */ text-align: left; /* definindo o alinhamento do texto da div para esquerda, já que a do body está center */ } #rodape { background: #FFF url("imagens/rodape.gif") ; /* definido o background para branco e a imagem rodape.jpg como fundo sem repetição */ height: 37px; /* definido a altura para que a imagem de background seja visualizada */ clear: both; /* definindo o clear para futuras atualizações que o conteúdo pode ter, com divs possuindo floats não interfira no rodapé */ } #menu{ background-image:url(imagens/fundo_menu.gif); background-repeat:no-repeat; width:222px; height:410px; float:left; } #lim{width:400px;} #lim li{ position:relative; } #centro{ width:500px; float:left; font-size:90%; color:#333333; background-repeat:no-repeat; padding-left:5px; } #centro a,a:visited{ color: #000000; } #centro a:hover { text-decoration: none; color: #F27758; } #montanha{ margin-left:10px; background-image:url(imagens/montanha.jpg); background-repeat:no-repeat; height:54px; clear: both; /* definindo o clear para futuras atualizações que o conteúdo pode ter, com divs possuindo floats não interfira no rodapé */ } #by{ margin:auto; width:770px; font-size:70%; text-align:right; } #by a, a:visited{ color:#333333; text-decoration:none; } .box_pecas { border:1px solid #ccc; width:320px; margin:auto; margin-bottom:8px; } .box_pecas span { background-color:#f1f1f1; display:block; text-align:center; font-size:80%; border-top:1px dashed #ccc; } /*MENU*/ ul#topicos { display:block; width:225px; height:32px; margin:0px; padding:0px; list-style-type:none; font-family:Trebuchet MS,Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:75%; } ul#topicos li a:link, ul#topicos li a:visited { display:block; height:32px; width:201px; text-decoration:none; color:#FFFFFF; padding-left:18px; padding-top:20px; background-image:url(imagens/fundo_item.gif); background-repeat:no-repeat; position:relative; left:11px; top:40px; font-weight:bold; } ul#topicos li a:hover { display:block; height:32px; color:#660099; background-image:url(imagens/fundo_item_over.gif); } /*MINI FOTO*/ .central{ text-align:center; } .geral_foto { width: 141px; height:90px; margin: auto; float:left; text-align:center; padding-left:3px; position:relative; left:21%; } span.topoRedondo, span.baseRedondo { display:block; /* deixando o display dos span como block, já que o padrão é inline e é necessário para visualização correta */ background: transparent; /* deixando o background tranparente para que sempre que mudarmos a cor de fundo do por exemplo, não seja necessário a mudança aqui. */ } span.topoRedondo span, span.baseRedondo span { display: block; /* deixando o display dos span como block, já que o padrão é inline e é necessário para visualização correta */ height: 1px; /* declarando a altura dos spans poara 1px */ overflow: hidden; /* ocultando todo o conteúdo que poderia ser visualizado no span. Todo espaço é reduzido. Sem isso, no i.e. não é visualizado corretamente. */ background: #F27758; /* definindo a cor de fundo dos spans para verde. Sempre que quiser mudar a cor, essa é a parte que deverá ser alterada. */ } span.rum { margin:0 5px; } /* Definindo a margem para 5px para as laterais e 0 para base e topo para o primeiro span */ span.rdois { margin:0 3px; } /* Definindo a margem para 3px para as laterais e 0 para base e topo para o segundo span */ span.rtres { margin:0 2px; } /* Definindo a margem para 2px para as laterais e 0 para base e topo para o terceiro span */ span.rquatro { margin: 0 1px; height: 2px; } /* Definindo a margem para 1px para as laterais e 0 para base e topo para o quarto span e definido a altura para ele de 2px, a única altura diferente dos demais.*/ .meioRedondo { background: #FFFFFF; /* definindo a cor de fundo dos spans para verde. Sempre que quiser mudar a cor, essa é a parte que deverá ser alterada. (Sempre deixar a mesma cor dos spans acima) */ color: #000; /* definido a cor preta para o texto */ margin: 0; /* zerando a margem */ padding: 5px 15px; /* definindo padding de 5px para a base e o topo e 15px para as laterais, para que o conteúdo não fique colado nas bordas. */ border:1px solid #CCCCCC; } #tabela_fotos{ margin-left:9%; } #tabela_fotos img { padding:8px; border:1px solid #ccc; margin:6px; } #tabela_fotos a:hover img { background-color:#F27758; border:1px solid #ccc; } .flutuar_esq{float:left;} .nome_excursao{ text-align:center; } /*FORMATACOES */ h6 { font-size:100%; margin:0; padding:0; display:inline; } h5{ color:#999999; font-size:80%; } h3{ text-transform:uppercase; font-size:90%; color:#666; margin:0; padding:0; border-bottom:1px dashed #666; } h3 img{ margin-right:5px; } h3 a:link{ text-decoration:none; } .lista{ color:#F27758; } .data{ color:#FFFFFF; background-color:#F27758; padding:0 2px 0 2px; border-right:2px solid #990000; border-left:2px solid #990000; width:100%; } .voltar{ float:right; font-size:85%; } .voltar a, a:visited{ color:#FFFFFF; text-decoration:none; } .voltar a:hover{ color:#000; } /*FORMULARIOS*/ input{margin-top:3px;} .form{border: 1px solid #CCCCCC;background-color:#F7F7F7; color:#333333; font-family:Arial, Tahoma, Verdana; font-size:12px; width:320px;padding-left:3px;margin-right:15px;} .formulario{ } .fild_form{ border:none; width:430px; } #formulario label{ float: left; width: 80px; margin-left:5px; } .textarea{ background-color:#F7F7F7; width:320px; height:60px; border: 1px solid #CCCCCC; font-family:Arial, Tahoma, Verdana; font-size:12px; padding-left:3px; margin-top:3px; } .select{ background-color:#F7F7F7; border: 1px solid #CCCCCC; margin-top:3px; } #enviar{ position:relative; left:88px; top:5px; } #limpar{ position:relative; left:100px; top:5px; } /*BOXES*/ .box_produtos_on { border-left:1px solid #666; border-right:1px solid #666; border-bottom:1px solid #666; margin:0; padding:5px; } .box_produtos_off { border-left:1px solid #666; border-right:1px solid #666; border-bottom:1px solid #666; margin:0; padding:5px; display:none; } /*TABELAS*/ table.tabela {border-collapse: collapse;} table.tabela tr td {border:1px solid #ccc;} .tabela { width:450px; text-align:center; } .tr_colorida { background-color:#ffcc00; font-weight:bold; }