ul.squared {    
    background: url("http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cercul.gif") repeat scroll 0 0 transparent;    
    height: 300px;    
    list-style: none outside none;    
    margin: 0 auto;    
    padding: 0;    
    position: relative;    
    width: 300px;    
    }    
    ul.squared ul {    
    left: -9999px;    
    list-style: none outside none;    
    margin: 0;    
    padding: 0;    
    position: absolute;    
    }    
    ul.squared li {    
    float: left;    
    height: 100px;    
    width: 100px;    
    }    
    ul.squared li.mid {    
    margin-right: 100px;    
    }    
    ul.squared li a {    
    -moz-transition: all 0.25s ease 0s;    
    color: #666666;    
    display: block;    
    font-family: arial,sans-serif;    
    font-size: 12px;    
    height: 50px;    
    padding: 25px;    
    text-decoration: none;    
    width: 50px;    
    }    
    ul.squared li a b {    
    left: -9999px;    
    position: absolute;    
    }    
    ul.squared li a img {    
    border: 0 none;    
    width: 100%;    
    }    
    ul.squared li:hover > a {    
    cursor: pointer;    
    height: 64px;    
    padding: 18px;    
    width: 64px;    
    }    
    ul.squared li:hover > a > b {    
    background: none repeat scroll 0 0 #FFFFFF;    
    display: block;    
    height: 48px;    
    left: 125px;    
    line-height: 50px;    
    position: absolute;    
    text-align: center;    
    top: 125px;    
    width: 48px;    
    }    
    ul.squared li:hover ul {    
    height: 150px;    
    left: 75px;    
    top: 75px;    
    width: 150px;    
    z-index: 100;    
    }    
    ul.squared li ul li {    
    -moz-transition: opacity 1.5s ease 0s;    
    height: 50px;    
    opacity: 0;    
    position: absolute;    
    width: 50px;    
    }    
    ul.squared li ul li.p1 {    
    left: 100px;    
    top: 0;    
    }    
    ul.squared li ul li.p2 {    
    left: 100px;    
    top: 50px;    
    }    
    ul.squared li ul li.p3 {    
    left: 100px;    
    top: 100px;    
    }    
    ul.squared li ul li.p4 {    
    left: 50px;    
    top: 100px;    
    }    
    ul.squared li ul li.p5 {    
    left: 0;    
    top: 100px;    
    }    
    ul.squared li ul li.p6 {    
    left: 0;    
    top: 50px;    
    }    
    ul.squared li ul li.p7 {    
    left: 0;    
    top: 0;    
    }    
    ul.squared li ul li.p8 {    
    left: 50px;    
    top: 0;    
    }    
    ul.squared li:hover ul li.s1 {    
    -moz-transition-delay: 0s;    
    opacity: 1;    
    }    
    ul.squared li:hover ul li.s2 {    
    -moz-transition-delay: 0.25s;    
    opacity: 1;    
    }    
    ul.squared li:hover ul li.s3 {    
    -moz-transition-delay: 0.5s;    
    opacity: 1;    
    }    
    ul.squared li:hover ul li.s4 {    
    -moz-transition-delay: 0.75s;    
    opacity: 1;    
    }    
    ul.squared li:hover ul li.s5 {    
    -moz-transition-delay: 1s;    
    opacity: 1;    
    }    
    ul.squared li ul li a {    
    height: 30px;    
    padding: 10px;    
    width: 30px;    
    }    
    ul.squared li:hover ul li:hover > a {    
    height: 48px;    
    opacity: 1;    
    padding: 1px;    
    width: 48px;    
    }    
    ul.squared li:hover ul li:hover > a b {    
    display: block;    
    height: 50px;    
    line-height: 50px;    
    position: absolute;    
    text-align: center;    
    width: 50px;    
    }    
    ul.squared li:hover ul li.p1:hover > a b {    
    left: -50px;    
    top: 50px;    
    }    
    ul.squared li:hover ul li.p2:hover > a b {    
    left: -50px;    
    top: 0;    
    }    
    ul.squared li:hover ul li.p3:hover > a b {    
    left: -50px;    
    top: -50px;    
    }    
    ul.squared li:hover ul li.p4:hover > a b {    
    left: 0;    
    top: -50px;    
    }    
    ul.squared li:hover ul li.p5:hover > a b {    
    left: 50px;    
    top: -50px;    
    }    
    ul.squared li:hover ul li.p6:hover > a b {    
    left: 50px;    
    top: 0;    
    }    
    ul.squared li:hover ul li.p7:hover > a b {    
    left: 50px;    
    top: 50px;    
    }    
    ul.squared li:hover ul li.p8:hover > a b {    
    left: 0;    
    top: 50px;    
    }    
    ul.squared table {    
    border-collapse: collapse;    
    margin-bottom: -1px;    
    }    
    ul.squared li a:hover {    
    cursor: pointer;    
    height: 64px;    
    padding: 18px;    
    width: 64px;    
    }    
    ul.squared a:hover b {    
    background: none repeat scroll 0 0 #FFFFFF;    
    display: block;    
    height: 48px;    
    left: 125px;    
    line-height: 50px;    
    position: absolute;    
    text-align: center;    
    top: 125px;    
    width: 48px;    
    }    
    ul.squared a:hover ul {    
    height: 150px;    
    left: 75px;    
    top: 75px;    
    width: 150px;    
    z-index: 100;    
    }    
    ul.squared a:hover ul li a b {    
    left: -9999px;    
    }    
    ul.squared a:hover ul a:hover {    
    height: 48px;    
    opacity: 1;    
    padding: 1px;    
    width: 48px;    
    }    
    ul.squared a:hover ul a:hover b {    
    display: block;    
    height: 50px;    
    line-height: 50px;    
    position: absolute;    
    text-align: center;    
    width: 50px;    
    }    
    ul.squared a:hover ul li.p1 a:hover b {    
    left: -50px;    
    top: 50px;    
    }    
    ul.squared a:hover ul li.p2 a:hover b {    
    left: -50px;    
    top: 0;    
    }    
    ul.squared a:hover ul li.p3 a:hover b {    
    left: -50px;    
    top: -50px;    
    }    
    ul.squared a:hover ul li.p4 a:hover b {    
    left: 0;    
    top: -50px;    
    }    
    ul.squared a:hover ul li.p5 a:hover b {    
    left: 50px;    
    top: -50px;    
    }    
    ul.squared a:hover ul li.p6 a:hover b {    
    left: 50px;    
    top: 0;    
    }    
    ul.squared a:hover ul li.p7 a:hover b {    
    left: 50px;    
    top: 50px;    
    }    
    ul.squared a:hover ul li.p8 a:hover b {    
    left: 0;    
    top: 50px;    
    }

