.myfade 
	{
		-webkit-animation-name: myfade;
		animation-name: myfade;
		-webkit-animation-duration: 2s;
		animation-duration: 2s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}
	@-webkit-keyframes myfade 
	{
		0% {opacity: 0;}
		100% {opacity: 1;}
	}
	@keyframes myfade 
	{
		0% {opacity: 0;}
		100% {opacity: 1;}
	} 	
	
	/* .typed-cursor {display:none!important} */

	.chat-bubble {
		background-color:#D2D6DE;
		padding:8px 18px;
	-webkit-border-radius: 20px;
  -webkit-border-bottom-left-radius: 2px;
  -moz-border-radius: 20px;
  -moz-border-radius-bottomleft: 2px;
  border-radius: 20px;
  border-bottom-left-radius: 2px;
  display:inline-block;
}
.typing {
  align-items: center;
  display: flex;
  height: 17px;
}
.typing .dot {
  animation: mercuryTypingAnimation 1.8s infinite ease-in-out;
  background-color: rgb(68, 68, 68) ; //rgba(20,105,69,.7);
  border-radius: 50%;
  height: 7px;
  margin-right: 4px;
  vertical-align: middle;
  width: 7px;
  display: inline-block;
}
.typing .dot:nth-child(1) {
  animation-delay: 200ms;
}
.typing .dot:nth-child(2) {
  animation-delay: 300ms;
}
.typing .dot:nth-child(3) {
  animation-delay: 400ms;
}
.typing .dot:last-child {
  margin-right: 0;
}

@keyframes mercuryTypingAnimation {
  0% {
    transform: translateY(0px);
    background-color:rgb(68, 68, 68) // rgba(20,105,69,.7);
  }
  28% {
    transform: translateY(-7px);
    background-color:rgba(68, 68, 68, .4) //rgba(20,105,69,.4);
  }
  44% {
    transform: translateY(0px);
    background-color: rgba(68, 68, 68, .2); //rgba(20,105,69,.2);
  }
}