Pagseguro





Bloq

1 . Introdução
Obrigado por ter adquirido o nosso tema.
Este documento cobre a instalação e utilização deste tema e muitas vezes dá respostas para problemas comuns e questões.
Eu sugiro que você leia este documento cuidadosamente se você encontrar quaisquer dificuldades .
1.1 Ajuda e suporte
Se você teve um problema com o tema ou encontrou um bug , por favor deixe-nos saber na seção "Comentários" .
É impossível testar todos os plug-in desenvolvido para WordPress e, infelizmente, há um bom número que causar problemas para muitos temas em geral. Se você está tendo uma edição do tema , por favor, primeiro desligue todos os plugins de terceiros para ver se o problema persiste.
Se assim for, teremos o maior prazer em ajudá-lo.
Por favor note que nós não realizar personalizações temáticos.
Estamos felizes em ajudá-lo com a instalação e todos os erros que você pode encontrar , mas não podemos apoiar modificações CSS para seu tema.
Ao mesmo tempo , nós convidamos você a visitar frequentemente visite nosso perfil no ThemeForest pois não será exibido as melhorias do nosso projeto e as mais recentes atualizações .
2 . Instalando o tema
Algumas palavras sobre como começar com o seu mais recente tema WordPress.
2.1 arquivos incluídos
Depois de baixar o pacote do tema da ThemeForest , un- zip a pasta.
Dentro do pacote você vai encontrar os seguintes arquivos:

bloq /

bloq.zip

documentação /

- dados fictícios

licenciamento /
2.2 As opções de instalação
Para instalar este tema você deve ter uma versão de trabalho do WordPress instalado em seu computador .
Para obter informações sobre a instalação da plataforma WordPress, consultar o WordPress Codex http://codex.wordpress.org/Installing_WordPress .
Há duas maneiras de instalar o tema:
1 .
Carregar a partir de FTP
2 .
Carregar a partir do painel de administração
2.2.1 Transferir do FTP
Carregar a pasta Bloq un- zip para a pasta wp-content/themes .
Por favor, certifique-se de que você está carregando a pasta do tema não- compactado , e não todo o pacote que você baixou.
Se você carregar o arquivo errado (o pacote ) você receberá um erro informando "Erro: . Faltando style.css stylesheet"
Uma vez carregado , ative o tema, indo para o menu " Temas " no painel do WordPress . Localize o tema Bloq e clique em " Ativar " .
2.2.2 Transferir do painel de administração
Ir para Aparência > Temas > Temas > Instale upload e escolha o arquivo bloq.zip .
Ir para Aparência > Temas e clique em " Ativar " abaixo tema Bloq .
Quando o upload do seu tema através do painel de instrumentos , por favor, certifique-se de fazer o upload do arquivo de tema bloq.zip , e não todo o pacote que você baixou !
2.3 Atualizações
Nós convidamos você a visitar frequentemente o nosso perfil no ThemeForest já que estarei postando lá todas as melhorias do nosso projeto e as mais recentes atualizações .
3 . opções de tema
Este tema tem um painel intuitivo e fácil de usar administração que lhe permite personalizar as principais características e funções. Aqui você pode alterar muitos aspectos centrais que compõem o seu tema como parece e se comporta .
Para ver o painel, navegar Navegar Appearance> Opções de tema.
Assim que terminar de personalizar o tema , lembre-se de salvar as configurações pressionando o botão " Salvar todas as alterações " na parte inferior da página.
3.1 Definições gerais
3.1.1 logotipo personalizado de upload
Fazer upload de um logotipo personalizado para o seu site.
Se você não quiser usar uma imagem , clique em "Remover" .
3.1.2 favicon personalizado carregamento
Carregar um favicon personalizado para o seu site.
Se você não quiser usar uma imagem , clique em "Remover" .
3.1.3 toque personalizado ícone de upload
Envie um ícone toque personalizado para o seu site.
Se você não quiser usar uma imagem , clique em "Remover" .
3.1.4 E-mail formulário de contato
Digite o endereço de e-mail onde você gostaria de receber seus e-mails a partir do formulário de contato, ou deixe em branco para usar o e-mail do administrador.
Navegue Usuários> ... para ver seus usuários do website .
3.1.5 endereço do Google Maps
Insira o seu endereço do Google Maps para o mapa gerado pelo modelo de contato ( veja o capítulo 4.3.1) .
3.1.6 Código de Rastreamento (Google Analytics)
Cole o código de acompanhamento ( Google Analytics) aqui.
3.2 opções de estilo
3.2.1 Tema estilo
O tema oferece 10 estilos . Escolha o seu estilo favorito.
Você pode alterar a sua seleção a qualquer momento.
1 .
esmeralda
2 .
Maçã Verde
3 .
rio
4 .
Midnight Blue
5 .
pôr do sol
6 .
cenoura
7 .
tango
8 .
prata
9 .
concreto
10 .
escuro
3.2.2 fontes do tema
O tema oferece , além das fontes padrão , um número de conjunto de caracteres de fontes web do Google , selecione a fonte mais adequada para o seu site.
http://www.google.com/webfonts
3.2.3 Início carteira itens
Através desta opção, você pode definir o número de carteira de itens que você pode ver na página inicial.
Para ver todos os itens de portfólio ( infinito ) digite "-1" .
Se o campo for deixado em branco , o número definido em Configurações > Leitura > páginas do blog mostram no máximo ... post será usada como padrão.
3.2.4 Formulário de contacto
Através desta opção , você pode escolher se deseja exibir ou não o formulário de contato no modelo de contato ( ver modelos chapeter 4.5.1 página personalizados > Contato ) .
3.3 Início slideshow
Por padrão, a apresentação de slides na página inicial (modelo Home) mostra os itens selecionados da carteira . Neste painel, você pode criar um novo controle deslizante para a página inicial e ativá-lo no lugar do padrão.
Caso contrário, na página inicial de apresentação de slides os itens carteiras selecionadas neste período ( ver capítulo. 4.2.4 extras Portfolio > opções de Slides ) .
3.4 Blog slideshow
Por padrão, a apresentação da página Blog mostra os itens selecionados da carteira . Neste painel , você pode criar um novo controle deslizante para a página de Blog e ativá-lo no lugar do padrão.
Caso contrário, o controle deslizante na página Blog as mensagens selecionadas serão mostradas ( ver capítulo. 4.1.4 Pós extras > opções de Slides ) .
3.5 slideshow Portfolio
Por padrão, a apresentação de slides na página de Portfolio (modelo Portfolio ) mostra os itens selecionados da carteira . Neste painel , você pode criar um novo controle deslizante para a página de Portfólio e ativá-lo no lugar do padrão.
Caso contrário, na Carteira deslizante os itens Carteira selecionados serão mostrados (veja o capítulo . 4.2.4 Portfólio extras > opções de Slides ) .
3,6 configurações sociais
Aqui você vai fornecer os links para os perfis de rede sociais que você tem. Cole o URL de perfil de usuário . Se você deixar o campo vazio , os ícones no rodapé não será mostrado .
Os mesmos ícones podem ser usados ​​com os ícones sociais especiais Widget .
Ir para Aparência> Widgets para colocar e configurar os ícones Widget Sociais ( veja o capítulo 4.6.2 Ícones Sociais) .
4 . Tema criado
Aqui são os primeiros passos para a criação de seu novo tema.
4.1 Adicionando blogue
Para criar a página Blog, primeiro você deve criar uma nova página. Você pode fazer isso, vá em Páginas > Adicionar novo. Você pode dar um nome de sua escolha ( no demo usamos "Blog" ) .
Selecione a página template " modelo padrão " e clique em " Publicar" .
O conteúdo desta página não está visível no front-end ; desta página só é usado para ativar o "Blog" . Os outros " configurações de cabeçalho " Opções são, então, também desativado.
Uma vez que você criou a sua nova página do blog , vá até Configurações > Leitura e configurar a definição " A página inicial mostra " . Selecione a opção de página estática e escolher a página que você acabou de criar como sua página Posts (veja o capítulo 4.8 configurações de Leitura ) . Sua página do blog já foi criado.
Para o modelo alternativo Blog ver capítulo 4.3.1 .
4.1.1 Adicionando um novo item do blog
De dentro do seu WordPress Dashboard, navegue até a guia " Mensagens " (localizado na barra lateral do Dashboard) e clique em " Adicionar novo" .
Insira um nome, selecione o formato de mensagem na barra lateral direita , inserir texto e qualquer mídia que você gosta e selecione o formato de campos específicos meta aparecerá abaixo do editor.
Depois de terminar , clique em " Publicar" .
4.1.2 Inserindo imagem destaque do item do blog
Para criar a miniatura para o seu item blog, clique em " Set featured imagem " na janela "Imagem em Destaque ", localizado à direita.
Selecione a imagem que você quer a partir da biblioteca de mídia ou fazer upload de um novo e , em seguida, clique em " Definir imagem de destaque " .
O tema suporta o uso de imagens em destaque. O tema suporta auto - redimensionamento das imagens de destaque para que a única exigência é a de especificar uma única imagem.
No entanto , de auto - redimensionamento apenas ocorrerá quando a imagem é carregada pela primeira vez . As imagens que foram previamente carregados não será redimensionada .
Para mais informações sobre como usar os WP2.9 + Post Thumbnail recurso que você pode ver este artigo http://en.support.wordpress.com/featured-images/ .
4.1.3 opções de Pós meta
Na barra lateral direita você pode escolher e / ou criar as categorias e as tags para link para o post .
4.1.4 Pós extras
Abaixo do painel de conteúdo , você vai encontrar alguns painéis adicionais que permitem que você personalize o seu post.
opções de Slides
Através desta opção você pode escolher se deseja publicar o post no blog do Slideshow ou não ( ver também o capítulo 3.4 Blog slideshow ) .
No slideshow a imagem carregada nas " configurações de cabeçalho "
painel abaixo será usado e o título do post como legenda.
configurações de cabeçalho
Neste painel , você pode configurar / upload de uma imagem para o cabeçalho do post.
Se você não quer que a imagem a ser mostrada no cabeçalho, você terá que definir o " cabeçalho de imagem Disable" .
4.2 Adicionando portfólio
Para criar a página Portfolio , primeiro você deve criar uma nova página. Você pode fazer isso, vá em Páginas > Adicionar novo. Você pode dar um nome de sua escolha ( no demo usamos " Carteira") . Selecione o modelo de página " Portfólio " e clique em "Publicar" .
O modelo da página de Portfolio está estruturado da seguinte forma:

