/* ::::::::::::::::::::::::::::::::: */
*{ 
	margin:0; 
	padding:0; 
}
body{
	height:100vh;
	display: grid;
	grid-template-rows:auto 45px;
	font-family:'Poppins';
}
/* ::::::::::::::::::::::::::::::::: */
#chat{
	background-color:#3A8891;
	padding:20px;
    overflow-y: auto;
	overflow-x: hidden;
}
#chat > div {
	width:100%;
	min-height:30px;
	height:auto;
	padding-bottom:10px;
}
.bot_message{
	display: table;
	margin:5px;
	padding: 5px;
	/* font-family: 'Comic Neue', cursive; */
	background-color:white;
	border-radius:6px;
}
.bruker_message{
	display: table;
	margin:5px;
	padding: 5px;
	font-family: 'Comic Neue', cursive;
	background-color:white;
	border-radius:6px;
	transform: translate(-100%, 0%);
	position:relative;
	left:96%;
}
/* ::::::::::::::::::::::::::::::::: */
#bottom_bar{ 
	display:flex; 
	/* box-shadow: 0px -2px 1px lightblue; */
}
/* ::::::::::::::::::::::::::::::::: */
#inp{
	border:none;
	background-color:white;
	width:80%;
	padding-left: 10px;
}
#inp:focus { 
	outline: none; 
}
/* ::::::::::::::::::::::::::::::::: */
#mic_div{
	background-color:#0E5E6F;
	height:45px;
	width:50px;
	position:absolute;
	right:50px;
	bottom:0px;
	border-right: 2px solid white;
}
#mic{
	width:25px;
	position: relative;
	transform: translate(-50%, -50%);
	left:49%;
	top:50%;
	transition: all 0.9s linear 0s;
	opacity:0.9;
	cursor:pointer;
	border-radius:50%;
	padding:5px;
}
#mic:hover{
	background-color:#FF7F50;
}
/* ::::::::::::::::::::::::::::::::: */
#send_btn{
	background-color:#0E5E6F;
	height:45px;
	width:50px;
	position:absolute;
	right:0px;
	bottom:0px;
}
#send{
	width:25px;
	position: relative;
	transform: translate(-50%, -50%);
	left:49%;
	top:50%;
	transition: all 0.9s ease 0s;
	opacity:0.9;
	cursor:pointer;
}
#send:hover{ 
	opacity:1; 
	translate: 5px; 
}
/* ::::::::::::::::::::::::::::::::: */