#menu div.barraMenu,
#menu div.barraMenu a.botaoMenu {
font-family: sans-serif, Verdana, Arial;
font-size: 16pt;
color: white;
width: 820px
background: 1e90ff 
}

#menu div.barraMenu {
text-align: center;
}

#menu div.barraMenu a.botaoMenu {
background-color: #556975;
color: white;
cursor: pointer;
text-decoration: none;
}

#menu div.barraMenu a.botaoMenu:hover {
background-color: #ff0000;
}

#menu div.barraMenu a.botaoMenu:active {
background-color: #637D4D;
color: black;
}


body {
	
    	background-color: #E8F4CD;
}

#container{
	text-align: center;
	background: #999999;
	width: 500px;
	margin : auto;
        float: center
       }

#cabecalho{
	font-family: 'Arial Black';
	text-align: right;
	background : #0000ff url(acriluz1.gif) no-repeat;
    	height : 100px;
    	width : 100%;

}

#lateral{
	background : #bfbfbf;
	width: 180px;
	position: absolute; left: 10px; top: 300px;
}
    	

#outrolado{
	background : #cccccc;
	width: 180px;
    	position: absolute; right: 10px; top: 300px}


#rodape{
    background-color: #cccccc;
    text-align:right;
    width: 95%;
    position: absolute; right: 20px; under: 10px;
}


H1 {
	font-family: 'Comic Sans MS';
	font-size: 18pt;
 	color: blue;
	}

H2 {
	font-size: 72; 
	color: ffffff;
	family: 'arial black';
}

H3 {
	font-size: 24; 
	color: ff0000;
	family: 'arial';
}

H4 {
	font-size: 18; 
	color: ffffff;
	family: 'arial black';
}

#zum1 {
width: 120px; /* largura da div = largura thumbnail */ 
height: 90px; /* altura da div = altura thumbnail */ 
background: url(escada.jpg) 0 0 no-repeat; /* coloca a imagem 
dentro da div na posi&#231;&#227;o 0 0 e 
sem repeti&#231;&#227;o */ 
margin: 0;
padding: 0;
} 

#thumb1 a { /* estado "UP" do link */ 
height: 90px; /* altura do thumbnail */ 
display: block; /* converte <a> de inline para 
block permitindo exibi&#231;&#227;o com a largura 
e altura determinadas */ 
}

#thumb1 a:hover { /* estado "OVER" do link */ 
width: 400px; /* largura da imagem */ 
height: 300px; /* altura da imagem */ 
background: transparent url(escada.jpg) 0 -90px no-repeat; 
/* fundo da div notar que as coordenadas 0 -90px 
obrigam a imagem de fundo a "subir" 90 px */ 
}
#zum2 {
width: 120px; /* largura da div = largura thumbnail */ 
height: 90px; /* altura da div = altura thumbnail */ 
background: url(pegeout.jpg) 0 0 no-repeat; /* coloca a imagem 
dentro da div na posi&#231;&#227;o 0 0 e 
sem repeti&#231;&#227;o */ 
margin: 0;
padding: 0;
} 
#thumb2 a { /* estado "UP" do link */ 
height: 90px; /* altura do thumbnail */ 
display: block; /* converte <a> de inline para 
block permitindo exibi&#231;&#227;o com a largura 
e altura determinadas */ 
}

#thumb2 a:hover { /* estado "OVER" do link */ 
width: 400px; /* largura da imagem */ 
height: 300px; /* altura da imagem */ 
background: transparent url(pegeout.jpg) 0 -90px no-repeat; 
/* fundo da div notar que as coordenadas 0 -90px 
obrigam a imagem de fundo a "subir" 90 px */ 
}
