$(function(){
  $('span.designed-icon').click(function(){
    var p = $(this).parent();
    var ph = p.height();
    var pw = p.width();
    var tt = $(this).siblings('div.designed-tt');
    var tth = tt.height();
    var ttw = tt.width();

    $('div.designed-tt').stop(true, true).fadeOut();

    tt.css({
      marginTop:(ph + tth) * -1 + 15,
      marginLeft:pw - (ttw / 2) - 12
    }).stop().fadeIn();
  });

  $('body').click(function(e){
    if (!$(e.target).is('span.designed-icon') && $(e.target).closest('div.designed-tt').length == 0) {
      $('div.designed-tt').stop(true, true).fadeOut();
    }
  });

  $('a.designed-tt-close').click(function(){
    $(this).parent().parent().stop(true, true).fadeOut();
  });
});