﻿.angular-tooltip {
    position: absolute;
    background: #000;
    z-index: 99999;
    padding: 3px;
    border: 2px solid #000;
    color: #FFF;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    max-width: 250px;
    border-radius: 3px
}

    .angular-tooltip:after, .angular-tooltip:before {
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none
    }

    .angular-tooltip:before {
        border-color: transparent;
        border-width: 8px
    }

    .angular-tooltip:after {
        border-color: transparent;
        border-width: 5px
    }

    .angular-tooltip.angular-tooltip-top-center:after, .angular-tooltip.angular-tooltip-top-center:before, .angular-tooltip.angular-tooltip-top-middle:after, .angular-tooltip.angular-tooltip-top-middle:before, .angular-tooltip.angular-tooltip-top:after, .angular-tooltip.angular-tooltip-top:before {
        top: 100%;
        left: 50%
    }

    .angular-tooltip.angular-tooltip-top-center:before, .angular-tooltip.angular-tooltip-top-middle:before, .angular-tooltip.angular-tooltip-top:before {
        margin-left: -8px;
        border-top-color: #000
    }

    .angular-tooltip.angular-tooltip-top-center:after, .angular-tooltip.angular-tooltip-top-middle:after, .angular-tooltip.angular-tooltip-top:after {
        margin-left: -5px;
        border-top-color: #000
    }

    .angular-tooltip.angular-tooltip-top-right:after, .angular-tooltip.angular-tooltip-top-right:before {
        top: 100%;
        right: calc(100% - 8px)
    }

    .angular-tooltip.angular-tooltip-top-right:before {
        margin-right: -8px;
        border-top-color: #000
    }

    .angular-tooltip.angular-tooltip-top-right:after {
        margin-right: -5px;
        border-top-color: #000
    }

    .angular-tooltip.angular-tooltip-right-top:after, .angular-tooltip.angular-tooltip-right-top:before {
        top: calc(100% - 8px);
        right: 100%
    }

    .angular-tooltip.angular-tooltip-right-top:before {
        margin-top: -8px;
        border-right-color: #000
    }

    .angular-tooltip.angular-tooltip-right-top:after {
        margin-top: -5px;
        border-right-color: #000
    }

    .angular-tooltip.angular-tooltip-right-center:after, .angular-tooltip.angular-tooltip-right-center:before, .angular-tooltip.angular-tooltip-right-middle:after, .angular-tooltip.angular-tooltip-right-middle:before, .angular-tooltip.angular-tooltip-right:after, .angular-tooltip.angular-tooltip-right:before {
        top: 50%;
        right: 100%
    }

    .angular-tooltip.angular-tooltip-right-center:before, .angular-tooltip.angular-tooltip-right-middle:before, .angular-tooltip.angular-tooltip-right:before {
        margin-top: -8px;
        border-right-color: #000
    }

    .angular-tooltip.angular-tooltip-right-center:after, .angular-tooltip.angular-tooltip-right-middle:after, .angular-tooltip.angular-tooltip-right:after {
        margin-top: -5px;
        border-right-color: #000
    }

    .angular-tooltip.angular-tooltip-right-bottom:after, .angular-tooltip.angular-tooltip-right-bottom:before {
        bottom: calc(100% - 8px);
        right: 100%
    }

    .angular-tooltip.angular-tooltip-right-bottom:before {
        margin-bottom: -8px;
        border-right-color: #000
    }

    .angular-tooltip.angular-tooltip-right-bottom:after {
        margin-bottom: -5px;
        border-right-color: #000
    }

    .angular-tooltip.angular-tooltip-bottom-right:after, .angular-tooltip.angular-tooltip-bottom-right:before {
        bottom: 100%;
        right: calc(100% - 8px)
    }

    .angular-tooltip.angular-tooltip-bottom-right:before {
        margin-right: -8px;
        border-bottom-color: #000
    }

    .angular-tooltip.angular-tooltip-bottom-right:after {
        margin-right: -5px;
        border-bottom-color: #000
    }

    .angular-tooltip.angular-tooltip-bottom-center:after, .angular-tooltip.angular-tooltip-bottom-center:before, .angular-tooltip.angular-tooltip-bottom-middle:after, .angular-tooltip.angular-tooltip-bottom-middle:before, .angular-tooltip.angular-tooltip-bottom:after, .angular-tooltip.angular-tooltip-bottom:before {
        bottom: 100%;
        left: 50%
    }

    .angular-tooltip.angular-tooltip-bottom-center:before, .angular-tooltip.angular-tooltip-bottom-middle:before, .angular-tooltip.angular-tooltip-bottom:before {
        margin-left: -8px;
        border-bottom-color: #000
    }

    .angular-tooltip.angular-tooltip-bottom-center:after, .angular-tooltip.angular-tooltip-bottom-middle:after, .angular-tooltip.angular-tooltip-bottom:after {
        margin-left: -5px;
        border-bottom-color: #000
    }

    .angular-tooltip.angular-tooltip-bottom-left:after, .angular-tooltip.angular-tooltip-bottom-left:before {
        bottom: 100%;
        left: calc(100% - 8px)
    }

    .angular-tooltip.angular-tooltip-bottom-left:before {
        margin-left: -8px;
        border-bottom-color: #000
    }

    .angular-tooltip.angular-tooltip-bottom-left:after {
        margin-left: -5px;
        border-bottom-color: #000
    }

    .angular-tooltip.angular-tooltip-left-bottom:after, .angular-tooltip.angular-tooltip-left-bottom:before {
        bottom: calc(100% - 8px);
        left: 100%
    }

    .angular-tooltip.angular-tooltip-left-bottom:before {
        margin-bottom: -8px;
        border-left-color: #000
    }

    .angular-tooltip.angular-tooltip-left-bottom:after {
        margin-bottom: -5px;
        border-left-color: #000
    }

    .angular-tooltip.angular-tooltip-left-center:after, .angular-tooltip.angular-tooltip-left-center:before, .angular-tooltip.angular-tooltip-left-middle:after, .angular-tooltip.angular-tooltip-left-middle:before, .angular-tooltip.angular-tooltip-left:after, .angular-tooltip.angular-tooltip-left:before {
        top: 50%;
        left: 100%
    }

    .angular-tooltip.angular-tooltip-left-center:before, .angular-tooltip.angular-tooltip-left-middle:before, .angular-tooltip.angular-tooltip-left:before {
        margin-top: -8px;
        border-left-color: #000
    }

    .angular-tooltip.angular-tooltip-left-center:after, .angular-tooltip.angular-tooltip-left-middle:after, .angular-tooltip.angular-tooltip-left:after {
        margin-top: -5px;
        border-left-color: #000
    }

    .angular-tooltip.angular-tooltip-left-top:after, .angular-tooltip.angular-tooltip-left-top:before {
        top: calc(100% - 8px);
        left: 100%
    }

    .angular-tooltip.angular-tooltip-left-top:before {
        margin-top: -8px;
        border-left-color: #000
    }

    .angular-tooltip.angular-tooltip-left-top:after {
        margin-top: -5px;
        border-left-color: #000
    }

    .angular-tooltip.angular-tooltip-top-left:after, .angular-tooltip.angular-tooltip-top-left:before {
        top: 100%;
        left: calc(100% - 8px)
    }

    .angular-tooltip.angular-tooltip-top-left:before {
        margin-left: -8px;
        border-top-color: #000
    }

    .angular-tooltip.angular-tooltip-top-left:after {
        margin-left: -5px;
        border-top-color: #000
    }
