.bubble{
	border-radius: 5px;
	box-shadow: 0 0 6px #B2B2B2;
	display: inline-block;
	padding: 10px 18px;
	position: relative;
	vertical-align: top;
	min-width: 55%;
	
}

.bubble::before {
	content: "\00a0";
	display: block;
	height: 16px;
	position: absolute;
	top: 11px;
	transform:             rotate( 29deg ) skew( -35deg );
	-moz-transform:    rotate( 29deg ) skew( -35deg );
	-ms-transform:     rotate( 29deg ) skew( -35deg );
	-o-transform:      rotate( 29deg ) skew( -35deg );
	-webkit-transform: rotate( 29deg ) skew( -35deg );
	width:  20px;
}

.me {
	background-color: #F2F2F2;
	float: left;   
	margin: 5px 45px 5px 20px;         
}

.me::before {
	background-color: #F2F2F2;
	box-shadow: -2px 2px 2px 0 rgba( 178, 178, 178, .4 );
	left: -9px;           
}

.you {
	background-color: #CCCCCC;
	float: right;    
	margin: 5px 20px 5px 45px; 
	text-align: right;
}

.you::before {
	background-color: #CCCCCC;
	box-shadow: 2px -2px 2px 0 rgba( 178, 178, 178, .4 );
	right: -9px;    
}

.vivi-info-fixed { 
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 10%;
	padding: 0px;
	border: none;
	z-index: 99;
	-webkit-transform: translate3d(0,0,0);
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
	text-align: center;
}