.nagy_teglalap{
width:1170px;
margin:auto auto;
height: 700px;
overflow:hidden
}

.bal {
float:left;
width:33%;
height:100%;
position:relative
}


.jobb {
float:left;
width:67%;
height:100%;
position:relative
}


.chatlista {
position:absolute;
top:100px;
right:0;
bottom:0;
left:0;
overflow: hidden;
border-right:1px solid #EDEEF2;
border-left:1px solid #EDEEF2;
border-top:1px solid #EDEEF2
}

.chatlista {
 overflow-y: scroll;
}



.admin {
text-align:center;
line-height: 5;
cursor: default;
color:#fff;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#817cce+0,817cce+50,817cce+51,7db9e8+100 */
background: #817cce; /* Old browsers */
background: -moz-linear-gradient(45deg,  #817cce 0%, #817cce 50%, #817cce 51%, #7db9e8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  #817cce 0%,#817cce 50%,#817cce 51%,#7db9e8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  #817cce 0%,#817cce 50%,#817cce 51%,#7db9e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#817cce', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}


.padding-right-5 {
    padding-right: 5px;
}
.cegnev {
    font-size: 14px;
    color: #504a4a;
	font-weight:600
}

.dot{
    display:inline-block;
    width:234px;
    white-space: nowrap;
    overflow:hidden !important;
    text-overflow: ellipsis;
	font-size:13px;
	color:#891727
}

.box {
    height: 100px;
	border-left: 1px solid #EDEEF2;
	border-right: 1px solid #EDEEF2;
	border-top: 1px solid #EDEEF2;
}

.container-1{
  width: 74%;
  margin: auto auto;
  vertical-align: middle;
  white-space: nowrap;
  position: relative;
}

.container-1 input#search {
    width: 100%;
    height: 50px;
	margin-top: 24px;
    background: #fbfbfb;
    border: 1px solid #EDEEF2;
    font-size: 10pt;
	outline:none;
    float: left;
    color: #63717f;
    padding-left: 45px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 3px;
}

.container-1 input#search::-webkit-input-placeholder {
   color: #d3d4d8;
}
 
.container-1 input#search:-moz-placeholder { /* Firefox 18- */
   color: #d3d4d8;  
}
 
.container-1 input#search::-moz-placeholder {  /* Firefox 19+ */
   color: #d3d4d8;  
}
 
.container-1 input#search:-ms-input-placeholder {  
   color: #d3d4d8;  
}

.container-1 .icon{
  position: absolute;
  top: 50%;
  margin-left: 17px;
  margin-top: 40px;
  z-index: 1;
  color: #d3d4d8;
}

.chatlista ul li, .kozep ul li {
height:79px
}

.chatlista ul li {
border-bottom:1px solid #EDEEF2;
}

.chatlista ul li:hover {
cursor:pointer;
background:#f5f5f5;
transition:0.5s
}

.padding-10 {
    padding: 17px;
    line-height: 4;
}


.fent {
position:absolute;
top:0;
left:0;
right:0;
height:100px;
border-bottom: 1px solid #EDEEF2;
border-top: 1px solid #EDEEF2;
border-right:1px solid #EDEEF2;
line-height:5;
}

.avatar {
    margin-top: -15px;
    margin-left: 25px;
    font-size: 26px;
    color: #b6bdc7;
}


.kuldte {
color:#B6BDC7;
font-size:17px;
margin-top: 8px;
margin-left: 9px;
}


.also {
position:absolute;
bottom:0;
left:0;
right:0;
height:75px;
background:#F8F8F8
}

.kozep {
position:absolute;
left:0;
top:100px;
right:0;
bottom:75px;
overflow:auto;
border-right: 1px solid #EDEEF2;;
}

ul {
list-style-type: none;
    margin: 0;
    padding: 0;
}

.aktiv {
background:#f5f5f5
}

.adattabla  {
border-collapse:collapse;
border-spacing:0;
word-wrap:break-word;
              table-layout: fixed;
}
.adattabla td{
overflow:hidden;
word-break:normal;
}