Título: o título da página Portfolio você criou .

Conteúdo: o conteúdo da página Portfolio (você também pode deixá-lo em branco).

Itens Carteira previews : todas as antevisões dos itens da carteira do seu site.
4.2.1 Adicionando novo item de portfolio
Para adicionar um novo item de portfolio , navegue até os itens Portfólio > Adicionar novo.
Insira um nome, texto e qualquer mídia que você gosta . Em seguida, clique em "Publicar " .
4.2.2 Inserindo imagem destaque do item portfolio
Para criar a miniatura para o seu item de portfólio, clique em " Definir imagem de destaque " na janela "Imagem em Destaque ", localizado à direita.
Selecione a imagem que você quer a partir da biblioteca de mídia ou fazer upload de um novo
um e , em seguida, clique em " Definir imagem de destaque " .
O tema suporta o uso de imagens em destaque. O tema suporta auto - redimensionamento das imagens de destaque para que a única exigência é a de especificar uma única imagem.
No entanto , de auto - redimensionamento apenas ocorrerá quando a imagem é carregada pela primeira vez , as imagens que foram previamente carregados não irá ser redimensionada .
Para mais informações sobre como usar os WP3.5 + Post Thumbnail recurso que você pode ver este artigo http://en.support.wordpress.com/featured-images/ .
4.2.3 Competências
No painel " Skills " no lado direito , você pode escolher e / ou criar as habilidades para ligar para o seu post.
Tipos de habilidade pode ser atribuída , a fim de organizar melhor a sua carteira. Eles são como categorias de artigos e atribuindo-os a cada carteira post, fica mais fácil de navegar e filtrar a sua carteira.
4.2.4 extras Portfolio
Abaixo do painel de conteúdo existem painéis adicionais que permitem que você personalize o seu post.
opções de Slides
Através desta opção você pode decidir se deseja publicar o post em casa Slideshow e carteira ou não (ver também capítulos 3,3 e 3,5 Início slideshow slideshow Portfolio ) .
No slideshow a imagem enviada no painel " configurações de cabeçalho " abaixo será usado e o título do post como legenda.
configurações de cabeçalho
Neste painel , você pode configurar / upload de uma imagem para o cabeçalho do post.
Se você não quer que a imagem a ser mostrada no cabeçalho, você precisa definir "cabeçalho imagem Disable" .
reivindicação
Neste painel , você pode inserir o texto de Reivindicação.
Se o campo for deixado em branco , o pedido não será mostrado.
extras Portfolio
Neste painel, você pode configurar :

Atual cor portfolio cobertura : use a colorpicker ou inserir o hexadecimal da cor que você quiser.

Atual cor título carteira: usar o colorpicker ou inserir o hexadecimal da cor que você quiser.

Começando " Amor- lo " número : você pode definir o valor de partida para o " Amor- lo " a contagem.

Layout da página : para o item portfolio dois layouts são fornecidos:

Largura total : uma única coluna largura .

Sidebar : nesta opção , você tem um campo de texto adicional "Adicionar texto barra lateral opcional " para a barra lateral disponível.
4.3 formatos Postar
Este tema suporta o uso de diferentes formatos de post, a fim de mudar a aparência do seu conteúdo. Formatos Postar dar-lhe uma boa dose de controle sobre a forma como cada um de seus posts será colocado para fora .
O tema suporta Padrão, Galeria , Vídeo e citações formatos.
4.3.1 padrão
O formato padrão post é o formato padrão e aquele que você provavelmente vai usar mais . Este formato funciona exatamente como você esperaria de qualquer outro post típico , a aparência do seu conteúdo, é basicamente não alterada.
4.3.2 Gallery
O formato de galeria pós apresenta uma galeria de slider. Você tem que inserir o seu conteúdo como de costume. Para fazer upload de imagens , clique no botão "Add media" e fazer o upload das imagens que você deseja usar para a galeria.
Depois de ter carregado as imagens , feche o painel ( sem clicar no botão "Inserir no post" , caso contrário, as imagens que você acabou enviados também será visto no conteúdo do post ) .
Não há mais passos a seguir , todas as imagens enviadas serão automaticamente mostrados em sua galeria. Você pode enviar um número ilimitado de imagens.
4.3.3 Vídeo
Para o formato de vídeo post inserir o seu conteúdo como normal. Você vai encontrar um menu adicional usado para colar o Vimeo ou link de incorporação do Youtube .
4.3.4 Citação
Inserir o texto citação dentro do conteúdo e inserir o autor citação no painel previsto Citação configurações > Quote autor colocado abaixo do conteúdo.
O título do post não será mostrado .

Título pós > não é mostrado

Conteúdo > Citação texto

Citação de configurações > Quote autor
4.3.5 Ligação
Para o formato de ligação pós inserir o texto do link dentro do conteúdo e escrever o URL do link nas configurações do painel de link fornecido > URL link colocado abaixo do conteúdo. O título do post não será mostrado .

Título pós > não é mostrado

Conteúdo > Descrição do link

Link Configurações > Link URL
4.4 Adicionando membros da equipe
Para criar um novo membro da equipe, ir aos membros da equipe > Adicionar novo.
Coloque no título o nome do membro , nos dados dos membros do painel abaixo, você pode inserir uma breve descrição no campo Informações e links para as redes sociais colando a URL de perfil de usuário .
Se você deixar o campo em branco , os ícones sociais não serão mostrados.
Use o painel " Trabalho posições " , a fim de definir a posição / função do membro da equipe .
Use a imagem em destaque , a fim de carregar a imagem / set membro da equipe.
Para ver os membros da equipe em seu site , use o shortcode " Team" fornecido dentro de um post ou uma página.
4.5 Adicionando nova página
Para criar uma nova página, vá para Páginas > Adicionar novo.
4.5.1 modelos de página personalizada
Este tema vem com uma série de modelos de página personalizada embutido. Estes modelos podem ser utilizados em páginas individuais para alterar o mostrador ou funcionalidade .
Selecione o gabarito desejado escolher entre :

modelo padrão

arquivo

Blog largura total

contato

casa

portfolio
Modelo padrão
Por todas as páginas padrão , sem recursos adicionais .
Blog largura total
Este modelo mostra uma página de largura total , sem barra lateral.
arquivo
O tema vem embalado com um modelo de arquivos simples. Para criar os seus arquivos , basta criar uma página usando o "Arquivos" modelo de página .
As listas de arquivo exibirá automaticamente abaixo de qualquer conteúdo da página.
As listas incluem:

Os últimos 30 mensagens

Arquivos por mês