<ul class="squared">    
    <li><a href="index.html"><b>Mesaj</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/mesaj.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p7 s1"><a href="index.html"><b>Mesaj 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/mesaj1.png"></a></li>    
    <li class="p8 s2"><a href="index.html"><b>Mesaj 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/mesaj2.png"></a></li>    
    <li class="p1 s3"><a href="index.html"><b>Mesaj 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/mesaj2.png"></a></li>    
    <li class="p2 s4"><a href="index.html"><b>Mesaj 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/mesaj4.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    <li><a href="index.html"><b>Principală</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/acasa.png"></a></li>    
    <li><a href="index.html"><b>Schimbă</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/redacteaza.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p1 s1"><a href="index.html"><b>Schimbă 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/schimba1.png"></a></li>    
    <li class="p2 s2"><a href="index.html"><b>Schimbă 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/schimba2.png"></a></li>    
    <li class="p3 s3"><a href="index.html"><b>Schimbă 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/schimba3.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    <li class="mid"><a href="index.html"><b>Spune</b><img alt="" src="http://www.os-windows7.ru/vsak/iconimage/talk.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p6 s1"><a href="index.html"><b>Spune 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/spune1.png"></a></li>    
    <li class="p7 s2"><a href="index.html"><b>Spune 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/spune2.png"></a></li>    
    <li class="p8 s3"><a href="index.html"><b>Spune 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/spune3.png"></a></li>    
    <li class="p1 s4"><a href="index.html"><b>Spune 4</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/spune4.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    <li><a href="index.html"><b>Poze</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/poze.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p2 s1"><a href="index.html"><b>Poze 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/poze1.png"></a></li>    
    <li class="p3 s2"><a href="index.html"><b>Poze 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/poze2.png"></a></li>    
    <li class="p4 s3"><a href="index.html"><b>Poze 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/poze3.png"></a></li>    
    <li class="p5 s4"><a href="index.html"><b>Poze 4</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/poze4.png"></a></li>    
    <li class="p6 s5"><a href="index.html"><b>Poze 5</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/poze5.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    <li><a href="index.html"><b>Coșul</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cosul.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p5 s1"><a href="index.html"><b>Coșul 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cosul1.png"></a></li>    
    <li class="p6 s2"><a href="index.html"><b>Coșul 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cosul2.png"></a></li>    
    <li class="p7 s3"><a href="index.html"><b>Coșul 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cosul3.png"></a></li>    
    <li class="p8 s4"><a href="index.html"><b>Coșul 4</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cosul4.png"></a></li>    
    <li class="p1 s5"><a href="index.html"><b>Coșul 5</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/cosul5.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    <li><a href="index.html"><b>Banii</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/banii.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p4 s1"><a href="index.html"><b>Banii 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/banii1.png"></a></li>    
    <li class="p5 s2"><a href="index.html"><b>Banii 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/banii2.png"></a></li>    
    <li class="p6 s3"><a href="index.html"><b>Banii 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/banii3.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    <li><a href="index.html"><b>Muzică</b><img alt="" src="http://www.os-windows7.ru/vsak/iconimage/audio.png"><!--[if gte IE 7]><!--></a><!--<![endif]-->    
    <!--[if lte IE 6]><table><tr><td><![endif]-->    
    <ul>    
    <li class="p3 s1"><a href="index.html"><b>Muzică 1</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/muzica1.png"></a></li>    
    <li class="p4 s2"><a href="index.html"><b>Muzică 2</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/muzica2.png"></a></li>    
    <li class="p5 s3"><a href="index.html"><b>Muzică 3</b><img alt="" src="http://fierbinte.ucoz.ro/Forum/Diverse/Diverse_2/180_grade/muzica3.png"></a></li>    
    </ul>    
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->    
    </li>    
    </ul>

