.webui-popover
{
    position: absolute;
    z-index: 1800;
    top: 0;
    left: 0;

    display: none;

    width: 276px;
    min-height: 32px;
    padding: 0;

    text-align: left;
    white-space: normal;

    border: 1px solid #e4eaec;
    border: 1px solid rgba(204, 213, 219, .8);
    border-radius: .286rem;
    background-color: #fff;
    -webkit-background-clip: padding-box;
            background-clip: padding-box;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .05);
            box-shadow: 0 2px 6px rgba(0, 0, 0, .05);
}
.webui-popover.top,
.webui-popover.top-left,
.webui-popover.top-right
{
    margin-top: -8px;
}
.webui-popover.right,
.webui-popover.right-top,
.webui-popover.right-bottom
{
    margin-left: 8px;
}
.webui-popover.bottom,
.webui-popover.bottom-left,
.webui-popover.bottom-right
{
    margin-top: 8px;
}
.webui-popover.left,
.webui-popover.left-top,
.webui-popover.left-bottom
{
    margin-left: -8px;
}
.webui-popover.pop
{
    -webkit-transition: -webkit-transform .15s cubic-bezier(.3, 0, 0, 1.5);
         -o-transition:      -o-transform .15s cubic-bezier(.3, 0, 0, 1.5);
            transition:         transform .15s cubic-bezier(.3, 0, 0, 1.5); 
    -webkit-transform: scale(.8);
        -ms-transform: scale(.8);
         -o-transform: scale(.8);
            transform: scale(.8);
}
.webui-popover.fade
{
    -webkit-transition: opacity .15s linear;
         -o-transition: opacity .15s linear;
            transition: opacity .15s linear;
}
.webui-popover.in
{
    -webkit-transform: none;
        -ms-transform: none;
         -o-transform: none;
            transform: none;

    opacity: 1;
}

.webui-popover-inner .close
{
    font-family: arial;
    font-size: 20px;
    font-weight: bold;
    line-height: 20px;

    float: right;

    margin: 5px 10px 0 0;

    text-decoration: none; 

    opacity: .2;
    color: #000;
    text-shadow: 0 1px 0 #fff;
}
.webui-popover-inner .close:hover,
.webui-popover-inner .close:focus
{
    opacity: .5;
}

.webui-popover-title
{
    font-size: 1rem;

    margin: 0;
    padding: 8px 14px;

    border-bottom: 1px solid #e2ecf1;
    border-radius: -.714rem -.714rem 0 0; 
    background-color: #f3f7f9;
}

.webui-popover-content
{
    overflow: auto; 

    padding: 20px;
}

.webui-no-padding .webui-popover-content
{
    padding: 0;
}

.webui-no-padding .list-group-item
{
    border-right: none;
    border-left: none;
}
.webui-no-padding .list-group-item:first-child
{
    border-top: 0;
}
.webui-no-padding .list-group-item:last-child
{
    border-bottom: 0;
}

.webui-popover > .arrow,
.webui-popover > .arrow:after
{
    position: absolute;

    display: block;

    width: 0;
    height: 0;

    border-style: solid; 
    border-color: transparent;
}

.webui-popover > .arrow
{
    border-width: 9px;
}

.webui-popover > .arrow:after
{
    content: ''; 

    border-width: 8px;
}

.webui-popover.top > .arrow,
.webui-popover.top-right > .arrow,
.webui-popover.top-left > .arrow
{
    bottom: -9px; 
    left: 50%;

    margin-left: -9px;

    border-top-color: #a8bbc2;
    border-top-color: rgba(204, 213, 219, .85);
    border-bottom-width: 0;
}
.webui-popover.top > .arrow:after,
.webui-popover.top-right > .arrow:after,
.webui-popover.top-left > .arrow:after
{
    bottom: 1px;

    margin-left: -8px;

    content: ' ';

    border-top-color: #fff; 
    border-bottom-width: 0;
}

.webui-popover.right > .arrow,
.webui-popover.right-top > .arrow,
.webui-popover.right-bottom > .arrow
{
    top: 50%;
    left: -9px;

    margin-top: -9px;

    border-right-color: #a8bbc2;
    border-right-color: rgba(204, 213, 219, .85); 
    border-left-width: 0;
}
.webui-popover.right > .arrow:after,
.webui-popover.right-top > .arrow:after,
.webui-popover.right-bottom > .arrow:after
{
    bottom: -8px;
    left: 1px;

    content: ' ';

    border-right-color: #fff; 
    border-left-width: 0;
}

.webui-popover.bottom > .arrow,
.webui-popover.bottom-right > .arrow,
.webui-popover.bottom-left > .arrow
{
    top: -9px; 
    left: 50%;

    margin-left: -9px;

    border-top-width: 0;
    border-bottom-color: #a8bbc2;
    border-bottom-color: rgba(204, 213, 219, .85);
}
.webui-popover.bottom > .arrow:after,
.webui-popover.bottom-right > .arrow:after,
.webui-popover.bottom-left > .arrow:after
{
    top: 1px;

    margin-left: -8px;

    content: ' ';

    border-top-width: 0;
    border-bottom-color: #fff;
}

.webui-popover.left > .arrow,
.webui-popover.left-top > .arrow,
.webui-popover.left-bottom > .arrow
{
    top: 50%;
    right: -9px;

    margin-top: -9px;

    border-right-width: 0;
    border-left-color: #a8bbc2;
    border-left-color: rgba(204, 213, 219, .85);
}
.webui-popover.left > .arrow:after,
.webui-popover.left-top > .arrow:after,
.webui-popover.left-bottom > .arrow:after
{
    right: 1px;
    bottom: -8px; 

    content: ' ';

    border-right-width: 0;
    border-left-color: #fff;
}

.webui-popover-backdrop
{
    position: fixed;
    z-index: 1799; 
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background-color: rgba(0, 0, 0, .65);
}

.webui-popover-primary .webui-popover-title
{
    color: #fff;
    border-color: #62a8ea; 
    background-color: #62a8ea;
}

.webui-popover-primary.bottom .arrow
{
    border-bottom-color: #62a8ea;
}
.webui-popover-primary.bottom .arrow:after
{
    border-bottom-color: #62a8ea;
}

.webui-popover-success .webui-popover-title
{
    color: #fff;
    border-color: #46be8a; 
    background-color: #46be8a;
}

.webui-popover-success.bottom .arrow
{
    border-bottom-color: #46be8a;
}
.webui-popover-success.bottom .arrow:after
{
    border-bottom-color: #46be8a;
}

.webui-popover-info .webui-popover-title
{
    color: #fff;
    border-color: #57c7d4; 
    background-color: #57c7d4;
}

.webui-popover-info.bottom .arrow
{
    border-bottom-color: #57c7d4;
}
.webui-popover-info.bottom .arrow:after
{
    border-bottom-color: #57c7d4;
}

.webui-popover-warning .webui-popover-title
{
    color: #fff;
    border-color: #f2a654; 
    background-color: #f2a654;
}

.webui-popover-warning.bottom .arrow
{
    border-bottom-color: #f2a654;
}
.webui-popover-warning.bottom .arrow:after
{
    border-bottom-color: #f2a654;
}

.webui-popover-danger .webui-popover-title
{
    color: #fff;
    border-color: #f96868; 
    background-color: #f96868;
}

.webui-popover-danger.bottom .arrow
{
    border-bottom-color: #f96868;
}
.webui-popover-danger.bottom .arrow:after
{
    border-bottom-color: #f96868;
}