Arquivos por assunto
contato
Este modelo mostra um mapa no cabeçalho da página e um formulário de contato na cauda página .
O endereço de mapa deve ser definido no painel Opções de Tema .
Navegue Appearance > Opções de Tema > Configurações gerais > endereço do Google Maps (veja o capítulo 3.1.6 endereço do Google Maps) .
Os utilizadores mais experientes podem personalizar o seu mapa do Google Maps trabalhando em arquivo de inclusão > jquery.mobilegmap.js .
Para mais informações , por favor visite https://developers.google.com/maps/documentation/javascript/styling .
O endereço de e-mail do formulário de contato deve ser definido no painel Opções temáticos; navegar Appearance > Opções de Tema > Configurações gerais > Contato e-mail forma (veja o capítulo 3.1.5 Formulário de e-mail ) .
Se você não quer que o formulário na página de contato ir para Appearance> opções de estilo > Formulário de contacto e definir "Desativar" .
casa
O modelo inicial é definido da seguinte forma:

cabeçalho

Reivindicação (opcional)

Itens Carteira previews (veja o capítulo 3.2.3 Início carteira itens )

conteúdo
portfolio
O modelo de Portfolio está organizado da seguinte forma:

cabeçalho

Reivindicação (opcional)

Título: o título da página Portfolio você criou .

Conteúdo: o conteúdo da página web Portfolio (você também pode deixá-lo em branco).

Itens Carteira previews : Todos os itens de carteira pré-visualizações do seu site.
Para este modelo consulte o capítulo 4.2 Adicionando portfolio .
4.5.2 Configurações de legenda
Aqui você pode inserir o subtítulo página opcional. Se você não preenchê-lo , sem subtítulo será exibido.
4.5.3 configurações de cabeçalho
Através desta opção , você pode escolher se quer ver ou não a imagem em destaque no cabeçalho da página .
4.6 widgets personalizados
Para utilizar um widget, basta navegar Aparência> Widgets e arraste seus widgets para as áreas de widgets especificados.
Quando você terminar de crating seu widget personalizado , lembre-se de pressionar "Salvar " .
O tema vem com quatro áreas de widgets personalizados que podem ser usados ​​para configurar a forma como o seu site exibe conteúdo :

n ° 1 Widget Blog

n ° 3 Widget rodapé.
4.6.1 Flickr Widget
Este widget permite que você configure e exibir fotos do Flickr photostream a partir de um usuário.
4.6.2 Ícones Sociais
Esse widget exibe os ícones sociais relacionados a você os perfis de rede sociais. Para essas configurações sociais navegar entre as opções de tema > Configurações Sociais, cole seu url perfil de usuário.
Se você deixar o campo vazio , ícone será invisível (veja o capítulo 3.6 configurações Sociais) .
4.6.3 Twitter Widget
Este widget permite que você configure e exibir seus últimos tweets .
4.7 menus personalizados
Ir para Appearance > Menus . Aqui você pode criar o menu para o seu site.
Para criar um menu personalizado que você precisa para atribuir um nome a ela , em seguida, clique em "Criar Menu". Selecione objetos como páginas , categorias ou links personalizados da coluna à esquerda e adicioná-los a este menu.
Quando você terminar de adicionar objetos, você pode colocá-los na ordem que preferir , arrastando-os onde quiser. Você também pode clicar em qualquer objeto para abrir as opções de configuração.
Uma vez que você terminou de construir seu menu personalizado, não se esqueça de clicar no botão "Save Menu".
Depois de criar o menu, certifique-se de atribuir a ele uma posição na janela do lado esquerdo.
4,8 configurações de Leitura
Navegue Configurações> Leitura. Defina " A página inicial mostra " aqui .
Configurações de leitura são muito importantes para criar o seu site Home page e Blog . Se você não configurá-los , os erros na exibição do seu site podem ocorrer.
5 . Shortcodes
Perfeitamente integrado ao editor do WordPress, você vai encontrar o nosso botão gerador de shortcode . Clique no botão para apresentar uma lista de códigos de acesso disponíveis em nosso tema. Quando você seleciona um shortcode pop-ups irá revelar opções para os vários códigos de acesso , tornando mais fácil para implementá-los em suas páginas ou posts .
Não há necessidade de lembrar qualquer sintaxe também, porque cada shortcode é um clique de distância em nosso gerador de shortcode intuitiva.
Para ver códigos de acesso disponíveis do tema Bloq verificar o tema demo e selecione " Shortcodes " a partir do menu.
Os códigos de acesso incluídos são:

Acordeões

Botões

Colunas

caixas de conteúdo

divisores

Encoder Email

Gráfico - Circular

Gráfico - Linear

Ícones

Icons - Mini

Caixas de Notificação

Caixas de Preços

ícones Sociais

Tabs

equipe

Depoimentos
6 . Os arquivos de tema
Esta seção lista os elementos incluídos no tema e suas funções relativas. As informações a seguir o ajudarão a entender o tema e torná-lo mais fácil de usar .
5.1 arquivos CSS
Estes são os arquivos CSS primários utilizados para a geral estilo front-end. Use-os para personalizar ainda mais o seu tema.

estilo / contém todos os arquivos CSS em relação a efeitos Javascript e as fontes disponíveis para o tema.

themes / contém os arquivos CSS relacionadas com as opções de tema , ou seja:

emerald.css Emerald estilo pele do tema ;

verde - apple.css Green Apple estilo pele do tema ;

river.css Rio de estilo da pele do tema ;

meia-noite blue.css Midnight Blue estilo pele do tema ;

sunset.css Pôr do estilo da pele do tema ;

carrot.css Cenoura estilo pele do tema ;

tango.css Tango estilo pele do tema ;

silver.css estilo pele do tema Silver;

concrete.css estilo pele do tema concreto ;

dark.css escuro da pele folha de estilo do tema ;
5.2 arquivos JavaScript
O tema importa vários JavaScripts que permitem o funcionamento tema . Abaixo está uma lista de arquivos e sua função :

jQuery easing: um plugin jQuery para dar opções de flexibilização avançados;

hoverIntent jQuery : um plugin jQuery para o correto funcionamento do menu Superfish ;

jQuery imagesloaded : um plugin jQuery que desencadeia uma chamada de retorno depois de todas as imagens foram carregadas ;

jQuery infinito de rolagem : um plugin jQuery para criar unpaginate , páginas intermináveis ​​;

isótopo jQuery : um plugin jQuery para classificar e filtrar os posts e os itens de portfólio ;

mobilemap jQuery : um plugin jQuery para a melhoria móvel do Google Maps ;

jQuery nicescroll : um plugin jQuery para criar o efeito de rolagem suave.

jQuery desliza : um plugin jQuery para criar slideshow responsivo ;

jQuery superfish : um plugin jQuery para criar os menus;

Supersubs jQuery : um plugin jQuery para melhorar as potencialidades do plugin Superfish ;

jQuery tweet: um plugin jQuery para recuperar os tweets publicados pelo usuário;

jQuery ToTop : um plugin jQuery para chegar facilmente ao cabeçalho da página.


jQuery fitvids : um plugin jQuery para administrar vídeo em cada dimensões

Modernizr : uma biblioteca JavaScript que detecta características HTML5 e CSS3 no navegador do usuário.
7 . Fonte e créditos
Bloq é um projeto Themelovin , todos os direitos reservados. Qualquer reprodução não autorizada ou não licenciada não é permitido. Consulte ThemeForest site para informações de licenciamento .
Mais uma vez, muito obrigado por ter adquirido este tema .
E como sempre, nós amamos ouvir sua opinião ... assim nos atirar um tweet em @ themelovin e, se você se sentir como , taxa sobre este tema na ThemeForest .
Nós realmente agradeceria.

Tabela Loteiras


N° do ConcursoDataN° GanahadoresPrêmio Sorteado
01° - 145531/12/20123244.784.099,16
02° - 124531/12/20104194.395.200,94
03° - 135031/12/20115177.617.487,62
04° - 114031/12/20092142.901.494,92
05° - 122006/06/20101119.142.144,27
06° - 121104/09/10795.522.954,23
07° - 129525/06/2011173.451.540,26
08° - 115727/02/2010472.718.776,04
09° - 127624/04/2011271.408.606,06
10° - 18810/10/1999164.905.517,65

Código vídeo Joomla