/* Meniu acordeon */
#accordion .item {
  width: 250px;
  height: 30px;  
  overflow: hidden;
   
  border: 1px solid #ccc;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
   
  margin-bottom: 2px;
}
#accordion h3 {
  display: block;
  height: 20px;
  line-height: 20px;
  margin: 0px 0px 5px 0px;
  background: #e6e6e6;
  padding: 5px;
  color: #1e1e1e;
  text-decoration: none;
}
#accordion p {
  height: 150px;
  padding: 5px;
}
#accordion div:hover h3 {
  border-bottom: 1px solid #ccc;
  font-weight: bold;
}

.aleft {
  float:left;
  width:90px;
}
.aright {
  float:left;
  width:90px;
}
.arsip li {
  float: left;
  width: 120px;
}
.clearfix {
  display: inline-block;
}

#accordion .item {  
  transition: height ease-in-out 500ms; /* css3 transition */
  -o-transition: height ease-in-out 500ms;
  -moz-transition: height ease-in-out 500ms;
  -webkit-transition: height ease-in-out 500ms;
}
#accordion div:hover {
  height: 180px;  
}

#accordion .item {
  width: 250px;
  height: 30px;  
  overflow: hidden;
   
  transition: height ease-in-out 500ms; /* css3 transition */
  -o-transition: height ease-in-out 500ms;
  -moz-transition: height ease-in-out 500ms;
  -webkit-transition: height ease-in-out 500ms;
   
  border: 1px solid #ccc;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
   
  margin-bottom: 2px;
}
#accordion h3{
  display: block;
  height: 20px;
  line-height: 20px;
   
  background: #e6e6e6;
  padding: 5px;
  color: #1e1e1e;
  text-decoration: none;
}
#accordion p {
  height: 150px;
  padding: 5px;
}
#accordion div:hover {
  height: 180px;  
}
#accordion div:hover h3 {
  border-bottom: 1px solid #ccc;
  font-weight: bold;
}

<div id="accordion">
  <div class="item">
  <h3>Pagina principală</h3>
  <p>Textul, adresa, sau orice altceva.</p>
  </div>
  <div class="item">
  <h3>Catalog de fişiere</h3>
  <p>Textul, adresa, sau orice altceva.</p>
  </div>
  <div class="item">
  <h3>Carte pentru oaspeţi</h3>
  <p>Textul, adresa, sau orice altceva.</p>
  </div>
  <div class="item">
  <h3>Informaţii despre site</h3>
  <p>Textul, adresa, sau orice altceva.</p>
  </div>
