Menu bugado

Qual é minha questão:
Bom gente voltando ao topico do menu css
https://ajuda.forumeiros.com/t67198-menu-css-help
Fiz as coisas dei uma analizada e consigui por o tal menu
Mais os codios que o site menu maker dão são HTML e CSS porem
as imagen são a parte não são em codigos ;s
Traduzindo Qnd aplico o menu ele fica com a fonte e com efeito porem
as cores das imagens não ficão qe são essas:

http://cssmenumaker.com/sites/default/files/menu/143/color.png
e
http://cssmenumaker.com/sites/default/files/menu/143/bottom-bg.png
Queria saber se tem como incluir elas no codigo ou algo do tipo
por que o menu esta ficando assim:
https://2img.net/r/ihimg/a/img690/9935/semttuloaqj.png
Como deveria ficar:
https://2img.net/r/ihimg/a/img268/439/semttulogtu.png
Desde ja obrigado espero respostas...


Links e imagens do meu problema:
Não é necessário.

Endereço do meu fórum:
http://brasilplayactionrpg.forumeiros.com/

Versão do meu fórum:
PHPBB2

Tudo?,

Aceda à teu CSS com o código abaixo:

Código:

#page-header .navbar {
border-top: 5px solid #21C8FF!important;
height: 43px;
overflow: visible!important;
padding: 1px 10px!important;
}
#page-header .navbar {
background-image: -moz-linear-gradient(#313029, #58564A 10%, #313029);
background-image: -webkit-gradient(linear, 0% 0%, 0% 10% 100%, from(#313029), to(#58564A), to(#313029));
background-image: -webkit-linear-gradient(#313029, #58564A 10%, #313029);
background-image: -o-linear-gradient(#313029, #58564A 10%, #313029);
}
#page-header .navbar {
background-color: #333;
border-color: #CCC;
padding: .5em 1.1em .6em;
}
#page-footer, div.navbar, div.navbar ul.linklist {
display: block !important;
}
.navbar {
background-color: white;
clear: both;
padding: 0 10px;
}

Graciosamente.
Sou novo no fdf, espero ter ajudado

Nada Aconteceu amigo

Olá,

O Fórum mencionado não contém o Menu dito, então, poderia colocá-lo ?

Cordialmente ...

o Codigo HTML do menu seria esse:

Código:

<div id='cssmenu'>
<ul>
  <li class='active '><a href='index.html'><span>Home</span></a></li>
  <li><a href='#'><span>Products</span></a></li>
  <li><a href='#'><span>About</span></a></li>
  <li><a href='#'><span>Contact</span></a></li>
</ul>
</div>

Ja o codigo CSS seria:

Código:

/* Let's import the lovely google font, please keep this line at the top of your stylesheet */

@import url(http://fonts.googleapis.com/css?family=Capriola);



/* Menu CSS */

#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a{
   
   padding: 0;
   margin: 0;
   line-height: 1;
   font-family: 'Capriola', sans-serif;
   
}

#cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {

   content: '';
   display: table;
   
}


#cssmenu:after, #cssmenu > ul:after {

   clear: both;
   
}

#cssmenu {

   zoom:1;
   height: 69px;
   background: url(images/bottom-bg.png) repeat-x center bottom;
   border-radius: 2px;
   
}

#cssmenu ul{

   background: url(images/nav-bg.png) repeat-x 0px 4px;
   height: 69px;
   
}

#cssmenu ul li{

   float: left;
   list-style: none;
   
}

#cssmenu ul li a{
   
   display: block;
   height: 37px;
   padding: 22px 30px 0;
   margin: 4px 2px 0;
   border-radius: 2px 2px 0 0;
   text-decoration: none;
   font-size: 15px;
   color: white;
   text-shadow: 0 1px 1px rgba(0, 0, 0, .75);
   font-weight: 400;
   opacity: .9;
   
}

#cssmenu ul li:first-child a{
   
   margin: 4px 2px 0 0;
   
}

#cssmenu ul li a:hover, #cssmenu ul li.active a{
   
   background: url(images/color.png) center bottom;
   display: block;
   height: 37px;
   margin-top: 0px;
   padding-top: 26px;
   color: #4e6d04;
   text-shadow: 0 1px 1px rgba(255, 255, 255, .55);
   opacity: 1;
   
}

E as Imagens serião:
http://cssmenumaker.com/sites/default/files/menu/143/nav-bg.png
http://cssmenumaker.com/sites/default/files/menu/143/color.png
http://cssmenumaker.com/sites/default/files/menu/143/bottom-bg.png

Bom acho que e isso