button.bubble, 
a.bubble {
  background: #fdad20;
 -moz-border-radius: 15px; 
 -webkit-border-radius: 15px;
  border-radius: 15px;
  border: 3px solid #f47b20;
  color: #FFF !important;
  text-shadow: 0px 2px 2px rgba(0,0,0,0.3);
 -webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
 -moz-box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
  box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
  font-size: 18px;
  cursor: pointer;
 -moz-box-sizing: padding-box;
  padding: 5px 8px;
  position: relative;
  /*font-family: 'ArialRoundedMTBoldRegular' !important;*/
}

button.bubble:hover, 
a.bubble:hover {
   background: #ffb83a
  /*text-decoration: underline;
  color: #fff;*/
}

button.bubble span,
a.bubble span {
    text-shadow: none;
}

button.bubble .tail,
a.bubble .tail {
  position: absolute;
  bottom: -14px;
  right: 13px;
  height: 11px;
  width: 24px;
 -moz-border-radius-bottomright:  21px 11px; 
 -webkit-border-bottom-right-radius: 21px 11px;
  border-bottom-right-radius: 21px 11px;
 -webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
 -moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
  box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
  background: #ec771d; /* old browsers */
  background: -moz-linear-gradient(top, #ec771d 1%, #D2691A 100%); /* firefox */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ec771d), color-stop(100%,#D2691A)); /* webkit */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec771d', endColorstr='#D2691A',GradientType=0 ); /* ie */
}

button.bubble .tail,  x:-moz-any-link { 
  /*bottom: -20px;*/
  right: 20px;
}

/* this is the inner curve of the tail */
button.bubble .tail div,
a.bubble .tail div {
  height: 11px;
  width: 7px;
  position: absolute;
  bottom: 0;
 -moz-border-radius-bottomright: 9px 13px; 
 -webkit-border-bottom-right-radius: 9px 13px;
  border-bottom-right-radius: 9px 13px;
 -moz-box-shadow: -3px 2px 5px rgba(0,0,0,0.4) inset;
 -webkit-box-shadow: -3px 2px 5px rgba(0,0,0,0.4) inset;
  box-shadow: -3px 2px 5px rgba(0,0,0,0.4) inset;
}

/* 
make the background color the same as the parent
to create the illusion of a speech bubble tail

default is white
*/
button.bubble .tail div, a.bubble .tail div {background: #FFF;}
.site_modal button.bubble .tail div, .site_modal a.bubble .tail div {background: #494949;}
.tab_body button.bubble .tail div, .tab_body a.bubble .tail div {background: #dcdcdc;}



button.fbbubble, 
a.fbbubble {
  background: #4267b2 ;
 -moz-border-radius: 15px; 
 -webkit-border-radius: 15px;
  border-radius: 15px;
  border: 3px solid #4267b2;
  color: #FFF !important;
 -webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.4), 0px 2px 5px rgba(252,221,167,0.8) inset;
 -moz-box-shadow: 0px 2px 5px rgba(0,0,0,0.4),  0px 2px 5px rgba(252,221,167,0.8) inset;
  box-shadow: 0px 2px 5px rgba(0,0,0,0.4),  0px 2px 5px rgba(252,221,167,0.8) inset;
  font-size: 18px;
  cursor: pointer;
 -moz-box-sizing: padding-box;
  padding: 5px 8px;
  position: relative;
  font-family: 'ArialRoundedMTBoldRegular' !important;
  font-weight:bold;
}

button.fbbubble .tail,
a.fbbubble .tail {
  position: absolute;
  bottom: -14px;
  right: 13px;
  height: 11px;
  width: 24px;
 -moz-border-radius-bottomright:  21px 11px; 
 -webkit-border-bottom-right-radius: 21px 11px;
  border-bottom-right-radius: 21px 11px;
 -webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
 -moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
  box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
  background: #4267b2; /* old browsers */
  background: -moz-linear-gradient(top, #4267b2 1%, #4267b2 100%); /* firefox */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#4267b2), color-stop(100%,#4267b2)); /* webkit */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec771d', endColorstr='#D2691A',GradientType=0 ); /* ie */
}


button.fbbubble .tail,  x:-moz-any-link { 
  /*bottom: -20px;*/
  right: 20px;
}

/* this is the inner curve of the tail */
button.fbbubble .tail div,
a.fbbubble .tail div {
  height: 11px;
  width: 7px;
  position: absolute;
  bottom: 0;
 -moz-border-radius-bottomright: 9px 13px; 
 -webkit-border-bottom-right-radius: 9px 13px;
  border-bottom-right-radius: 9px 13px;
 -moz-box-shadow: -3px 2px 5px rgba(0,0,0,0.4) inset;
 -webkit-box-shadow: -3px 2px 5px rgba(0,0,0,0.4) inset;
  box-shadow: -3px 2px 5px rgba(0,0,0,0.4) inset;
}

/* 
make the background color the same as the parent
to create the illusion of a speech bubble tail

default is white
*/
button.fbbubble .tail div, a.fbbubble .tail div {background: #FFF;}
.site_modal button.fbbubble .tail div, .site_modal a.bubble .tail div {background: #494949;}
.tab_body button.fbbubble .tail div, .tab_body a.bubble .tail div {background: #dcdcdc;}