.felhasznalokep{
width:60px
}

.cegnev{
width:273px;
padding-left: 15px;
}

.datum span {
padding-top:15px
}

.padding-top-15 {
padding-top:22px
}

.datum{
    font-size: 12px;
    color: #ada7a7;
}

.margin-top-11 img{
margin-top:11px;
    width: 52%;
}

.float{
float:left
}

.padding-top-bottom-5 {
padding:5px 0px 0px 30px
}

.chatlista ul {
width:100%
}

.center {
text-align:center
}

.chatlista table {
width:100%
}

.online {
display: inline-block;
width:7px;
height:7px;
border-radius:50%;
background:#55CC0E;
}

.offline {
display: inline-block;
width:7px;
height:7px;
border-radius:50%;
background:lightgrey;
}

.padding-right-5 {
padding-right:5px
}

.margin-top-10 {
margin-top:10px
}

.label {
    border-radius: 50%;
    width: 8px;
    height: 8px;
    padding: 4px;
    background: #891727;
    color: #fff;
    text-align: center;
    font-size: 9px;
    line-height: 0.9;
    margin: auto auto;
	margin-top: 5px;
	font-weight: bold;
	-webkit-box-shadow: 1px 2px 5px 0px rgba(148,145,148,1);
-moz-box-shadow: 1px 2px 5px 0px rgba(148,145,148,1);
box-shadow: 1px 2px 5px 0px rgba(148,145,148,1);
}

/* Let's get this party started */
.chatlista::-webkit-scrollbar, .kozep::-webkit-scrollbar {
    width: 9px;
}
 
/* Track */
.chatlista::-webkit-scrollbar-track,.kozep::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
.chatlista::-webkit-scrollbar-thumb, .kozep::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(153,153,153,1); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
.chatlista::-webkit-scrollbar-thumb:window-inactive, .chatlista::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(255,0,0,0.4);
}


.szelesseg {
    width: 90%;
    margin: auto auto;
}

.to {
float:right
}

/** bubble **/

.kozep .szelesseg .from p {
    background:#EAEDF4;
    padding:20px;
    margin:20px;
    position:relative;
    border-radius:5px;
	color:#6b6b6b;
}
.kozep .from p:nth-of-type(odd):after {
    border-top:20px solid transparent;
    border-bottom: 20px solid transparent;
    border-right: 20px solid #EAEDF4;
    border-left:none;
    right:auto;
    left:-7px;
}
.kozep .from p:after {
    content: "";
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid #EAEDF4;
    right: -20px;
    position: absolute;
    top: 5px;
}


.to p {
    background:#817CCE; 
    padding:20px; 
    margin:20px; 
    position:relative;
    border-radius:5px;
	color:#fff;
	    text-align: right;
}
.to p:after {
    content:""; 
    width:0; 
    height:0; 
    border-top:20px solid transparent; 
    border-bottom: 20px solid transparent; 
    border-left: 20px solid #817CCE; 
    right:-7px; 
    position: absolute; 
    top:10px;
}

.from .latta{
position:absolute;
left:0px;
top:60px;
font-size:11px
}

.from .latta i, .to .latta{
color:#3d6f3d;
}

.from p, .to p {
font-size:14px
}

.to .latta {
    position: absolute;
    right: 3px;
    bottom: -14px;
    font-size: 11px;
    color: #6b6b6b;
}

.margin-left-15 {
margin-left:15px
}

.befoglalo {
width:90%;
background:#fff;
margin:auto auto;
margin-top:15px;
height:40px;
border:1px solid #a9a9ab;
}

.befoglalo input {
padding: 0px 6px;
width:80%;
outline:none;
border:none;
height:38.5px
}

.befoglalo input:hover {
box-shadow:none
}

.egyeb {
    float: right;
    font-size: 19px;
    padding: 9px 11px;
	color: #797272;
}

.element {
  display: inline-flex;
  align-items: center;
  color: #c1c3c7;
}

.element input {
  display: none;
}

.element i {
cursor:pointer;
font-weight:bold
}