@charset "windows-1251";
/* CSS Document */

.chat{ margin-top:-28px; position:relative; font-family:fontface; color:#fff; }

@font-face {
  font-family: "icomoon";
  font-style: normal;
  font-weight: normal;
  src: url("fonts/icomoon.eot?#iefix") format("embedded-opentype"), url("fonts/icomoon.woff?ver=1212") format("woff"), url("fonts/icomoon.ttf?21312") format("truetype"), url("fonts/icomoon.svg#icomoon") format("svg");
}


.chat a{color:#ccc;}
.chat a:hover{color:#fff;}


.chat .smiles{ padding:10px; padding-right:0px; z-index:1000; background:#444; width:350px; height:420px; overflow:hidden; position:absolute; display:none;}
.chat .smiles .foto{ display: inline-block;  width:40px; height:40px;   cursor:pointer ;text-align:center; position:relative; }
.chat .smiles .foto  img{max-width:40px; max-height:40px;}
.chat .smiles .close{display:block; position:absolute; top:5px; right:5px;}

.chat .inner{height:420px; overflow:hidden; padding:0 10px; background:#333;}

.chat .item { 
    position: relative; overflow:hidden;
    display: block;
    padding: 10px 11px 14px 0px;
    border-top: solid 1px #434343;
    border-bottom: solid 1px #242424;
}

.chat #items .item { min-height:75px;}

.chat .menu{ position:absolute; width:150px; z-index:1000;  background:rgba(0,0,0,0.7); }
.chat .menu a{ display:block; padding:5px 10px; font-size:16px; line-height:16px;}
.chat .menu a:hover{ background:rgba(55,55,55,0.7); color:#fff; text-decoration:none; }

.chat .menu .srok{position:absolute; width:120px;  left:150px; top:0; z-index:1000;  background:rgba(0,0,0,0.7);}


.chat .item:first-child { border-top: none;}

.chat .item:last-child { border-bottom: none;}

.chat .item:hover {background: #434343;}

.chat .item .foto {float:left; width:50px; height:50px; overflow:hidden; cursor:pointer; margin-right:10px; }

.chat .item .foto img{ max-width:50px; max-height:50px;}

.chat .item .info { margin-left:60px;}

.chat .item .name { padding-right:10px;
    max-width: 70px;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-decoration: underline;
    color: #5aa1ff; cursor:pointer;
}

/*
.chat .item:nth-child(even) .name{ color:#5aa1ff;}
*/

.chat .item.my { color:#D19F63 !important;}
.chat .item.moderator .name{ color:#3EC423 !important;}
.chat .item.supermoderator .name{ color:#ff6161 !important;}

.chat .item.system, .chat .item.system .name { color:#ff6161 !important;}

.chat .item .coins {
    background: url("/templates/images/coin.png") 0 50% no-repeat;
    background-size: contain;
    padding-left: 22px; padding-right:10px;
}

.chat .item .write {
    text-decoration: underline;
    color: rgba(150,150,150,0.65);
    cursor: pointer; display:none;
}

.chat .item:hover .write{display: inline-block;}
.chat .item .time {float: right;color: #b2b2b2;}
.chat .item .message {}
.chat .item .message img{ margin:0 5px; vertical-align:middle;}

.chat .users_info{padding-bottom:5px;  text-transform: uppercase; font-size: 18px; position:relative;}
	
.chat .users_info > div {display: inline-block;}

.chat .users_info .count_users {text-decoration: underline;color: #f3c649;}

.chat .users_info .count_guests {color: #f3c649;}

.chat .users_info .show, .chat .users_inf .hide {
    background: url("/images/user.png") 100% 50% no-repeat;
    padding-right: 15px;
    font-size: 14px!important;
    cursor: pointer;
}

.chat .users_info .show { color: #f3c649;}

.chat .users_info .open{ position:absolute; right:0px; top:0px; font-size:11px; cursor:pointer; font-family: "icomoon"; display:block; padding:5px; color:#fff; font-size:16px; z-index:1000; text-decoration:none;}
.chat .users_info .open:hover{ background:#060; color:#fff;}

.chat  .writer {
    background: #434343;
    height: 47px;
    border-top: solid 1px #242424; position:relative; margin-bottom:5px;
}

.chat  .writer > input {
    color: #777;
    padding: 10px;
    background: #434343;
    border: 0;
    height: 100%;
    width: 100%; padding-right:40px;
}

.chat  .writer > input:focus {
    color: #fff;
}

.chat  .writer  .get_smile { display: block; position:absolute; right:10px; top:10px; width:18px; height:18px;
 background:url(/images/smile.png) center center no-repeat; cursor: pointer;
}
.chat  .writer  .get_smile:hover{ background:url(/images/smile_white.png) center center no-repeat;}

.chat .button{ display:block; float:right; text-transform:uppercase; color:#333; text-decoration:none; cursor:pointer;
background:url(/images/button_green.png);  height:29px; line-height:29px; border-radius:2px; padding:0 10px; font-size:16px; min-width:40px; text-align:center; }
.chat .button:hover{color:#fff; }

.chat .button.streamer{ float:left;}

.chat .online{ display:none; background:#444; padding:10px; position:absolute; width:100%; left:0; top:28px; z-index:1000;}
.chat .online .item{padding:2px 0; border:none; display:inline-block; margin-right:5px;}



.chat.index{ margin-top:0px; color:#fff; background:#333; padding-bottom:10px; margin-bottom:20px;  }
.chat.index .smiles{ width:300px;}
.chat.index .users_info{padding-left:10px; padding-top:3px; font-size:14px; padding-bottom:3px;}
.chat.index .button{float:none;  margin: 10px; margin-bottom:0; }

.chat.window{ margin-top:0px; color:#fff; background:#333; padding-bottom:10px; margin-bottom:20px;  }
.chat.window .smiles{ width:350px;}
.chat.window .users_info{padding-left:10px; padding-top:3px; position:relative;}
.chat.window .button{float:none;  margin: 10px; margin-bottom:0; }