/* START tooltip trigger */
a.tooltip_trigger {
    color: #999;
    display: block;
    text-decoration: none !important;
}

    a.tooltip_trigger::before {
        content: '\e822';
        display: block;
        font-family: "fontello";
        font-size: 19px;
        height: 23px;
        padding: 0 0 0 12px;
        position: relative;
        left: -7px;
        width: 30px;
    }

a.tooltip_trigger:active,
a.tooltip_trigger:focus,
a.tooltip_trigger:hover {
    border-color: #666;
    color: #666;
}

.trigger_left {
    width: 30px !important;
    float: left;
}

    .trigger_left .ttip.pointer_left,
    .trigger_right .ttip.pointer_right,
    .trigger_top .ttip.pointer_top,
    .trigger_bottom .ttip.pointer_bottom {
        position: absolute;
    }


label .trigger_label {
    float: left;
    margin-right: 7px;
    width: auto;
}

label .trigger_left span {
    float: left;
    position: relative;
    width: 30px;
}

label .trigger_left a.tooltip_trigger span::before {
    left: -6px;
}

/* END tooltip trigger */

/* Needs to be overrided in base css or create new tooltip component */
/*.js-tooltip {
    margin-bottom: 20px;
}*/

.tg-ttip {
    color: #777;
    top: -54px;
    left: 38px;
    width: 400px;
    border-radius: 3px;
    box-shadow: 0px 4px 6px 0px rgba(0,0,0,.15);
    -webkit-box-shadow: 0px 4px 6px 0px rgba(0,0,0,.15);
    -moz-box-shadow: 0px 4px 6px 0px rgba(0,0,0,.15);
    border: 1px solid #ddd;
    border-left: 3px solid #ffcc00;
}

.tg-ttip.active {
    position: absolute;
}


.tg-ttip.pointer_left:before {
    border-color: transparent;
}

    .tg-ttip::after {
        position: absolute;
        font-family: "fontello";
        content: " ";
        height: 0;
        width: 0;
        left: -27px;
        border: solid transparent;
        border-color: transparent #ffcc00 transparent transparent;
        border-width: 12px;
    }

    .tg-ttip.pointer_left::after {
        position: absolute;
        font-family: "fontello";
        content: " ";
        height: 0;
        width: 0;
        left: -27px;
        top: 36px;
        border: solid transparent;
        border-color: transparent #ffcc00 transparent transparent;
        border-width: 12px;
    }