<div class="ja-video-thumb">{japopup type="youtube" content="http://www.youtube.com/v/NnD2n_NBGMg?fs=1&amp;hl=en_US&amp;showinfo=0&amp;rel=0" width="640" height="380" title="Joomlart: Happy new year!"}<img src="http://img.youtube.com/vi/NnD2n_NBGMg/1.jpg" border="0" alt="Political Roast : Joomlart: Happy new year!" />{/japopup} {japopup type="youtube" content="http://www.youtube.com/v/i18_4jZbrQ4?hl=en&amp;fs=1" width="660" height="380" title="Beardyman and Reggie Watts on Channel 4 Headspace"}<img src="http://img.youtube.com/vi/i18_4jZbrQ4/2.jpg" border="0" alt="Beardyman and Reggie Watts on Channel 4 Headspace" />{/japopup} {japopup type="youtube" content="http://www.youtube.com/v/YgW7or1TuFk?hl=en&amp;fs=1" width="640" height="380" title="A Closer Look At The iPhone"}<img src="http://img.youtube.com/vi/YgW7or1TuFk/2.jpg" border="0" alt="A Closer Look At The iPhone" />{/japopup} {japopup type="youtube" content="http://www.youtube.com/v/DOvbv-LkK6w?hl=en&amp;fs=1" width="640" height="380" title="Star Wars: The Old Republic E3 2009 Jedi vs. Sith Trailer [HQ]" }<img src="http://img.youtube.com/vi/DOvbv-LkK6w/2.jpg" border="0" alt="Star Wars: The Old Republic E3 2009 Jedi vs. Sith Trailer [HQ]" />{/japopup} {japopup type="youtube" content="http://www.youtube.com/v/ezdfVbOqzRc?hl=en&amp;fs=1" width="640" height="380" title="Bare-Knuckle Brawling : KICK ASS ! | 2009"}<img src="http://img.youtube.com/vi/ezdfVbOqzRc/2.jpg" border="0" alt="Bare-Knuckle Brawling : KICK ASS ! | 2009" />{/japopup} {japopup type="youtube" content="http://www.youtube.com/v/XOZw7sBUI7s?hl=en&amp;fs=1" width="640" height="380" title="Bernard the bear:The desert island"}<img src="http://img.youtube.com/vi/XOZw7sBUI7s/2.jpg" border="0" alt="Bernard the bear:The desert island" />{/japopup}</div>

Folha de estilo Guia123


/* FUNDO GERAL DO SITE */
body {

       background: url('images123/layout/layout_fundo_azul.jpg')
        no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;

 font-family: Georgia, Tahoma, Geneva, Verdana, sans-serif;

  /* background-color:#EAEBD8; */ Fundo apenas com código da cor.
  /* background-image:url('images123/layout/layout_fundo_azul.jpg'); */

}

/* O CONTAINER É A LARGURA DO SITE */
#container {
  position:relative; /* needed for footer positioning*/
  min-height:100%; /* real browsers */
  height:100%; /* IE6: treaded as min-height*/
  padding:0;

margin: 0 auto; /* center, not in IE5 */
width:1000px;
height:auto; !important; /* real browsers */
/* background-color:#FFFFFF; */
BORDER-right: #000000 0px solid;
BORDER-left: #000000 0px solid;
BORDER-top: #000000 0px solid;
BORDER-bottom: #000000 0px solid;
z-index:500000;
height:auto;
overflow: hidden;
min-width:1000px;
}

h1 {font-size:30px;}
h2 {font-size:25px;  color:FF9933; }
h3 {font-size:12px;}
h4 {font-size:16px;}
h5 {font-size:16px;}
h6 {font-size:16px;}
a,a.visited  {color: #58859C;  text-decoration: underline;}
a:hover{color:#000000;}
ul {margin:0 0 0 15px;}
p {margin-top: 0;margin-bottom: 10px;}
blockquote {margin:5px; padding:5px; font-size:18px; font-style:italic}
element.style { height:auto;}
hr { width:100%; clear:both; border:none; height:2px; background:#eee; margin:0; padding:0;}




/* CSS DO MENU DO TOPO */

ul#menutopocss,ul#menutopocss ul{
margin:0;list-style:none;padding:0;background-color:#dedede;border-width:1px;border-style:solid;border-color:#5f5f5f;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;
}
ul#menutopocss ul{
display:none;position:absolute;left:0;top:100%;-moz-box-shadow:3.5px 3.5px 5px #000000;-webkit-box-shadow:3.5px 3.5px 5px #000000;box-shadow:3.5px 3.5px 5px #000000;background-color:#FFFFFF;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;border-color:#d4d4d4;padding:0 10px 10px;
}
ul#menutopocss li:hover>*{
display:block;}
ul#menutopocss li{
position:relative;display:block;white-space:nowrap;font-size:0;float:left;}
ul#menutopocss li:hover{
z-index:1;}
ul#menutopocss{
font-size:0;z-index:9999999999;position:relative;display:inline-block;zoom:1;
*display:inline;}
ul#menutopocss>li{
margin:0;}
* html ul#menutopocss li a{
display:inline-block;}
ul#menutopocss a:active, ul#menutopocss a:focus{
outline-style:none;}
ul#menutopocss a{
display:block;vertical-align:middle;text-align:center;text-decoration:none;font:bold 14px Trebuchet MS;color:#000000;text-shadow:#FFF 0 0 1px;cursor:pointer;padding:10px;background-color:#c1c1c1;background-image:url('images123/layout/menutopo_mainbk.png');background-repeat:repeat;background-position:0 0;border-width:0 0 0 1px;border-style:solid;border-color:#C0C0C0;}
ul#menutopocss ul li{
float:none;margin:10px 0 0;}
ul#menutopocss ul a{
text-align:center;padding:4px;background-color:#FFFFFF;background-image:none;border-width:0;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;font:14px Tahoma;color:#000;text-decoration:none;}
ul#menutopocss li:hover>a,ul#menutopocss a.pressed{
background-color:#f8ac00;border-color:#C0C0C0;border-style:solid;color:#000000;text-decoration:none;text-shadow:#FFF 0 0 1px;background-image:url('images123/layout/menutopo_mainbk.png');background-position:0 100px;}
ul#menutopocss img{
border:none;vertical-align:middle;margin-right:10px;}
ul#menutopocss img.over{
display:none;}
ul#menutopocss li:hover > a img.def{
display:none;}
ul#menutopocss li:hover > a img.over{
display:inline;}
ul#menutopocss li a.pressed img.over{
display:inline;}
ul#menutopocss li a.pressed img.def{
display:none;}
ul#menutopocss span{
display:block;overflow:visible;background-position:right center;background-repeat:no-repeat;padding-right:0px;}
ul#menutopocss li:hover>a,ul#menutopocss li>a.pressed{
background-color:#f8ac00;background-image:url('images123/layout/menutopo_mainbk.png');background-position:0 100px;border-style:solid;border-color:#C0C0C0;color:#000000;text-decoration:none;text-shadow:#FFF 0 0 1px;}
ul#menutopocss ul li:hover>a,ul#menutopocss ul li>a.pressed{
background-color:#FFFFFF;background-image:none;color:#868686;text-decoration:none;}
ul#menutopocss li.topfirst>a{
border-radius:5px 0 0 5px;-moz-border-radius:5px 0 0 5px;-webkit-border-radius:5px;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;}
ul#menutopocss li.topmenu>a{
-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;}
ul#menutopocss li.toplast>a{
border-radius:0 5px 5px 0;-moz-border-radius:0 5px 5px 0;-webkit-border-radius:0;-webkit-border-top-right-radius:5px;-webkit-border-bottom-right-radius:5px;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;


}
/* FIM  DO CSS DO MENU DO TOPO */


/* INCICO DO CSS DO MENU VERTICAL */

ul#menuvertcss {

margin:0;
margin: 5px; padding: 0px 0px;

list-style:none;padding:0;background-color:#dedede;border-width:1px;border-style:solid;border-color:#5f5f5f;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}


ul#menuvertcss ul{

margin:0;
margin: 0px; padding: 0px 0px;

list-style:none;padding:0;background-color:#dedede;border-width:1px;border-style:solid;border-color:#5f5f5f;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}



