/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : May 4, 2018, 9:20:04 AM
    Author     : ymata
*/
.ui-tooltip, .arrow:after, .arrow-right:after, .arrow-right-small:after {
    background: #16325c !important;
}

.ui-tooltip {
    padding: 0.5rem 0.75rem;
    color: white !important;
    border-radius: 0.25rem !important;
    font: normal 0.75rem "Salesforce Sans", Arial, sans-serif !important;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16) !important;
}

.arrow {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
}

.arrow.top {
    top: -16px;
    bottom: auto;
}

.arrow.left {
    left: 20%;
}

.arrow:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 6px 5px 9px -9px black;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.arrow.top:after {
    bottom: -20px;
    top: auto;
}

.arrow-right {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
}

.arrow-right.top {
    top: -16px;
    bottom: auto;
}

.arrow-right.left {
    left: calc(100% - 30px);
}

.arrow-right:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 6px 5px 9px -9px black;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.arrow-right.top:after {
    bottom: -20px;
    top: auto;
}