.tipfy--wrap{position: absolute;z-index: 99;text-transform: none;color: #fff;font-size: 12px;}
.tipfy--main{position: relative;background-color: rgba(0,0,0,.9);padding: 10px;font-family: Arial, sans-serif;border-radius: 3px;max-width: 350px;}
.tipfy--main:before{content: '';position: absolute;border: 5px solid transparent;}
.tipfy--side-right{transform: translate(5px, -50%);}
.tipfy--side-right:before{border-right-color: rgba(0,0,0,.9);transform: translate(-10px,-50%);left: 0;top: 50%;}
.tipfy--side-left{transform: translate(-5px, -50%);}
.tipfy--side-left:before{border-left-color: rgba(0,0,0,.9);transform: translate(0px,-50%);left: 100%;top: 50%;}
.tipfy--side-bottom{transform: translate(0, 5px);}
.tipfy--side-bottom:before{border-bottom-color: rgba(0,0,0,.9);transform: translate(-50%,-10px);left: 50%;top: 0;}
.tipfy--side-top{transform: translate(0, -5px);}
.tipfy--side-top:before{border-top-color: rgba(0,0,0,.9);transform: translate(-50%,0px);left: 50%;top: 100%;}
@media (max-width: 768px){
  .tipfy--main{max-width: 300px;}
}