ul#menuvertcss ul{
display:none;position:absolute;left:100%;top:0;-moz-box-shadow:3.5px 3.5px 5px #000000;-webkit-box-shadow:3.5px 3.5px 5px #000000;box-shadow:3.5px 3.5px 5px #000000;background-color:#FFFFFF;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;border-color:#d4d4d4;padding:0 10px 10px;}
ul#menuvertcss li:hover>*{
display:block;}
ul#menuvertcss li{
position:relative;display:block;white-space:nowrap;font-size:0;}
ul#menuvertcss li:hover{
z-index:1;}
ul#menuvertcss{
font-size:0;z-index:999;position:relative;display:inline-block;zoom:1;
*display:inline;}
ul#menuvertcss>li{
margin:0;}
ul#menuvertcss a:active, ul#menuvertcss a:focus{
outline-style:none;}
ul#menuvertcss a{
display:block;vertical-align:middle;text-align:left;text-decoration:none;font:bold 14px Trebuchet MS;color:#000000;text-shadow:#FFF 0 0 1px;cursor:pointer;padding:10px;background-color:#c1c1c1;background-image:url('images123/layout/mainbk.png');background-repeat:repeat;background-position:0 0;border-width:1px 0 0 0;border-style:solid;border-color:#C0C0C0;}
ul#menuvertcss ul li{
float:none;margin:10px 0 0;}
ul#menuvertcss ul a{
text-align:left;padding:4px;background-color:#FFFFFF;background-image:none;border-width:0;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:14px Tahoma;color:#000;text-decoration:none;}
ul#menuvertcss li:hover>a,ul#menuvertcss a.pressed{
background-color:#f8ac00;border-color:#C0C0C0;border-style:solid;color:#000000;text-decoration:none;text-shadow:#FFF 0 0 1px;background-image:url('images123/layout/mainbk.png');background-position:0 100px;}
ul#menuvertcss img{
border:none;vertical-align:middle;margin-right:10px;}
ul#menuvertcss img.over{
display:none;}
ul#menuvertcss li:hover > a img.def{
display:none;}
ul#menuvertcss li:hover > a img.over{
display:inline;}
ul#menuvertcss li a.pressed img.over{
display:inline;}
ul#menuvertcss li a.pressed img.def{
display:none;}
ul#menuvertcss span{
display:block;overflow:visible;background-position:right center;background-repeat:no-repeat;padding-right:0px;}
ul#menuvertcss li:hover>a,ul#menuvertcss li>a.pressed{
background-color:#f8ac00;background-image:url('images123/layout/mainbk.png');background-position:0 100px;border-style:solid;border-color:#C0C0C0;color:#000000;text-decoration:none;text-shadow:#FFF 0 0 1px;}
ul#menuvertcss ul li:hover>a,ul#menuvertcss ul li>a.pressed{
background-color:#FFFFFF;background-image:none;color:#868686;text-decoration:none;}
ul#menuvertcss li.topfirst>a{
border-width:0;border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px;-webkit-border-bottom-right-radius:0;-webkit-border-bottom-left-radius:0;}
ul#menuvertcss li.toplast>a{
border-radius:0 0 5px 5px;-moz-border-radius:0 0 5px 5px;-webkit-border-radius:0;-webkit-border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;}

/* MENU VERTICAL FIM */

/* CONTEUDO DO SITE */
#conteudo  {
width: 1000px;
}

#barraesquerda {
width: 0px;
}

#barracentral  {
width: 700px;
float:left;
}

#barradireita {
width: 300px;
float:left;
}


#barraesquerda1de2 {
width: 500px;
float:left;
}

#barradireita2de2  {
width: 500px;
float:right;
}



/* CONTEUDO DO SITE */
#conteudo_loja  {
width: 1000px;
}

#barraesquerda_loja {
width: 220px;
  float:left;
}

#barracentral_loja  {
width: 780px;
float:left;
}

#barradireita_loja {
width: 0px;
float:left;
}


/* CONTEUDO DO SITE */




/* LAYOUT COM 3 INICIO */
#barraesquerda_1de3 {
width: 220px;
  float:left;
}
#barracentral_2de3 {
width: 560px;
  float:left;
}
#barradireita_3de3 {
width: 220px;
  float:left;
}
/* LAYOUT COM 3 FIM */




/* MENU INTERNO ÁREA DOS CLIENTES */

#sddm
{ margin: 0;
padding: 0;
white-space: nowrap;

z-index: 30}

#sddm li
{ margin: 0;
padding: 0;
white-space: nowrap;

list-style: none;
float: left;
font: bold 11px arial}

#sddm li a
{ display: block;
margin: 0 1px 0 0;
padding: 4px 10px;
background: #5970B2;
color: #FFF;
text-align: center;
white-space: nowrap;

text-decoration: none}

#sddm li a:hover
{ white-space: nowrap;

background: #49A3FF}

#sddm div
{
z-index:9999999;
position: absolute;
visibility: hidden;
margin: 0;
padding: 0;
white-space: nowrap;

background: #EAEBD8;
border: 1px solid #5970B2

}

#sddm div a
{
z-index:9999999;
position: relative;
display: block;
margin: 0;
padding: 5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
background: #EAEBD8;
color: #2875DE;
font: 11px arial

}

#sddm div a:hover
{

white-space: nowrap;

background: #49A3FF;
color: #FFF}
/* FINAL MENU INTERNO ÁREA DOS CLIENTES */



/* MENU RODAPE */
#menurodape li {

padding: 0px 0px 5px 0px;
font-size: 12px;
line-height: 15px;
font-weight: bold;
color: black;

}
#menurodape ul {
list-style-type: none;
/* height: 80px; */
margin: auto;
padding: 10px 10px 0 10px;
}
#menurodape h3 {
margin: -10px;
padding: 10px 10px 0 10px;
display: block;
font-size: 16px;
line-height: 15px;
color: white;
text-shadow: 1px 1px black;
}
/* FIM DO MENU RODAPE */


/* CAIXAS */
.caixa {
color: #333;
background-color: #fafafa;
margin: 5px;
padding: 5px 10px;
border: 1px solid #f1f1f1;

-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;
}
.caixa:hover {
color: #333;
background-color: #fff;
}
.caixa h3{
border-bottom:1px solid #ccc;
font-size:9px;
font-weight:bold;
letter-spacing:2px;
margin-bottom:20px;
text-transform:uppercase;
}
/* FINAL CAIXA */











/* CAIXAS ESCURA  */
.caixa_escura {

background:#CCCCCC;
background:-moz-linear-gradient(90deg, #CCCCCC, #FFFFFF); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#CCCCCC), to(#FFFFFF)); /* Webkit */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#FFFFFF'); /* for IE */

margin: 5px;
padding: 5px 10px;
border: 1px solid #f1f1f1;

  -moz-border-radius: 7px; /* Firefox */
  -webkit-border-radius: 7px; /* Safari and Chrome */
  border-radius: 7px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */

  -moz-box-shadow: 0px 0px 5px #999; /* Firefox */
  -webkit-box-shadow: 0px 0px 5px #999; /* Safari and Chrome */
  box-shadow: 0px 0px 5px #999999; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */

  behavior: url(ie-css3.htc); /* This lets IE know to call the script on all elements which get the 'box' class */

}

.caixa_escura h3{
/* border-bottom:1px solid #ccc; */
font-size:9px;
font-weight:bold;
letter-spacing:2px;
margin-bottom:20px;
text-transform:uppercase;
}
/* FINAL CAIXA ESCURA */


/* CAIXA CLARA */
.caixa_clara {
color: #333;
background-color: #fff;
margin: 5px;
padding: 5px 10px;
border: 1px solid #f1f1f1;
-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;
}
.caixa_clara:hover {
color: #333;
background-color: #fff;
}
.caixa_clara h3{
border-bottom:1px solid #ccc;
font-size:9px;
font-weight:bold;
letter-spacing:2px;
margin-bottom:20px;
text-transform:uppercase;
}
/* FINAL CAIXA CLARA */


#copyright{
  float:left;
  width:790px;
  height: 80;
color: #666666;
text-transform: uppercase;
font-size: 11px;
padding-bottom: 30px;
padding-left: 10px;

}

#visitantesonline{
  float:left;
  text-align:right;
  width:190px;
  height: 80;
color: #333333;
text-transform: uppercase;
font-size: 11px;
padding-bottom: 30px;
}





/* FORMULÁRIOS E BOTÕES */

.none {}

.formlogin{
background:#f7f7f7;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
border:1px solid #aaa;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-moz-box-shadow:0 0 15px #aaa;
-webkit-box-shadow:0 0 15px #aaa;
margin: 5px;
padding: 5px 10px;
}
.formlogin h3{
border-bottom:1px solid #ccc;
font-size:9px;
font-weight:bold;
letter-spacing:2px;
margin-bottom:20px;
text-transform:uppercase;
}

/*
form {
background:#f7f7f7;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
border:1px solid #aaa;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-moz-box-shadow:0 0 15px #aaa;
-webkit-box-shadow:0 0 15px #aaa;
margin:60px auto 0;
padding:20px;
width:90%;

 
}
*/

form h3 {

border-bottom:1px solid #ccc;
font-size:9px;
font-weight:bold;
letter-spacing:2px;
margin-bottom:20px;
text-transform:uppercase;
}


form p{
margin-bottom:20px;
}
form p:last-child{ /* Sélecteur avancé pour sélectionner le dernier paragraphe du formulaire */
margin-bottom:0;
}
label{
cursor:pointer;
display:block;
float:left;
font-size:13px;
font-weight:bold;
line-height:28px;
margin-bottom:5px;
width:200px;
}
form p:hover label{
color:#0459b7;
}
form p:hover label:after{
content:' »';
}

