.red-pill, .blue-pill {

position: fixed;
right: 16px;
bottom: 16px;
max-width: 280px;
text-align: center;
padding: 12px 16px;
border-radius: 3px 3px 0 3px;
color: #fff;
display: none;
&:after {
  position: absolute;
  content: '';
  right: -12px;
  bottom: 0;
  width: 12px;
  height: 12px;
  box-sizing: border-box;
  border-right: 6px solid rgba(0,0,0,0);
  border-top: 6px solid rgba(0,0,0,0);
  border-left: 6px solid #2756db;
  border-bottom: 6px solid #2756db;
}
&.active {
  display: block;
}

} .blue-pill {

background-color: #2756db;
color: #fff;

} .red-pill {

background-color: #db3727;
color: #fff;
&:after {
  border-left: 6px solid #db3727;
  border-bottom: 6px solid #db3727;
}

}