</div>

<div class="blogroll">  
  <p>Meniul principal</p>  
  <ul>  
  <li><a href="/">Filme online</a></li>  
  <li><a href="/">Descarcă muzică</a></li>  
  <li><a href="/">Jocuri PC 2012</a></li>  
  <li><a href="/">Programe noi</a></li>  
  <li><a href="/">Scripturi și labloane</a></li>  
  <li><a href="/">Întrebări și răspunsuri</a></li>  
  <li><a href="/">Propunerile dumneavoastră</a></li>  
  <li><a href="/">Chat, Radio și Distracșție</a></li>  
  </ul>  
  </div>

/* Aspect Meniu-adrese */  
.blogroll {  
  position:relative;  
  width:274px;  
  }  
  .blogroll p {  
  font:13px Verdana,Arial,Helvetica, sans-serif; color:#666;  
  font-weight: bold;  
  text-shadow: 1px 1px 1px #fff;  
  width:252px;  
  height:25px;  
  background:url('Adresa imaginii') 0 0 no-repeat; /*Fundalului adresei principale*/
  margin:0;  
  padding: 4px 0px 0px 10px;  
  }  

  .blogroll ul {  
  list-style:none;  
  width:222px; /*Lungimea chenarului*/
  background:#F4F5F6;  
  border:1px solid #d0d0d0;  
  border-bottom: none;  
  border-width:0 1px 1px 1px;  
  position:absolute;  
  left:0;  
  top:25px;  
  margin:0;  
  padding:0;  
  }  

  .blogroll ul a:link,  
  .blogroll ul a:visited {  
  display:block;  
  color:#555;  
  font-weight:normal;  
  text-decoration:none;  
  width:170px; /*Lungimea liniilor*/
  padding:4px 10px 4px 10px;  
  border-bottom: 1px solid #d0d0d0;  
  border-top: 1px solid #fff;  
  }  

  .blogroll ul a:hover,  
  .blogroll ul a:active {  
  background:#fff;  
  }  

  .blogroll {  
  height:25px;  
  overflow:hidden;  
  }  

  .blogroll:hover {  
  overflow:visible;  
  }

<script type="text/javascript">
var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas

function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}

if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)
</script>
<div class="suckerdiv"><b>
<ul id="suckertree1">
<li><a href="#">Pagina principală</a></li>
<li><a href="#">Forumul nostru</a></li>
<li><a href="#">Carte pentru oaspeți</a></li>
<li><a href="#/">Cele mai noi filme</a></li>
<li><a href="#">Muzică românească</a>
<ul>
<li><a href="#">Videoclipuri</a></li>
<li><a href="#">În limba română</a></li>
<li><a href="#">În alte limbi</a></li>
<li><a href="#">Eu vara nu dorm</a></li>
<li><a href="#">Biografii</a></li>
<li><a href="#">Cei mai buni</a></li>
<li><a href="#">Concursuri</a></li>
</ul>
</li>
<li><a href="#">Totul pentru ucoz</a>
<ul>
<li><a href="#">Scripturi</a></li>
<li><a href="#">Șabloane</a></li>
<li><a href="#">Iconițe</a></li>
<li><a href="#">Altceva</a></li>
<li><a href="#">Altceva</a></li>
<li><a href="#">Altceva</a></li>
<li><a href="#">Altceva</a></li>
</ul>
</li>

<li><a href="#">Photoshop</a>
<ul>
<li><a href="#">Pensule</a></li>
<li><a href="#">Stiluri</a></li>
<li><a href="#">Suprapuneri</a></li>
<li><a href="#">Avatare [PSD]</a></li>
</ul>
</li>
<li><a href="#">Campionate de fotbal</a></li>
<li><a href="#" title="Găsește ceea ce cauți">Fierbinte</a></li>
<li><a href="#">Contactați-ne</a></li>
</ul>
</b></div>

/* Aspect meniu */
.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 190px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
}

.suckerdiv ul li{
position: relative;
}

