.tooltip {
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    position:absolute;
    bottom:80%;
    right:-0.3333333333em;
    width:180px;
    margin:0 0 5px 0;
    padding:0.75em 1em;
    border-radius:4px;
    white-space:normal;
    font-size:0.8571428571em;
    font-style:normal;
    text-align:center;
    color:#fff;
    display:block;
    z-index:200;
    -webkit-transition:all 0.3s cubic-bezier(0.3, 0, 0, 1);
    transition:all 0.3s cubic-bezier(0.3, 0, 0, 1);
    -webkit-transform:rotateX(20deg) scale(0.8);
    transform:rotateX(20deg) scale(0.8);
    -webkit-transform-origin:90% 120%;
    transform-origin:90% 120%;
    -webkit-backface-visibility:hidden;
    background-color:rgba(51,51,51,0.9);
    visibility:hidden;
    opacity:0
}
.tooltip:after {
    content:"";
    position:absolute;
    top:100%;
    right:18px;
    width:0;
    border:6px solid transparent;
    border-top-color:rgba(51,51,51,0.9)
}
@media (min-width: 750px) {
    .tooltip {
        -webkit-transform-origin:center 120%;
        transform-origin:center 120%;
        right:50%;
        margin-right:-90px
    }
    .tooltip:after {
        right:50%;
        margin-right:-6px
    }
}
.has-tooltip {
    cursor:pointer
}
.tooltip-container {
    position:relative;
    height:100%;
    width:100%
}
.tooltip-container .tooltip-control {
    position:absolute;
    height:100%;
    width:100%
}
.tooltip-container.show-tooltip .tooltip,
.tooltip-container:hover .tooltip,
.tooltip-container:focus .tooltip,
.has-tooltip.show-tooltip .tooltip,
.has-tooltip:hover .tooltip,
.has-tooltip:focus .tooltip {
    -webkit-transform:rotateX(0deg) scale(1);
    transform:rotateX(0deg) scale(1);
    pointer-events:auto;
    visibility:visible;
    opacity:1
}
.tooltip--right-align {
    right:-130px;
    bottom:108%
}
.tooltip--right-align:after {
    right:130px
}
@media (min-width: 750px) {
    .tooltip--right-align {
        -webkit-transform-origin:center 120%;
        transform-origin:center 120%;
        right:50%;
        margin-right:-90px
    }
    .tooltip--right-align:after {
        right:50%;
        margin-right:-6px
    }
}