input[type=text],input[type=password],textarea,select{
background: rgba(255, 255, 255, 0.9);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff'); /* for IE */
background:-moz-linear-gradient(90deg, #fff, #eee); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#eee), to(#fff), color-stop(0.2, #fff)); /* Webkit */
border:1px solid #aaa;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-moz-box-shadow:0 0 3px #aaa;
-webkit-box-shadow:0 0 3px #aaa;
/*  box-shadow: 10px 10px 20px #aaaaaa; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
padding:5px;
}
input[type=text]:focus,input[type=password]:focus,textarea:focus,select:focus{
border-color:#093c75;
-moz-box-shadow:0 0 3px #0459b7;
-webkit-box-shadow:0 0 3px #0459b7;
outline:none; /* Pour enlever le contour jaune lorsque l'on sélectionne un input dans Chrome */
}


input[type=submit],input[type=button],
a.submit{
background:#ddd;
background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#08adff, endColorstr=#0459b7);/* For Internet Explorer 5.5 - 7 */
  -ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#08adff, endColorstr=#0459b7)';/* For Internet Explorer 8 */

border:1px solid #093c75;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-moz-box-shadow:0 1px 0 #fff;
-webkit-box-shadow:0 1px 0 #fff;
color:#fff;
cursor:pointer;
font-family:Arial,sans-serif;
font-size:12px;
font-weight:bold;
  margin:auto 0;
  text-align: center;
padding:5px 10px;
text-decoration:none;
text-shadow:0 1px 1px #333;
text-transform:uppercase;
}
input[type=submit]:hover,input[type=button]:hover,
a.submit:hover{
background:#eee;
background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
border-color:#093c75;
text-decoration:none;
}
input[type=submit]:active,input[type=button]:active,
input[type=submit]:focus,input[type=button]:focus,
a.submit:active,
a.submit:focus{
background:#ccc;
background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
border-color:#093c75;
outline:none;
}



#options{
margin-bottom:20px;
}
#options p{
display:none;
}
#options .show{
display:block;
}
#options:target .show{
display:none;
}
#options .hide{
display:none;
}
#options:target .hide{
display:block;
}
#options:target p{
display:block;
}
#finish{
background:rgba(65, 166, 42, 0.2);
border:2px solid #41a62a;
-moz-border-radius:3px;
-webkit-border-radius:3px;
display:none;
padding:5px 10px;
}
#finish:target{
display:block;
}
/* FINAL FORMULÁRIOS E BOTÕES */




/* TABELA ESTILO */

