.speech-bubble {
  position: relative;
  margin-left: 10px; }

.speech-bubble:after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-color: transparent #f8f9fa transparent transparent;
  border-left: 0;
  margin-top: -7px;
  margin-left: -8px;
  z-index: 999; }

.speech-bubble.btn-primary:after {
  border-color: transparent #007bff transparent transparent; }

.speech-bubble.btn-secondary:after {
  border-color: transparent #6c757d transparent transparent; }

.speech-bubble.btn-success:after {
  border-color: transparent #28a745 transparent transparent; }

.speech-bubble.btn-info:after {
  border-color: transparent #17a2b8 transparent transparent; }

.speech-bubble.btn-warning:after {
  border-color: transparent #ffc107 transparent transparent; }

.speech-bubble.btn-danger:after {
  border-color: transparent #dc3545 transparent transparent; }

.speech-bubble.btn-light:after {
  border-color: transparent #f8f9fa transparent transparent; }

.speech-bubble.btn-dark:after {
  border-color: transparent #343a40 transparent transparent; }