/* STIL DOSYAMIZI OLUŞTURMAYA BAŞLIYORUZ... */

#wrap {width:130px;}

/* Menü kodlarımız bu alanda başlıyor, lütfen yorumları takip ediniz. */

#menu {
font:12px arial, verdana, sans-serif;
width:130px;
font-weight:bold;
}

#menu ul {
list-style:none;
}

#menu li { /* menümüzün liste tanımı yapılıyor. */
list-style:none;
padding:0;
margin:0;
float:left;
position:relative;
width:120px;
}

#menu a {
text-decoration:none;
padding:4px;
display:block;
height:15px;
}

#menu a:hover {
text-decoration:none;
padding:4px;
display:block;
}

/* Alt menülerimizi gizliyor ve sonrasında alt menünün stil tanımlamalarına geçiyoruz. */

#menu li ul {
display:none; /* Alt menülerimizi gizliyoruz! */
position:absolute;
padding:0px;
margin:0px;
}

#menu li:hover > ul {
display:block; /* Alt menülerimiz #menu li üzerine fare ile gelinince görünecek şekilde hover ile gösterimini sağlıyoruz. */
position:absolute;
width:370px;
left:0

}


/* Alt menü görünümünü değiştirecek olan stilleri yazıyoruz. */

#menu ul ul {
width:370px;
height:100px;
border:1px solid #dfdfdf;
background-color:#dfdfdf;


}

#menu ul ul li {
display: inline-block;
float:left;

}

#menu ul ul a { /* alt menü listemizin linklerini tanımlıyoruz. */
display:block;
font:11px arial, verdana, sans-serif;
background:#dfdfdf;

}

#menu ul ul a:hover {
background:#990000;
color:#fff;

}