Dropdown menu hover new

Annyeonghaseyo.Here is the demo.
Hahaha,so simple,demo is like mine,navigation on top.
So,here is the code.

1.Copy and paste it on your HTML Javascript.

<style type="text/css">
#t1 {
background-color:#fff;
width: 115px;
text-align: center;
display:inline-block;
font-size: 10px;
letter-spacing:3px;
font-family: 'Metrophobic', sans serif;
text-transform: uppercase;
color: #888888;
9px;transition: all 0.5s ease;
-o-transition-transition:  all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
border:1px solid #FFFFFF;
}

#t1:hover {
color:#666;
9px;transition: all 0.5s ease;
-o-transition-transition:  all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
}

#t1:hover #t2 a:moo{
border-top:0px solid #fff;
 }

#t1:hover #t2{
opacity:3;
-webkit-transition-duration:.7s;
overflow:hidden;
background-color:transparent;
z-index:966666666666666666666666666666666666666669;
height:auto;
}

#t2 {
position:absolute;
overflow:hidden;
width: 115px;
height: 0px;
text-transform: uppercase;
line-height: 20px;
font-size: 7pt;
font-family: 'Lora', serif;
padding-top: 3px;
opacity:0;
transition: all 0.5s ease;
-o-transition-transition:  all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
}

#t2 a{
background-color:#666;
color: #ffffff;
text-align:center;
display:block;
text-transform: lowercase;
font-style: italic;
line-height: 20px;
font-family: 'Lora', serif;
font-size: 7pt;
transition: all 0.5s ease;
-o-transition-transition:  all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
}


#t2 a:hover{
text-align: right;
font-family: 'Lora', serif;
font-size: 7pt;
color:#666;
background-color:#f1f1f1;
opacity:100;
transition: all 0.5s ease;
-o-transition-transition:  all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
}

#izzy {
width:910px;
text-align: center;
left: 50px;
margin-right: auto;
}

</style>

<!---- Change everything with your own! ----!>

<div id="head">
<div id="izzy">
<div id="t1">Content
<div id="t2">
<a href="/">all</a>
<a href="/search/label/life">life</a>
<a href="/search/label/friends">friends</a>
<a href="/search/label/school">school</a>
<a href="/search/label/quote">quotes</a>
<a href="/search/label/holiday">holiday</a>
<a href="/search/label/food">food</a>
<a href="/search/label/idol">idol</a>
<a href="/search/label/songs">songs</a>
<a href="/search/label/photography">photography</a>
</div>
</div>

<div id="t1">About
<div id="t2">
<a href="/search/label/about">the girl</a>
<a href="/search/label/the blog">the blog</a>
<a href="/search/label/faq">f.a.q</a>
</div>
</div>

<div id="t1">Lists
<div id="t2">
<a href="/search/label/tutorial">tutorial</a>
<a href="/search/label/wishlist">wishlist</a>
<a href="/search/label/tips">tips</a>
<a href="/search/label/challenge">challenge</a>
<a href="/search/label/award">award</a>
<a href="http://.com">affiliates</a>
<a href="http://.com">banners</a>
</div>
</div>

<div id="t1">Review
<div id="t2">
<a href="/search/label/books">books</a>
<a href="/search/label/comics">comics</a>
<a href="/search/label/anime">anime</a>
<a href="/search/label/drama">drama</a>
<a href="/search/label/movie">movie</a>
<a href="/search/label/beauty">beauty</a>
</div>
</div>

<div id="t1">Networks
<div id="t2">
<a href="https://twitter.com/">twitter</a>
<a href="https://www.facebook.com/">facebook</a>
<a href="http://tumblr.com/">tumblr</a>
<a href="http://blogskins.com">blogskins</a>
<a href="http://ask.fm">ask.fm</a>
</div>
</div>

<div id="t1">Obsessed
<div id="t2">
follow
<a href="http://blogger.com">dashboard</a>
<a href="http://.com/">extra</a>
<a href="http://.com/">extra</a>
<a href="http://.com/">extra</a>
</div>
</div></div>

<!---- Change everything with your own! ----!></div>

2.Edit your link and title,if you want.

3.Color??Change it.Its up to you.

4.Preview and save.

5.Hooray,done.