body {
  background:#000;
  -webkit-transition: background-color 2s;
  transition: background-color 2s;
  padding:20px;
  text-align:center;
}

.bubble 
{
position: relative;
margin:20px auto;
width: 250px;
height: 120px;
padding: 0px;
background: rgba(0,0,0,0);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border:5px solid #FFF;
box-shadow:5px 5px 10px -8px #000, inset 5px 5px 10px -8px #000;
line-height:120px;
font-size:70px;
-webkit-transition: color 2s;
transition: color 2s;
color:#FFF;
font-family: Arial, sans-serif;
}

.bubble:after 
{
content: '';
position: absolute;
width: 0; 
height: 0; 
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-top: 25px solid #FFF;
z-index: 1;
bottom: -25px;
left: 100px;  
}
.bubble:before 
{
content: '';
position: absolute;
width: 0; 
height: 0; 
border-left: 18px solid transparent;
border-right: 18px solid transparent;
border-top: 18px solid #000;
 -webkit-transition: border-color 2s;
transition: border-color 2s;
z-index: 2;
bottom: -18px;
left: 107px;
box-shadow:5px 5px 10px -8px #000;
}