/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 200px; /*sub menu width*/
top: 0;
visibility: hidden;
}

/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: black;
text-decoration: none;
background: #fff;
padding: 4px 15px;
border: 1px solid #ccc;
border-bottom: 0;
}

.suckerdiv ul li a:visited{
color: black;
}

.suckerdiv ul li a:hover{
background-color: green;
}

.suckerdiv .subfolderstyle{
background: url(http://fierbinte.ucoz.ro/Forum/Aspect/Meniu/Meniu_alb_cu_subcategorii.gif) no-repeat center right;
}

* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }

/* Stilurile Meniului */
.zp-navigation{width:240px;}
.zp-navigation {
background:url('BAGI ADRESA IMAGINII-FUNDAL, DACĂ DOREȘTI') repeat #2B1E18;
margin:1px 2px 7px 2px;
color:#fff;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
box-shadow:0px 1px 2px rgba(0, 0, 0, 0.6);
-moz-box-shadow:0px 1px 2px rgba(0, 0, 0, 0.6);
-webkit-box-shadow:0px 1px 2px rgba(0, 0, 0, 0.6);
}

.zp-navigation h3 {
color:#fff;
font-weight:normal;
font-size: 1.7em;
padding:3px 8px;
}

.zp-navigation .zp-links a {
display:block;
color:#fff;
padding:4px 8px;
border-top:1px solid #000;
box-shadow:0px 1px 0px rgba(255,255,255,0.1) inset;
-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.1) inset;
-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.1) inset;
text-shadow:0px 1px 0px #000;
-moz-transition:all 0.3s ease;
-webkit-transition:all 0.3s ease;
-o-transition:all 0.3s ease;
transition:all 0.3s ease;
font-weight:bold;
}

.zp-navigation .zp-links a.w-sub {
font-weight:bold !important;
background:url('http://fierbinte.ucoz.ro/Forum/Aspect/Meniu/1/11.png') no-repeat 220px 9px;
}

.zp-navigation .zp-links .s-level a.w-sub {
font-weight:bold !important;
background:url('http://fierbinte.ucoz.ro/Forum/Aspect/Meniu/1/11.png') no-repeat 170px 9px;
}

.zp-navigation .zp-links a:hover {
text-decoration:none;
background-color:rgba(0,0,0,0.3);
padding-left:14px;
color:#FFBF2B;
}

.zp-navigation .zp-links .s-level {padding-left:24px;}

.zp-navigation .zp-links .s-level a {
border:2px solid #FFB32E;
border-width:0px 0px 0px 2px;
margin-top:1px;
box-shadow:0px 2px 0px rgba(255,255,255,0.1) inset, 0px 1px 0px #000 inset;
-moz-box-shadow:0px 2px 0px rgba(255,255,255,0.1) inset, 0px 1px 0px #000 inset;
-webkit-box-shadow:0px 2px 0px rgba(255,255,255,0.1) inset, 0px 1px 0px #000 inset;
font-weight:normal;
}

.zp-navigation .zp-links .s-level a:hover {
padding-left:8px;
margin-left:-8px;
}

