#flyout-chat {
      width: 100%;
    height: 100%;
    display: inline-block;
    position: fixed;
    top: 74px;
    left: 1px;
    background: white;
    /*padding: 0 10px 0 10px;*/
    border-top: 1px solid gray;
    border-left: 1px solid black;
    overflow: hidden;
  }



  @media all and (min-width:550px) {
	#flyout-chat {
		max-width: 450px;
		min-width: 450px;
		float: right;
		border-right: 1px solid black;
		left: 0px;
		right: unset;
		top: 94px;
		box-shadow: black 4px 9px 24px 0px;
	}

	.chatFilterDiv {
		width: 75%;
		height: 100%;
	}
  }

  .message-input-holder {
	  padding: 10px 28px;
	 background:#ea2300;
  }

  .message-content-row {
	  padding-left:29px;
  }

.container-fluid {
	height:100%;
	/*height:128%;*/
}

.container-fluid .row:first-child {
	position:relative;
}

.message-info-row div p {
	font-weight:bold;
	color:red;
}

.own-message {
	
}

.own-message .message-info-row div p {
	color:blue;
}

#chat-window {
	/*height: -webkit-fill-available;*/
	
	height:100%;
	overflow-y: auto;
	padding-bottom: 80px;

}
#container {
	height:100%;
  /*height: 100%;*/
  /*overflow-x:hidden;
  overflow-y:hidden;*/
  position:relative;
}

#container #input-div {
	overflow:hidden;
}
#header {
  margin: auto;
}
#input-div {
  background-color: #ea2300;
  color:white;
  height: 40px;
}
#typing-row {
	height: 20px;
	font-weight: lighter;
	font-size: small;
	color: #BBA0A1;
	vertical-align: bottom;
	bottom: 60px;
	position: absolute;
	width: 100%;
	/* top: 105px; */
	z-index: 10;
}
#typing-placeholder {
  height: 100%;
  padding-left: 10px;
}
#message-list {
  overflow-y: auto;
  height:100%;
  /*overflow-y:hidden;*/
}
	#message-list.connected {
		/*padding-bottom:300px;*/
		padding-bottom: 200px;
	}
#message-list.disconnected {
  height: 80%;
}
#connect-panel {
  height: 20px;
  background-color: #5B1913;
  text-align: center;
  color: #DEC4C3;
}
#connect-panel.connected, #typing-row.disconnected {
  display: none;
}
#connect-panel.disconnected, #typing-row.disconnected {
  display: block;
}
#username-input {
  width: 70%;
  padding-left: 10px;
  height:20px;
  margin-left: 10px;
  margin-top: 10px;
  color: black;
}
#input-text {
	overflow-y:hidden;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 12px;
  height: 100%;
  min-height:unset;
  width: 100%;
  line-height:15px;
  border-radius:5px;
  color: #644F52;
  font-weight: 300;
  border: 0;
  resize: none;
}
.with-shadow {
  -webkit-box-shadow: -5px 5px 0px 0px rgba(0,0,0,0.53);
  -moz-box-shadow: -5px 5px 0px 0px rgba(0,0,0,0.53);
  box-shadow: -5px 5px 0px 0px rgba(0,0,0,0.53);
}
#channel-panel {
 
  box-shadow: -1px 0px 0px 0px #5D1E18;
}
#channel-list {
  overflow-y: scroll;
  overflow-x: hidden;
}
#channel-list.showing {
  max-height: 75vh;
}
#channel-list.not-showing {
  max-height: 250px;
}
#new-channel-input {
  background-color: #F8E6E4;
  color: #B0ADAE;
  border: 0;
  resize: none;
  height: 5vh;
}
#new-channel-input-row.not-showing {
  display: none;
}
#new-channel-input-row.showing {
  display: block;
}

.message-info-row {
  padding-top: 5px;
  padding-bottom: 5px;
}
.message-body {
  word-break: break-all;
  text-align: justify;
  text-justify: inter-word;
  font-size: small;
  font-weight: 300;
  color: #644F52;
  padding-left:15px;
}
.message-username {
  margin-left: 5px;
  margin-bottom: 1px;
  font-size: normal;
  font-weight: 400;
  color: #5C5153;
}
.message-date {
  margin-right: 15px;
  margin-bottom: 5px;
  font-weight: lighter;
  font-size: normal;
  color: black;
}
.no-margin {
  margin: 10px;
}

#message {
	border-top: 1px solid gray;
	border-bottom: 1px solid gray;
}

#username-inner {
	display:inline-block;
	float:left;
}

#add-channel-image {
  padding-left: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  height: 20px;
  cursor: pointer;
}
.channel-element {
  width: 100%;
  height: 40px;
  margin: 0;
  padding-left: 20px;
  line-height: 6vh;
  overflow: hidden;
  font-size: large;
}
.unselected-channel {
  color: #D47567;
}
.unselected-channel:hover {
  background-color: #F8E6E4;
  color: #753A35;
  cursor: pointer;
}
.selected-channel {
  background-color: #F8E6E4;
  color: #753A35;
}
#logo-image {
  height: 10px;
  margin-top: 2px;
  margin-bottom: 2px;
}
#logo-column {
  text-align: center;
}
.right-align {
  text-align: right;
  padding: 0;
}
.left-align {
  text-align: left;
  padding: 0;
}
#status-span {
  color: #EE887C;
}
#leave-span {
  cursor: pointer;
  color: #370606;
  margin-left: 1vh;
}
#delete-channel-span {
  cursor: pointer;
  color: #370606;
}
#status-row {
	margin-top:0px;
	
  margin-bottom: 0px;
  background:#ea2300;
}
#status-row.connected {
  visibility: visible;
}
#status-row.disconnected {
  visibility: hidden;
}
#connect-image {
  height: 25px;
  margin-top: 5px;
  cursor: pointer;
}
.member-status {
  padding: 5px;
  font-weight: 300;
  color: #C0A5A7;
  text-align: center;
  border-top: 1px solid #BCA1A3;
  border-bottom: 1px solid #BCA1A3;
}