// CHANGE :: add styling for the chat box
#user-chat-box{
    position: fixed;
    bottom: 10px;
    right: 10px;
    border: 1px dashed grey;
    height: 350px;
	width: 300px;
	background: white;
	padding: 5px;
	box-shadow: 1px 1px 1px 1px lightgrey;

    #chat-messages-list{
    	list-style: none;
	    padding: 10px;
	    height: 70%;
	    background-color: white;
	    overflow: auto;

	    .other-message{
		    text-align: left;
		    padding: 5px;
		    span{
		    	display: inline-block;
	    		padding: 15px;
		    	background-color: #ffa0a0;
		    }
		    
	    }

	    .self-message{
		    text-align: right;
		    padding: 5px;
		   
		    span{
		    	 
	    		display: inline-block;
	    		padding: 15px;
    			background-color: #a0dcff;
		    }
		   
	    }

    }
    #chat-message-input-container{
    	    height: 24%;
		    width: 100%;
		    display: flex;
		    flex-direction: row;

		    #chat-message-input{
	    	    height: 50%;
    			width: 70%;
		    }

		    #send-message{
	    	    height: 50%;
			    width: 30%;
			    font-size: 25px;
			    color: white;
			    border: none;
			    background: #58d258;
		    }
	    }
}