.custom-links{border-top:1px solid #3B2D2A;padding:1px
0px}.custom-links
a{color:#000;background:#fff;height:20px;line-height:20px;display:block;margin:3px
6px;padding:0px
6px;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px}.custom-links a:hover{color:#000}.custom-links
a.blue{background:url('http://fierbinte.ucoz.ro/Forum/Aspect/Meniu/1/22.png') repeat-x #8BB917}.custom-links a.blue:hover{box-shadow:0px 0px 5px #8BB917;-webkit-box-shadow:0px 0px 5px #8BB917;-moz-box-shadow:0px 0px 5px #8BB917}.custom-links
a.orange{background:url('http://fierbinte.ucoz.ro/Forum/Aspect/Meniu/1/22.png') repeat-x #FFB300;text-shadow:0px 1px 0px #FFD87B}.custom-links a.orange:hover{box-shadow:0px 0px 5px #FFB300;-webkit-box-shadow:0px 0px 5px #FFB300;-moz-box-shadow:0px 0px 5px #FFB300}.box-out.margin{margin-bottom:10px}     
/* ------------- */

<div class="zp-navigation">
<h3>Meniul sait-ului</h3>
<div class="zp-links">
<a href="/" title="Prima pagină"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Casuta.png" class="catshort"> Pagina principală</a>
<a href="/forum"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Forum.png" class="catshort"> Mergi pe Forum</a>
<a href="/" title="Știri"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Steluta.png" class="catshort"> Știri de ultimă oră</a>
<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Rosietic.png" class="catshort"> Știri din întreaga lume</a>

<a href="javascript://" class="w-sub" onclick="$('#soft-menu').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/DLE.png" class="catshort"> Totul pentru DLE</a>
<div id="soft-menu" class="s-level">
<a href="/" >Șabloane pentru DLE</a>
<a href="/" >Module pentru DLE</a>
<a href="/" >Scripturi pentru DLE</a>
<a href="/" >Release-uri pentru DLE</a>
</div>

<a href="javascript://" class="w-sub" onclick="$('#games-menu').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Joomla.png" class="catshort"> Totul pentru Joomla</a>
<div id="games-menu" class="s-level">
<a href="/" >Șabloane pentru Joomla</a>
<a href="/" >Module pentru Joomla</a>
<a href="/" >Scripturi pentru Joomla</a>
</div>

<a href="javascript://" class="w-sub" onclick="$('#ucoz-menu').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Ucoz.png" class="catshort"> Totul pentru uCoz</a>
<div id="ucoz-menu" class="s-level">
<a href="http://fierbinte.ucoz.ro/forum/4" >Șabloane pentru Ucoz</a>
<a href="/" >Informatori pentru Ucoz</a>
<a href="/" >Scripturi pentru Ucoz</a>
<a href="/" >Aspecte pentru Ucoz</a>
</div>

<a href="javascript://" class="w-sub" onclick="$('#kino-menu').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Wordpress.png" class="catshort"> Totul pentru Wordpress</a>
<div id="kino-menu" class="s-level">
<a href="/" >Module pentru Wordpress</a>
<a href="/" >Scripturi pentru Wordpress</a>
<a href="/" >Release-uri pentru Wordpress</a>
</div>

<a href="javascript://" class="w-sub" onclick="$('#soc_seti').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Facebook.png" class="catshort"> Rețelele de socializare</a>
<div id="soc_seti" class="s-level">
<a href="/" >Pentru Facebook</a>
<a href="/" >Pentru Twitter</a>
<a href="/" >Pentru celelalte</a>
</div>

<a href="javascript://" class="w-sub" onclick="$('#pay').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Euro.png" class="catshort"> Secțiunea Cu plată</a>
<div class="s-level" id="pay">
<a href="/" >Șabloane cu plată</a>
<a href="/" >Playere radio cu plată</a>
<a href="/" >Găzduire posturi de radio</a>
</div>

<a href="javascript://" class="w-sub" onclick="$('#shablons_html').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Calculator.png" class="catshort"> Totul pentru începători</a>
<div id="shablons_html" class="s-level">
<a href="/" >Cum instalezi un șablon?</a>
<a href="/" >Lista codurilor de bază</a>
<a href="/" >Semnificația tag-urilor</a>
</div>     
         

<a href="javascript://" class="w-sub" onclick="$('#photoshop-menu').toggle('normal');"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Fotosop.png" class="catshort"> Expert în Fotoșop</a>
<div class="s-level" id="photoshop-menu">
<a href="/" >Fișiere PSD</a>
<a href="/" >Tutoriale</a>
<a href="/" >Avatare la comandă</a>
<a href="/" >Descarcă programul</a>
</div>

<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Setari.png" class="catshort"> Setările modulului</a>
<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Statistici.png" class="catshort"> Statisticile de zi</a>
<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Despre.png" class="catshort"> Date despre noi</a>
<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Medalie.png" class="catshort"> Concursuri și premii</a>
<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Emoticon.png" class="catshort"> Bancuri și zicale</a>
<a href="/"><img src="http://fierbinte.ucoz.ro/Forum/Iconite/Mici/1/Lupa.png" class="catshort"> Căutare avansată</a>
</div>

<div class="custom-links">
<a class="blue" href="http://fierbinte.ucoz.ro/" rel="nofollow" target="_blank"> Scripturi și șabloane în Română</a>
</div>
</div>

<script type="text/javascript">
$(function(){
$(".s-level").hide();
});
</script>