body{
    background-image: url('img.jpg');
}
.bot{
    display: block;
    padding: 5px 5px;
    max-width: 60%;
    height: 50%;
    margin: 10% auto;
    background: white;
    box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.2);
    overflow-x: scroll;
    border-top-left-radius: 10px ;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
  

}
.header{
    background-color: #9921e8;
background-image: linear-gradient(315deg, #d1d4df  0%,#9921e8 74%);
   
    height:4rem;
    border-top-left-radius: 10px ;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    display: block;
    border: 0;
    margin-bottom: 20px;
  
}

.img{
    height:50px;;
    width:50px;
    padding:2px 2px;
    border-radius:40px;
    margin: 3px 3px;

} 
.msg {
    padding: 10px 10px;
	display: flex;
	justify-content: flex-end;
	flex-direction: column;
	align-self: flex-end;
    margin-bottom: 70px;
  
    
  }
.msg-info{

align-self: flex-start;
   background-color: #9921e8;
   color: white;
   height: 20px;
   max-width: 200px;
   border-radius: 10px;
   padding: 20px 10px;
   margin:10px 10px;
   position: relative;
   align-items: center;
   
}
 
.msg-info-right{
    align-self: flex-end;
    background-color: #c5bbdd;
    color: white;
    height: 20px;
    max-width: 200px;
    border-radius: 10px;
    padding: 20px 10px;
    margin:10px 10px;
    
    position: relative;
    align-items: center;
  

 }
 .btn_img{
     width: 60px;
     height: 60px;
     border-radius: 30px;
    background-color: transparent;
     
 }
 #button{
    border-radius: 40px;
    background-color: rgb(102, 86, 175);
    
    right: 50px;
   
    cursor: pointer;
 }