/*
tudo isso ? 100% compat?vel com o firefox, mas n?o funciona no ie!
? preciso carregar a biblioteca javascript 'ie7' ap?s o carregamento do css. ela se encarrega de fazer as coisas funcionarem no ie como deveriam.
c?digo a ser inserido no html, supondo que a biblioteca esteja na mesma pasta do html:

<!--[if lt ie 7]>
<script src="ie7-standard-p.js" type="text/javascript"></script>
<![endif]-->

*/

/*------------------------------
seguem os atributos que podem ser alterados para personalizar o menu:
------------------------------*/

/*
container de cada n?vel do menu.
*/
#menusec, #menusec ul {
	width: 160px;
font-size: 12px;
}

/*
itens do menu. (a borda ? parte dos links e n?o dos itens!)
*/
#menusec li {
    background: ffffff;
}

#menusec li li {
    background: ffffff;
}

#menusec li:hover {
        background:ffffff;
}

#menusec li li:hover {
        background: ffffff;
}

/*
links.
*/
#menusec a {
	font: verdana;
font-size: 12px;
	border-top: #ff9c00 1px solid;
	color: #000;
    background: #ffffff;
	text-decoration: none;
}

#menusec li li a {
	font: verdana;
	border-top: #ff9c00 1px solid;
	color: #000;
    background: #9DB0D9;
}

/*
os links n?o possuem borda superior, para evitar bordas duplas.
por isso ? preciso criar uma borda superior em seus containers (ul)
*/
#menusec ul.pai {
	border-top: #ff9c00 1px solid;
}

#menusec li ul.pai {
	border-top: #ff9c00 1px solid;
}

/*
ao passar o mouse ou colocar o foco em um link.
*/
#menusec a:hover {
    background: #ffffff;
	color: #000;
}

#menusec li li a:hover {
    background: #ffffff;
	color: #000;
}


/*------------------------------
segue a parte que n?o deve ser alterada, pois garante o funcionamento correto do menu:
------------------------------*/
/*
para as setas que indicam subn?veis
*/
#menusec img {
	border: 0;
	float: right;
	position: relative;
	top: -7px;
	display: none;
}

/*
container de cada n?vel do menu.
*/
/*
tudo isso ? 100% compat?vel com o firefox, mas n?o funciona no ie!
? preciso carregar a biblioteca javascript 'ie7' ap?s o carregamento do css. ela se encarrega de fazer as coisas funcionarem no ie como deveriam.
c?digo a ser inserido no html, supondo que a biblioteca esteja na mesma pasta do html:

<!--[if lt ie 7]>
<script src="ie7-standard-p.js" type="text/javascript"></script>
<![endif]-->

*/

/*------------------------------
seguem os atributos que podem ser alterados para personalizar o menu:
------------------------------*/

/*
container de cada n?vel do menu.
*/
#menusec, #menusec ul {
	width: 160px;
}

/*
itens do menu. (a borda ? parte dos links e n?o dos itens!)
*/
#menusec li {
    background: ffffff;
}

#menusec li li {
    background: ffffff;
}

#menusec li:hover {
        background:ffffff;
}

#menusec li li:hover {
        background: ffffff;
}

/*
links.
*/
#menusec a {
	font: verdana;
	font-size: 9px;
	border-bottom: #ff9c00 1px solid;
	color: #000;
    background: #ffffff;
	text-decoration: none;
	border-top: none;
}

#menusec li li a {
	font: trebuchet, verdana,;
	border: #ff9c00 1px solid;
	color: #000;
    background: #ffffff;
	border-top: none;
}

/*
os links n?o possuem borda superior, para evitar bordas duplas.
por isso ? preciso criar uma borda superior em seus containers (ul)
*/
#menusec ul.pai {
	border-top: #ff9c00 1px solid;
}

#menusec li ul.pai {
	border-top: #ff9c00 1px solid;
}

/*
ao passar o mouse ou colocar o foco em um link.
*/
#menusec a:hover {
    background: #ffffff;
	color: #000;
}

#menusec li li a:hover {
    background: #ffffff;
	color: #000;
}


/*------------------------------
segue a parte que n?o deve ser alterada, pois garante o funcionamento correto do menu:
------------------------------*/
/*
para as setas que indicam subn?veis
*/
#menusec img {
	border: 0;
	float: right;
	position: relative;
	top: -7px;
	display: none;
}

/*
container de cada n?vel do menu.
*/
#menusec, #menusec ul {
	padding: 0px; 
	margin: 0px; 
	list-style-type: none;
        top: 0px;
        left: 0px;
        position: relative;
}

/*
refere-se a cada item no menu. boa parte serve apenas para manter compatibilidade com o ie.
*/
#menusec li {
	position: relative;
        min-height: 13px;
        float: left;
        width: 100%;
}

/*
n?veis maiores que 1. iniciam invis?veis e est?o devidamente posicionados.
*/
#menusec li ul {
	display: none;
	left: 149px; 
	position: absolute; 
	top: 0px;
}

/*
submenus de itens maiores do que 1.
*/
#menusec li + li > ul {
	top: -1px;
}
/*
links. boa parte dos atributos serve para manter compatibilidade com o ie.
*/
#menusec a {
	padding: 5px;
	display: block;
        min-height: 12px;
        height: 1%;
}

#menusec a.pai, #menusec a.pai:hover {
    background-position: center right;
    background-repeat: no-repeat;
}

/*
faz a m?gica de mostrar n?vel filho ao passar o mouse no pai.
*/
#menusec li:hover > ul {
	display: block;
}