Tutorial: Navigation bar with hover #3

Bismillahirahmanirahim...
Assalamualaikum danSalam Sejahtera..

Fara nak buat tuto baru..Navigation hover~ cantikkkkk!

haha kalau korang suka buat lah~

[ LIVE PREVIEW ]

Facebook Twitter Ask FM

1. Sign in --> Dashboard --> Layout -->add gadget --> html/java script

2. Copy code ni dan pastekan di ruah html tu.

<style>
.nav a{
background:#EBCCFF;
display:inline-block;
width:105px;
font:10px trebuchet ms;
margin:5px;
border:1px solid #e6e6e6;
text-align:center;
color:#858585;
text-decoration:none;
text-transform:uppercase;
letter-spacing:1px;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
transition: all 0.6s ease-in-out;
}
.nav a:hover {
border-radius:3px;
box-shadow: inset 60px 8px 0px 0px #140029, inset -60px -8px 0px 0px #140029;
color:#fff;
}
</style>
<br />
<div class="nav">
<div style="text-align: center;">
<a href="https://www.facebook.com/FaraNymShdwfangBoBoiBoy">Facebook</a>
<a href="https://twitter.com/nymboboiboy">Twitter</a>
<a href="http://ask.fm/nymboboiboy">Ask FM</a>
</div>

*** tukarkan warna sebelum hover Cari code kaler kat sini
***tukarkan warna selepas hover
*** tukar link & tittle

3. SAVE~

Senang. Dah la..
bye, assalamualaikum dan good luck!