Problem with the style of list

[animsaj]

Here is the page: http://armagan2014.blogspot.com/p/blog-page_14.html where I try to run this lesson: http://webdesign.tutsplus.com/tutorials/orman-clarks-vertical-navigation-menu-the-css3-version--webdesign-5944
This is the code that I use. I guess the problem is the global style that interferes with local style.


<link rel="stylesheet" href="http://4433.hit.bg/AR/EN/styles.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<div id="wrapper">

<ul class="menu">
<li class="item1"><a href="#">Български<span>резюме</span></a>
<ul>
<li class="subitem1"><a href="#">Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст </a></li>
<li class="subitem2"><a href="#">Strange “Stuff”</a></li>
<li class="subitem3"><a href="#">Automatic Fails</a></li>
</ul>
</li>
<li class="item2"><a href="#">English<span>summary</span></a>
<ul>
<li class="subitem1"><a href="#">Cute Kittens</a></li>
<li class="subitem2"><a href="#">Strange “Stuff”</a></li>
<li class="subitem3"><a href="#">Automatic Fails</a></li>
</ul>
</li>
</ul>

</div>

<!--initiate accordion-->
<script type="text/javascript">
$(function() {

var menu_ul = $('.menu > li > ul'),
menu_a = $('.menu > li > a');

menu_ul.hide();

menu_a.click(function(e) {
e.preventDefault();
if(!$(this).hasClass('active')) {
menu_a.removeClass('active');
menu_ul.filter(':visible').slideUp('normal');
$(this).addClass('active').next().stop(true,true).slideDown('normal');
} else {
$(this).removeClass('active');
$(this).next().stop(true,true).slideUp('normal');
}
});

});
</script>

[Beverleyh]

What is it that you'd like help with?

Please state your question/the problem clearly.