Negrito, Itálico e sublinhado personalizado com efeito

Oiii queria creditar o paradise-bieber por esse tutorial muiito bom !Agora chega de conversa fiada e vamos pro que intereça!

primeiro pesquise por:

 ]]b:skin>

e cole acima dele isso:

b {color: COR1; text-decoration: none;-webkit-transition-duration: .80s;}
b:hover {color: COR2; text-decoration: none;-webkit-transition-duration: .80s; }
i {color: COR1; text-decoration: none;-webkit-transition-duration: .80s;}
i:hover {color: COR 2; text-decoration: none;-webkit-transition-duration: .80s;}
u {color: COR 1; text-decoration: none; border-bottom: 1px dashed COR DO SUBLINHADO1;-webkit-transition-duration: .80s;}
u:hover {color: COR2; text-decoration: none; border-bottom: 1px dashed COR DO SUBLINHADO2;-webkit-transition-duration: .80s;}

E pronto simples né !