.sidenav a:link, .sidenav a:active, .sidenav a:visited { width:200px; /* Tamanho dos links */ color:#bea48f; /* Cor dos links */ display: inline-block; /* Modo de exibição */ text-decoration:none; /* Efeitos do texto. Normalmente está desativado. */ font-family:segoe ui light; /* Fonte */ font-size:12px; /* Tamanho da fonte */ padding:2px; /* Margem interna */ padding-left:10px; /* Margem interna */ border-left:10px solid #bea48f; /* Estilo da borda lateral dos links */ margin-top:2px; /* Margem interna */ -webkit-transition-property:color, text; /* Efeito fade */ -webkit-transition-duration: .4s; /* Efeito fade */ -moz-transition-duration: .4s; /* Efeito fade */ -webkit-transition-timing-function: linear, ease-in; /* Efeito fade */ } .sidenav a:hover { background-image:url(http://media.tumblr.com/tumblr_lkl75bsU9n1qfamg6.png); /* Mini gif do hover */ background-repeat:no-repeat; /* Repetição do mini gif. Normalmente está desativado. */ background-position:right; /* Posição do mini gif */ border-left:30px solid #bea48f; /* Estilo da borda lateral em hover */ width:180px; /* Tamanho dos links */ color:#e9b3ff; /* Cor dos links em hover */ padding-left:20px; /* Margem interna */ -webkit-transition-duration: .4s; /* Efeito fade */ -moz-transition-duration: .4s; /* Efeito fade */ }