change the font size in table tooltip

I want to change the font size of my tooltips in my table. No matter what I do nothing seems to change. Below is all my code excluding the HTML as its a bit big, but here is my jsfiddle

My JS code

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

My CSS

 .tableFixHead{ 
overflow: auto; 
height: 100px; 
width: 240px; 
}

.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }
.tableFixHead tbody th { position: sticky; left: 0; }

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: aqua;}

 .table th:first-child,
 .table td:first-child {
   position: sticky;
   left: 0;
   background-color: #6a85b0;
   color: #373737;
   font-weight: bold;
  }

.tooltip .tooltiptext {
   visibility: hidden;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   padding: 5px 0;
   border-radius: 6px;
   font-size: 20px;
   position: absolute;
   z-index: 1;
   }