Efeito Balãozinho

Vamos a mais um tutorial?! 

Esse efeito aqui (xx)
Achei esse código pesquisando na internet, adaptei e decidi disponibilizar. Percebam que independente do tamanho, a setinha vai continuar no mesmo lugar. e existe 4 tipos, um para cada lado. Pegue os códigos:

• Top
• Right
• Bottom
• Left

O CSS do .balon-kata configura a cor, tamanho do balão, fonte, etc. Nesse você pode mexer a vontade.

O CSS que contém o lado que fica a setinha, eu aconselho a vocês não mexerem, deixem como está.

Agora é só colocar o código abaixo onde você quer que apareça o balãozinho.

<div class="balon-kata top">Num filme o que importa não é a realidade, mas o que dela possa extrair a imaginação.
Charles Chaplin</div>

Lembrando que no lugar de balon-kata top do código aqui de cima, você vai por o nome do estilo de você escolheu (top, left...)

Bem fácil né?! Deixe seu comentário ai se gostou do tutorial.