MENU [CSS] ~ evenyouth

@font-face {
font-family:'smallpix';
src: local('Ernest'),
url('http://static.tumblr.com/lvxiwhj/z7Jmm2jwh/ernest.ttf'); }

.menu {
width: 100px;
display:absolute;
padding: 10px 2px 3px ;
margin: 2px 9px 4px;
background: }


a.navi:link{
display: inline-block;
width: 20px;
height:20px;
margin: 2px;
font: 10px/18px smallpix;
font-weight: 400;
text-align:center;
border-radius: 5px;
text-decoration: none;}

a.navi:link:nth-of-type(4n+1) {
background: #61D2D6;
}

a.navi:link:nth-of-type(4n+2) {
background: #EA3556;
}

a.navi:link:nth-of-type(4n+3) {
background: #EDDE45;
}


a.navi:link:nth-of-type(4n+4) {
background: #E44E90;
}

a.navi:link:hover:nth-of-type(4n+1) {
background: #9cfbfe;
webkit-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
   -moz-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
     -o-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
        transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000); /* ease-in-out */
}

a.navi:link:hover:nth-of-type(4n+2) {
background: #fd95a7;
webkit-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
   -moz-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
     -o-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
        transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000); /* ease-in-out */
}

a.navi:link:hover:nth-of-type(4n+3) {
background: #f8ef91;
webkit-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
   -moz-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
     -o-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
        transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000); /* ease-in-out */
}

a.navi:link:hover:nth-of-type(4n+4) {
background: #fdbdda;
webkit-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
   -moz-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
     -o-transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
        transition: all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000); /* ease-in-out */
}