ecco qui:
allora ho notato che il template è fatto con un famoso programmino.
innanzitutto dove dice:
/* begin Box, BlockContent */
vai a commentare o togliere le classi da "art-BlockContent-body a:link" fino a "art-BlockContent-body ul li" compreso... comunque in questo pezzo di codice copiato visualizzi la parte citata commentata. Dopo di che inizia la parte vera e propria in cui stabilisci tutte le proprietà del menu e sottomenu. Ovviamente sta a te poi sistemare le varie dimensioni,padding, le immagini utilizzate per i pulsanti etc.. c'è anche da dire che nel sottomenu viene chiamata la stessa immagine usata per il menu principare e ovviamente spostata per dare l'effetto di sottomenu desiderato (nel mio caso si chiamano tasto.. e tasto-hover che da l'effetto del pulsante cliccato). Ti dico già che non puoi creare un sottomenu con grafica differente dal menu principale perchè ci ho provato e non si riesce.(il sito di esempio che ti avevo linkato ti rende ben noto questo)
Non ti resta che fare un bel copia incolla generale di questo pezzo e personalizzarlo a piacere
.art-BlockContent
{
position:relative;
z-index:0;
margin:0 auto;
min-width:1px;
min-height:1px;
}
.art-BlockContent-body
{
position: relative;
z-index: 1;
padding: 3px;
}
.art-BlockContent-cc
{
position:absolute;
z-index:-1;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: #FFFFFF;
}
.art-BlockContent-body
{
color:#333;
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
text-align: left;
}
/*.art-BlockContent-body a:link
{
color: #36368C;
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
font-size: 13px;
text-decoration: none;
}
.art-BlockContent-body a:visited, .art-BlockContent-body a.visited
{
color: #36368C;
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
font-size: 13px;
text-decoration: none;
}
.art-BlockContent-body a:hover, .art-BlockContent-body a.hover
{
color: #CD071E;
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
font-size: 13px;
text-decoration: underline;
}
.art-BlockContent-body ul
{
list-style-type: none;
color: #13133E;
margin:0;
padding:0;
}
.art-BlockContent-body ul li
{
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
font-size: 12px;
line-height: 125%;
line-height: 1.25em;
padding: 0px 0 0px 13px;
background-image: url('../images/BlockContentBullets.png');
background-repeat: no-repeat;
}
/* end Box, BlockContent */
/*inizio del mio menu personalizzato*/
.art-BlockContent-body ul.menu {
list-style: none;
text-align: right;
margin:0;
padding: 0 0px 0px 0;
}
.art-BlockContent-body ul.menu li{
margin:0 0 1px 0;
}
.art-BlockContent-body ul.menu li:hover{
}
.art-BlockContent-body ul.menu li ul li{
}
.art-BlockContent-body ul.menu li a, .art-BlockContent-body ul.menu li a:link {
display:block;
font-weight: 600;
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
font-size: 13px;
height:23px;
padding:5px 0px 0 10px;
text-decoration: none;
color:#cd071e;
overflow:hidden;
background: transparent url(../images/tasto.png) no-repeat left center;
text-align:left;
}
.art-BlockContent-body ul.menu li a:hover {
color: #fff;
font-family:"Century Gothic",Arial, Helvetica, Sans-Serif;
background: transparent url(../images/tasto-hover.png) no-repeat left center;
}
.art-BlockContent-body ul.menu li#current {
}
.art-BlockContent-body ul.menu li#current a:hover{
display:block;
color: #fff;
background: transparent url(../images/tasto-hover.png) no-repeat left center;
}
.art-BlockContent-body ul.menu li#current{
}
.art-BlockContent-body ul.menu li#current a, .art-BlockContent-body ul.menu li#current a:link {
display:block;
color: #fff;
background: transparent url(../images/tasto-hover.png) no-repeat left center;
}
.art-BlockContent-body ul.menu li#current {
}
.art-BlockContent-body ul.menu li#current a:hover{
display:block;
color: #fff;
background: transparent url(../images/tasto-hover.png) no-repeat left center;
}
/*LEFT COL SUB LINK*/
.art-BlockContent-body ul.menu li#current ul li a, .art-BlockContent-body ul.menu li#current ul li a:link {
font-weight: 400;
text-decoration: none;
color:#cd071e;
margin:0 0 0 20px;
height:23px;
padding:5px 0px 0 10px;
background: transparent url(../images/tasto.png) no-repeat left center;
text-align:left;
}
.art-BlockContent-body ul.menu li#current ul li a:hover {
padding:0 0 0 20px;
color: #fff;
background: transparent url(../images/tasto-hover.png) no-repeat left center;
height:23px;
padding:5px 0px 0 10px;
}
.art-BlockContent-body ul.menu li ul li#current, #rightcolumn ul.menu li ul li#current {
}
.art-BlockContent-body ul.menu li.parent ul li{
}
.art-BlockContent-body ul.menu li.parent ul li a {
font-size: 11px;
font-weight: 400;
text-decoration: none;
color:#cd071e;
margin:0 0 0 20px;
height:23px;
padding:5px 0px 0 10px;
text-align:left;
}
.art-BlockContent-body ul.menu li.parent ul li a:hover {
color: #fff;
background: transparent url(../images/tasto-hover.png) no-repeat left center;
}
/*SUBMENU POSITION*/
.art-BlockContent-body ul.menu li#current ul {
margin: 0;
padding: 0;
}
.art-BlockContent-body ul.menu li#current ul li {
margin: 0;
padding: 0;
}
/*CURRENT SUBMENU POSITION*/
.art-BlockContent-body ul.menu li ul {
margin: 0;
padding: 0;
}
.art-BlockContent-body ul.menu li ul
{
list-style: none;
margin:0;
}
/*fine mio codice*/
/* begin Box, Post */