چطور در سی اس اس قالبم منو بذارم

باسلام و عرض احترام
من طبق ی آموزش ویدئویی ی قالب ساده ساختم
ک یه موقعیت برای منو بالای اسلاید شو قراردادم
تا اینجا همه چی درست
اما یجای آموزش میاد کد سی اس اس مربوط به منو (سایز و رنگ تعریف شده بود)رو پاک میکنه و کد زیرو میذاره
با این کار سایت بیشتر بهم ریخت و اون موقعیت به اندازه گزینه های منو که زیر هم میاد باز شد
کد اولیه برای اون موقعیت اینو گذاشتم
#topmenu{
width:800px;
height:40px;
background-color:#000;
border-radius:10px;}
کدی که توی آموزش بود اول گرفت کد بالا رو پاک کرد بعد کد زیر رو پیست کرد

کد:

---


#menu1 {
        direction:rtl;
        overflow: visible;
        color: #000;
        position: relative;
        z-index: 999;
}

#menu2 {}

#menu { 
        min-height: 40px;
        width:800px;
        background-color: #0784e4;
        background-image: -moz-linear-gradient(top, #0784e4, #0750e4);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0784e4), to(#0750e4));
        background-image: -webkit-linear-gradient(top, #0784e4, #0750e4);
        background-image: -o-linear-gradient(top, #0784e4, #0750e4);
        background-image: linear-gradient(to bottom, #0784e4, #0750e4);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F90', endColorstr='#FC0', GradientType=0);
        border: none;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px; border-radius: 8px;
        -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
        -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
        *zoom: 1;
}

#menu ul {
        margin:0;
        padding:0;
}

#menu ul li {
        list-style:none;
        display:inline-block;
        position:relative;
        padding:0;
        margin:0;
        height:40px;
        border-left:1px solid #b5c5e5;
        font-family:pars,Arial, Helvetica, sans-serif;
}

#menu ul li a {
        display:block;
        padding:0 15px;
        margin:0;
        line-height:35px;
        text-decoration:none;
        font-size:15px;
        color:#000;
}

#menu .menu li a {
        color: #000;
        text-decoration: none;
        text-shadow: 0 1px 0 #ffffff;
}

#menu .menu li a:hover {
        background-color: transparent;
        color: #CE205A;
        text-decoration: none;
        background-color: #e5e5e5;
        -webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
        -moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
        box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}

#menu .menu .active a,#menu .nav .active a:hover {
        color: #CE205A;
        text-decoration: none;
        background-color: #e5e5e5;
        -webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
        -moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
        box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}

#menu ul li a span.menutitle {
        display:block;
}

#menu ul li a span.menudesc {
        float:right;
        clear:both;
        font-size:11px;
        line-height:12px;
        margin:-20px 0 0 0;
        font-family:pars,Arial, Helvetica, sans-serif
}

/* submenu */
#menu ul li ul {
        position:absolute;
        width:170px;
        right:-999em;
        margin:0;
        padding:5px;
        background-color: #b5c5e5;
        border: 1px solid #dedede;
        *border-right-width: 2px;
        *border-bottom-width: 2px;
        -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
        -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
}

#menu ul li a:hover {
        text-decoration:overline;
        text-shadow:0px 1px 1px #FFF;
}

#menu ul li:hover ul, #menu ul li.sfHover ul {
        right:0;
}

#menu ul li ul li:hover ul {
        right:170px;
        top:0;
}

#menu ul li ul li {
        padding:0;
        height:auto;
        width:170px;
        margin:0 0 5px 0;
        border-right:none;
}

#menu ul li:hover ul li a {
        text-shadow:none;
        margin:0;
        padding:1px 10px 1px 0px;
        line-height:25px;
        font-size:14px;
        text-align:right;
}

#menu ul li:hover ul li {
        background:none;
}

#menu ul li:hover ul li a,
#menu ul li ul li a,
#menu ul li li ul li a,
#menu ul li.active ul li a,
#menu ul li ul li.active ul li a,
#menu ul li.active ul li a,
#menu ul li ul li.active ul li a {
        color:#000;
        background:none;
        border:1px solid #b5c5e5;
}

#menu ul li ul li a:hover,#menu ul li ul li.active a,#menu ul li.active ul li a:hover,#menu ul li li ul li a:hover,#menu ul li ul li.active ul li.active a,#menu ul li ul li.active a,#menu ul li.active ul li a:hover {
        color: #000000;
        text-decoration: none;
        background-color: #7898d8;
        background-image: -moz-linear-gradient(top, #7898d8, #4d7dde);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7898d8), to(#4d7dde));
        background-image: -webkit-linear-gradient(top, #7898d8, #4d7dde);
        background-image: -o-linear-gradient(top, #7898d8, #4d7dde);
        background-image: linear-gradient(to bottom, #7898d8, #4d7dde);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff70e3e8', endColorstr='#ff28ccca', GradientType=0);
        border-color: #28ccca #28ccca #5da8c7;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
        border-style:solid; border-width:1px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
    border-radius: 8px;
}

#menu ul li ul ul, #menu ul li:hover ul ul,#menu ul li.sfHover ul ul ul, #menu ul li.sfHover ul ul ul ul {
        right:-999em;
        padding:5px;
        margin:-5px 0 0 0;
}

---

من فقط میخام یه منو که زیر منو داره رو بتونم نمایش بدم و اندازه و رنگ هاش دست خودم باشه
بامنو ساز ها هم مشکل دارم
چیکارکنم؟