#tabelas
{
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Sans-Serif;
font-size: 12px;
margin: 45px;
/*width: 90%;*/
text-align: left;
border-collapse: collapse;
}
#tabelas th
{
font-size: 13px;
font-weight: normal;
padding: 8px;
/* background: #b9c9fe url('table-images/gradhead.png') repeat-x; */
/* For WebKit (Safari, Google Chrome etc) */
background: -webkit-gradient(linear, left top, left bottom, from(#9FB5FE), to(#B9C9FE));
/* For Mozilla/Gecko (Firefox etc) */
background: -moz-linear-gradient(top, #9FB5FE, #B9C9FE);
/* For Internet Explorer 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#9FB5FE, endColorstr=#B9C9FE);
/* For Internet Explorer 8 */
-ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#9FB5FE, endColorstr=#B9C9FE)';



border-top: 2px solid #d3ddff;
border-bottom: 1px solid #fff;
color: #039;
}
#tabelas td
{
padding: 8px;
border-bottom: 1px solid #fff;
color: #669;
border-top: 1px solid #fff;
/* background: #e8edff url('table-images/gradback.png') repeat-x; */
/* For WebKit (Safari, Google Chrome etc) */
background: -webkit-gradient(linear, left top, left bottom, from(#D6DFFF), to(#E8EDFF));
/* For Mozilla/Gecko (Firefox etc) */
background: -moz-linear-gradient(top, #D6DFFF, #E8EDFF);
/* For Internet Explorer 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#D6DFFF, endColorstr=#E8EDFF);
/* For Internet Explorer 8 */
-ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#D6DFFF, endColorstr=#E8EDFF)';


}
#tabelas tfoot tr td
{
background: #e8edff;
font-size: 12px;
color: #99c;
}
#tabelas tbody tr:hover td
{
/* background: #d0dafd url('table-images/gradhover.png') repeat-x; */
/* For WebKit (Safari, Google Chrome etc) */
background: -webkit-gradient(linear, left top, left bottom, from(#BDCBFC), to(#D0DAFD));
/* For Mozilla/Gecko (Firefox etc) */
background: -moz-linear-gradient(top, #BDCBFC, #D0DAFD);
/* For Internet Explorer 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#BDCBFC, endColorstr=#D0DAFD);
/* For Internet Explorer 8 */
-ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#BDCBFC, endColorstr=#D0DAFD)';

color: #339;
}

/* TABELA ESTILO FIM*/








/* -------------------------------------------------- */
/* ESTILO DAS FOTOS INICIO*/
ul.polaroids { width: 90%; margin: 0 0 18px -30px; }
ul.polaroids li { display: inline; }
ul.polaroids a { background: #fff; display: inline; float: left; margin: 0 0 27px 30px; width: auto; padding: 10px 10px 15px; text-align: center; font-family: 'Marker Felt', sans-serif; text-decoration: none; color: #333; font-size: 18px; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25); -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25); -webkit-transform: rotate(-2deg); -webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); }
ul.polaroids img { display: block; width: 150px; margin-bottom: 12px; }
ul.polaroids a:after { content: attr(title); }

ul.polaroids li:nth-child(even) a { -webkit-transform: rotate(2deg);  -moz-transform: rotate(2deg); }
ul.polaroids li:nth-child(3n) a { -webkit-transform: none; position: relative; top: -5px;  -moz-transform: none; }
ul.polaroids li:nth-child(5n) a { -webkit-transform: rotate(5deg); position: relative; right: 5px;  -moz-transform: rotate(5deg); }
ul.polaroids li:nth-child(8n) a { position: relative; right: 5px; top: 8px; }
ul.polaroids li:nth-child(11n) a { position: relative; left: -5px; top: 3px; }

ul.polaroids li.messy a { margin-top: -375px; margin-left: 160px; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); }

ul.polaroids li a:hover { -webkit-transform: scale(1.25); -moz-transform: scale(1.25); -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5); -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5); position: relative; /* z-index: 5; */ }

code { background: rgba(0,0,0,.5); padding: 2px 3px; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.75); -webkit-border-radius: 3px; -moz-border-radius: 3px; }

ol.code { background: rgba(0,0,0,.75); margin-bottom: 18px; border: solid rgba(0,0,0,.75); border-width: 1px 1px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; -webkit-box-shadow: 0 1px 1px rgba(255,255,255,.5); }
ol.code li, ol.code li code { font-size: 14px !important; }
ol.code code { background: none; }

/* ESTILO DAS FOTOS */


/* LOJA PRODUTOS INICIAL */
.produtos-inicial { position:relative; margin:0 0px 0px 0; }
.produtos-inicial li.item { float:left; width:240px;  list-style:none; }
.produtos-inicial .produto-imagem { display:block; width:240px; height:170px; margin:0 0 6px; }
.produtos-inicial .produto-nome { padding:0 16px 9px 0; height:25px; font-weight:bold; font-size:16px; }
.produtos-inicial .produto-nome a { color:#0066FF; text-decoration:none; }
.produtos-inicial .produto-nome a:hover { text-decoration:underline; }
.produtos-inicial .caixadopreco { float:left; width:240px; margin:7px 10px 0 0;  height:50px; }
.produtos-inicial .preco { font-size:16px; font-weight:bold; color:#333333; }
/* LOJA PRODUTOS INICIAL FINAL*/






/* LOJA BANNER DE OFERTAS INICIO */

#page-wrap { background: white; width: 770px; margin: 0 auto;
 padding: 0px 0;  margin: 0; padding: 0;

color: #333;
background-color: #fafafa;
margin: 5px;


-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;



}

#slider {
  background: white url(images123/layout/slider-bg.jpg); height: 222px; overflow: hidden;
  position: relative; margin: 0px 0;  margin: 0; padding: 0;

-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;

}

  /* DEFAULT is for three panels in width, adjust as needed
  This only matters if JS is OFF, otherwise JS sets this. */
#mover { width: 2880px; position: relative;  margin: 0; padding: 0;}

.slide { padding: 30px 0px; width: 790px; float: left; position: relative; left: -180px;  margin: 0; }
.slide h1 { font-family: Helvetica, Sans-Serif; font-size: 26px; letter-spacing: -1px;  color: #ac0000; margin: 0; padding: 0; }
.slide p { color: #999; font-size: 24px; line-height: 22px; width: 500px;  margin: 0; padding: 0;}
.slide img { position: absolute; top: 22px; left: 710px; margin: 0; padding: 0; }
#slider-stopper { position: absolute; top: 1px; right: 20px; background: #ac0000; color: white;
 padding: 3px 8px; font-size: 10px; text-transform: uppercase; z-index: 1000;  margin: 0; padding: 0;}

/* LOJA BANNER DE OFERTAS FINAL */





/*INCIO BANNER ROTATIVO*/

/* =Skitter styles
----------------------------------------------- */
.box_skitter {position:relative;width:700px;height:304px;}
.box_skitter img { max-width:none; -webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;} /* Tip for stildv */
.box_skitter ul {display:none;}
.box_skitter .container_skitter {overflow:hidden;position:relative;}
.box_skitter .image {overflow:hidden;}
.box_skitter .image img {display:none;}

/* =Box clone
-------------------------------------------------------------- */
.box_skitter .box_clone {position:absolute;top:0;left:0;width:100px;overflow:hidden;display:none;z-index:20;}
.box_skitter .box_clone img {position:absolute;top:0;left:0;z-index:20;}

/* =Navigation
-------------------------------------------------------------- */

.box_skitter .prev_button {position:absolute;top:50%;left:5px;z-index:100;width:42px;height:42px;overflow:hidden;text-indent:-9999em;margin-top:-25px;background:url(images123/layout/prevREMOVIDO.png) no-repeat left top;}

.box_skitter .next_button {position:absolute;top:50%;right:5px;z-index:100;width:42px;height:42px;overflow:hidden;text-indent:-9999em;margin-top:-25px;background:url(images123/layout/nextREMOVIDO.png) no-repeat left top;}

/* =Numbers
-------------------------------------------------------------- */

.box_skitter .info_slide {position:absolute;top:5px;left:5px;z-index:100;background: transparent;color:#fff;font:bold 11px arial;padding:5px 0 5px 5px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;opacity:0.4;}
.box_skitter .info_slide .image_number {background:#333;float:left;padding:2px 10px;margin:0 5px 0 0;cursor:pointer;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;}
.box_skitter .info_slide .image_number_select {background:#cc0000;float:left;padding:2px 10px;margin:0 5px 0 0;}

/* =Thumbs
Change width and height to customization dimension thumb
-------------------------------------------------------------- */
.box_skitter .container_thumbs { position:relative;overflow:hidden;height:50px; }
.box_skitter .info_slide_thumb { height:50px;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;overflow:hidden;top:auto;top:0;left:0;padding:0 !important;opacity:1.0; }
.box_skitter .info_slide_thumb .image_number { overflow:hidden;width:100px;height:50px;position:relative;margin:0 !important; padding:0 !important; -moz-border-radius:0 !important;-webkit-border-radius:0 !important;border-radius:0 !important;}
.box_skitter .info_slide_thumb .image_number img { position:absolute;top:-30px;left:-30px;height:100px;}
.box_skitter .box_scroll_thumbs { padding:0; }
.box_skitter .box_scroll_thumbs .scroll_thumbs { position:absolute;bottom:60px;left:50px;background:#ccc;background:-moz-linear-gradient(-90deg, #555, #fff);background:-webkit-gradient(linear, left top, left bottom, from(#555), to(#fff));width:200px;height:10px;overflow:hidden;text-indent:-9999em;z-index:101; cursor:pointer;border:0px solid #333; }

/* =Dots
-------------------------------------------------------------- */
.box_skitter .info_slide_dots {position:absolute;bottom:-40px;z-index:151;padding:5px 0 5px 5px;-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;}
.box_skitter .info_slide_dots .image_number {background:#333;float:left;margin:0 5px 0 0;cursor:pointer;-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;width:18px;height:18px;text-indent:-9999em;overflow:hidden;}
.box_skitter .info_slide_dots .image_number_select {background:#cc0000;float:left;margin:0 5px 0 0;}

/* =Loading
-------------------------------------------------------------- */
.loading {position:absolute; top:50%; right:50%; z-index:10000; margin:-16px -16px;color:#fff;text-indent:-9999em;overflow:hidden;background:url(../images123/layout/ajax-loader.gif) no-repeat left top;width:32px;height:32px;}

/* =Label
-------------------------------------------------------------- */
.box_skitter .label_skitter { z-index:150;position:absolute;bottom:0px;left:0px;display:none; }
.box_skitter .label_skitter { z-index:150;position:absolute;bottom:0px;left:0px;color:#fff;display:none;opacity:0.8;background:#000; }
.box_skitter .label_skitter p { padding:10px;margin:0;font:normal 22px arial,tahoma;letter-spacing:-1px; }
.box_skitter .info_slide * { font-family:Consolas,arial,tahoma !important; }
.box_skitter .progressbar { background:#000; position:absolute; top:5px;left:15px;height:5px; width: 200px; z-index:99; border-radius:20px; }

/* =Preview slide
-------------------------------------------------------------- */
.box_skitter .preview_slide { display:none; position:absolute; z-index:152; bottom:30px; left:-40px; width:100px; height:100px; background:#fff; border:1px solid #222; -moz-box-shadow:rgba(0,0,0,0.7) 2px 2px 5px; -webkit-box-shadow:rgba(0,0,0,0.7) 2px 2px 5px; box-shadow:rgba(0,0,0,0.7) 2px 2px 5px; overflow:hidden; }
.box_skitter .preview_slide ul { height:100px; overflow:hidden; margin:0; list-style:none; display:block; position:absolute; top:0; left:0; }
.box_skitter .preview_slide ul li { width:100px; height:100px; overflow:hidden; float:left; margin:0; padding:0; position:relative; display:block; }
.box_skitter .preview_slide ul li img { position:absolute; top:0; left:0; height:150px; width:auto; }

/* =Focus
-------------------------------------------------------------- */
#overlay_skitter { position:absolute; top:0; left:0; width:100%; z-index:9998; opacity:1; background:#000; }

.box_skitter .focus_button {position:absolute;top:50%;z-index:100;width:42px;height:42px;overflow:hidden;text-indent:-9999em;margin-top:-25px;background:url(../images123/layout/focus-button.png) no-repeat left top;opacity:0;}

.box_skitter .play_pause_button {position:absolute;top:50%;z-index:151;width:42px;height:42px;overflow:hidden;text-indent:-9999em;margin-top:-25px;background:url(../images123/layout/pause-button.png) no-repeat left top;opacity:0;}

.box_skitter .play_pause_button.play_button {background:url(../images123/layout/play-button.png) no-repeat left top;}

/* =Example for dimenions
-------------------------------------------------------------- */
.box_skitter_large { width:690px;height:304px;
-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;
color: #333;
margin: 5px;
}

.box_skitter_maior { width:770px;height:304px;
-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;
color: #333;
margin: 5px;
}

.box_skitter_menor { width:550px;height:304px;
-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;
color: #333;
margin: 5px;
}

.box_skitter_super { width:1000px;height:304px;
-webkit-border-radius: 7px ;
-moz-border-radius: 7px ;
border-radius: 7px ;
-webkit-box-shadow: 0px 0px 5px #999;
-moz-box-shadow: 0px 0px 5px #999;
box-shadow: 0px 0px 5px #999;
color: #333;
margin: 5px;
}

/*FIM BANNER ROTATIVO*/



/* NOTICIAS LISTA */
#noticiaslista {
padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px; }
#noticiaslista ol a { font-style:italic; font-family:Georgia, Times, serif; font-size:24px; color:#000080;  }
#noticiaslista ol li { }
#noticiaslista ol li p { padding:8px; font-style:normal; font-family:Arial; font-size:13px; color:#999; border-left: 1px solid #999; }
#noticiaslista ol li p em { display:block; }




/* INICIO BANNER PRODUTOS */
/*****************************
  SET DEFAULT DIMENSIONS HERE
 *****************************/
/* change the ID & dimensions to match your slider */
#slider2 {
width: 700px;
height: 190px;
list-style: none;
/* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
overflow-y: auto;
overflow-x: hidden;
}

/******************
  SET STYLING HERE
 ******************
 =================================
 Default state (no keyboard focus)
 ==================================*/
/* Overall Wrapper */
.anythingSlider-default {
margin: 0 auto;
/* 45px right & left padding for the arrows, 28px @ bottom for navigation */
/*padding: 0 45px 28px 45px;*/
padding: 0 0px 28px 0px;
}
/* slider window - top & bottom borders, default state */
.anythingSlider-default .anythingWindow {
border-top: 0px solid #777;
border-bottom: 0px solid #777;
}
/* Navigation buttons + start/stop button, default state */
.anythingSlider-default .anythingControls a {
/* top shadow */
background: #777 url(../images123/layout/default.pngXXX) center -288px repeat-x;
color: #fff;
border-radius: 5 5 5px 5px;
-moz-border-radius: 5 5 5px 5px;
-webkit-border-radius: 5 5 5px 5px;
}
/* Make sure navigation text is visible */
.anythingSlider-default .anythingControls a span {
visibility: visible;
}
/* Navigation current button, default state */
.anythingSlider-default .anythingControls a.cur {
background: #888;
color: #000;
}

/* start-stop button, stopped, default state */
.anythingSlider-default .anythingControls a.start-stop {
background-color: #040;
color: #ddd;
}
/* start-stop button, playing, default state */
.anythingSlider-default .anythingControls a.start-stop.playing {
background-color: #800;
}

/* start-stop button, default hovered text color (when visible) */
/* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
.anythingSlider-default .anythingControls a.start-stop:hover,
.anythingSlider-default .anythingControls a.start-stop.hover,
.anythingSlider-default .anythingControls a.start-stop .anythingControls ul a:hover {
background-image: none;
color: #ddd;
}

/*
 =================================
 Active State (has keyboard focus)
 =================================
*/
/* slider window - top & bottom borders, active state */
.anythingSlider-default.activeSlider .anythingWindow {
border-color: #7C9127;
}
/* Navigation buttons, active state */
.anythingSlider-default.activeSlider .anythingControls a {
/* background image = top shadow */
background-color: #7C9127;
}
/* Navigation current & hovered button, active state */
.anythingSlider-default.activeSlider .anythingControls a.cur,
.anythingSlider-default.activeSlider .anythingControls a:hover {
/* background image removed */
background: #7C9127;
}

/* start-stop button, stopped, active state */
.anythingSlider-default.activeSlider .anythingControls a.start-stop {
background-color: #080;
color: #fff;
}
/* start-stop button, playing, active state */
.anythingSlider-default.activeSlider .anythingControls a.start-stop.playing {
background-color: #d00;
color: #fff;
}
/* start-stop button, active slider hovered text color (when visible) */
.anythingSlider-default.activeSlider .start-stop:hover,
.anythingSlider-default.activeSlider .start-stop.hover {
color: #fff;
}

/************************
  NAVIGATION POSITIONING
 ************************/
/* Navigation Arrows */
/*
.anythingSlider-default .arrow {
top: 50%;
position: absolute;
display: block;
}

.anythingSlider-default .arrow a {
display: block;
width: 45px;
height: 140px;
margin: -70px 0 0 0;
text-align: center;
outline: 0;
background: url(../images/default.png) no-repeat;
}
*/
/* back arrow
.anythingSlider-default .back { left: 0; }
.anythingSlider-default .back a { background-position: left top; }
.anythingSlider-default .back a:hover,
.anythingSlider-default .back a.hover { background-position: left -140px; }
forward arrow
.anythingSlider-default .forward { right: 0; }
.anythingSlider-default .forward a { background-position: right top; }
.anythingSlider-default .forward a:hover,
.anythingSlider-default .forward a.hover { background-position: right -140px; }
*/
/* Navigation Links */
.anythingSlider-default .anythingControls { outline: 0; display: none; }
.anythingSlider-default .anythingControls ul { margin: 0; padding: 0; float: left; }
.anythingSlider-default .anythingControls ul li { display: inline; }
.anythingSlider-default .anythingControls ul a {
font: 14px/18px Georgia, Serif;
display: inline-block;
text-decoration: none;
padding: 2px 8px;
height: 18px;
margin: 0 5px 0 0;
text-align: center;
outline: 0;
}

/* navigationSize window */
.anythingSlider-default .anythingControls .anythingNavWindow {
overflow: hidden;
float: left;
}

/* Autoplay Start/Stop button */
.anythingSlider-default .anythingControls .start-stop {
padding: 1px 3px;
width: 30px;
text-align: center;
text-decoration: none;
float: right;
z-index: 100;
outline: 0;
font: 10px/18px Georgia, Serif;

}

/***********************
  IE8 AND OLDER STYLING
 ***********************/

/* Navigation Arrows */
.as-oldie .anythingSlider-default .arrow {
top: 30%;
}
.as-oldie .anythingSlider-default .arrow a {
margin: 0;
}

/* margin between nav buttons just looks better */
.as-oldie .anythingSlider-default .anythingControls li {
margin-left: 2px;
}

/* When using the navigationSize option, the side margins need to be zero
None of the navigation panels look good in IE7 now =( */
.as-oldie .anythingSlider-default .anythingControls a {
margin: 0;
}
.as-oldie .anythingSlider-default .anythingNavWindow {
margin: 0 2px;
}
.as-oldie .anythingSlider-default .anythingNavWindow li {
padding: 3px 0 0 0;
}

/***********************
  COMMON SLIDER STYLING
 ***********************/
/* Overall Wrapper */
.anythingSlider {
display: block;
overflow: visible !important;
position: relative;
}
/* anythingSlider viewport window */
.anythingSlider .anythingWindow {
overflow: hidden;
position: relative;
width: 100%;
height: 100%;
}
/* anythingSlider base (original element) */
.anythingSlider .anythingBase {
background: transparent;
list-style: none;
position: absolute;
overflow: visible !important;
top: 0;
left: 0;
margin: 0;
padding: 0;
}

/* Navigation arrow text; indent moved to span inside 'a', for IE7;
  apparently, a negative text-indent on an 'a' link moves the link as well as the text */
.anythingSlider .arrow span {
display: block;
visibility: hidden;
}
/* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
.anythingSlider .arrow.disabled {
display: none;
}
/* all panels inside the slider; horizontal mode */
.anythingSlider .panel {
background: transparent;
display: block;
overflow: hidden;
float: left;
padding: 0;
margin: 0;
}
/* vertical mode */
.anythingSlider .vertical .panel {
float: none;
}
/* fade mode */
.anythingSlider .fade .panel {
float: none;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
/* fade mode active page - visible & on top */
.anythingSlider .fade .activePage {
z-index: 0;
}

/***********************
  RTL STYLING
 ***********************/
/* slider autoplay right-to-left, reverse order of nav links to look better */
.anythingSlider.rtl .anythingWindow {
direction: ltr;
unicode-bidi: bidi-override;
}
.anythingSlider.rtl .anythingControls ul { float: left; } /* move nav link group to left */
.anythingSlider.rtl .anythingControls ul a { float: right; } /* reverse order of nav links */
.anythingSlider.rtl .start-stop { /* float: right; */ } /* move start/stop button - in case you want to switch sides */

/* probably not necessary, but added just in case */
.anythingSlider,
.anythingSlider .anythingWindow,
.anythingSlider .anythingControls ul a,
.anythingSlider .arrow a,
.anythingSlider .start-stop {
transition-duration: 0;
-o-transition-duration: 0;
-moz-transition-duration: 0;
-webkit-transition-duration: 0;
}
/* FIM BANNER PRODUTOS */




/* INICIO DA PAGINACAO */
/*
ul{border:0;
padding:0;
margin-left: 300;
}
*/
#paginacao li{
border:0; margin:0; padding:0;
font-size:11px;
list-style:none;
margin-right:2px;
}
#paginacao a{
border:solid 1px #9aafe5
margin-right:2px;
}
#paginacao .previous-off,
#paginacao .next-off {
border:solid 1px #DEDEDE
color:#888888
display:block;
float:left;
font-weight:bold;
margin-right:2px;
padding:3px 4px;
}
#paginacao .next a,
#paginacao .previous a {
font-weight:bold;
}
#paginacao .active{
background:#2e6ab1;
color:#FFFFFF;
font-weight:bold;
display:block;
float:left;
padding:4px 6px;
}
#paginacao a:link,
#paginacao a:visited {
color:#0e509e
display:block;
float:left;
padding:3px 6px;
text-decoration:none;
}
#paginacao a:hover{
border:solid 1px #0e509e
}
/* FIM DA PAGINACAO */






/*INICIO DEMONSTRACAO*/
#demonstracao {
    position: fixed;
    top: 0;
    left: 0;
    width: 50;
    height: 200;
    z-index:-50;
    opacity:0.5;
    margin-top:10px;
    margin-left:10px;

}
/*FIM DEMONSTRACAO*/



/* Caso vc queira editar o arquivo fora daqui, remova tudo acima e deixe somente a linha abaixo e cire um arquivo chamadp style.css */
/*
@import url('style.css');
*/