qtip плагин выезжает за границы

На сайте есть иконки, для которых предусмотрен tooltip, тултип показывается рядом с мышью, и содержимое получается справа снизу от мыши, но если на телефоне посмотреть тултип ближе к правому краю, то получается так, что появляется свободное место справа или скролл на пк.
Здесь я вставил jquery плагин + часть сайта: https://jsfiddle.net/pasha_sergeev/zg0cr9vd/
Здесь ссылка на документацию к плагину: http://qtip2.com/plugins#viewport.viewport
Хоть убейте не пойму как настроить. Нужно сделать так, чтобы чем ближе к правому краю, тем менялось отображение блока, то есть ближе к центру, оно было бы снизу мыши, ближе к правому краю - слева снизу от мыши. Подскажите кто сможет

$('.hasTooltip').each(function() { // Notice the .each() loop, discussed below
$(this).qtip({
    content: {
        text: $(this).next('div') // Use the "div" element next to this for the content
    },
    style: {
    classes: 'qtip-bootstrap'
},
      position: {
         target: 'mouse', // Track the mouse as the positioning target
         adjust: { x: 10, y: 10 } // Offset it slightly from under the mouse
     }
});

});