.tooltip > .tooltip-inner {background-color: #f00}

.tooltip > .arrow::before { border-bottom-color:#f00}

​

/* .mytooltip {

  background-color:  #5A2D83 !important;

}

.bs-tooltip-auto[x-placement^=bottom] .arrow::before, 

.bs-tooltip-bottom .arrow::before {

    border-bottom-color: #5A2D83 !important;

}

.bs-tooltip-auto[x-placement^=top] .arrow::before, 

.bs-tooltip-top .arrow::before {

    border-top-color: #5A2D83 !important;

}

.bs-tooltip-auto[x-placement^=left] .arrow::before, 

.bs-tooltip-left .arrow::before {

    border-left-color: #5A2D83 !important;

}

.bs-tooltip-auto[x-placement^=right] .arrow::before,

.bs-tooltip-right .arrow::before {

    border-right-color: #5A2D83 !important;

} */

/*$(document).ready(function(){

    $('[data-toggle="tooltip"]').tooltip();

});*/

​

$('[data-toggle="tooltip"]').tooltip({

  delay: { "show": 500, "hide": 500 },

  offset: '0 10',

  template: '<div class="tooltip" role="tooltip"><div class="arrow custom-class"></div><div class="tooltip-inner mytooltip shadow"></div></div>'

  //template: '<div class="tooltip" role="tooltip"><div class="arrow custom-class"></div><div class="tooltip-inner mytooltip shadow"></div></div>'

});