﻿input[type=number] {
	width: 30px;
	padding: 5px!important;
	background: transparent;
	vertical-align: middle;
}

.chat_page {
	font: 15px Roboto, Sans-Serif;
	border: 1px solid #ccc;
	box-shadow: 0 0 3px #ccc;
}

.chat_page a {
	text-decoration: none;
	cursor: pointer;
	color: #2980B9;
}

.chat_page p {
	margin: 0;
}

.chat_page a:hover {
	color: #E74C3C;
}

.chat_page img {
	vertical-align: middle;
}

.chat_page .left {
	float: left;
}

.chat_page .right {
	float: right;
}

.chat_page .rc_title {
	height: 60px;
	line-height: 60px;
	font-size: 24px;
	padding-left: 20px;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
	background-color: #eee;
	color: #444;
}

.rc_title .buttons {
	padding: 10px;
	float: right;
}

.rc_title .buttons button {
	margin-left: 15px;
	border-radius: 100%;
	opacity: .6;
	height: 40px;
	width: 40px;
}

.rc_title .buttons button:active, .rc_title .buttons button.active  {
	background-color: rgba(0, 0, 0, 0.1);
}

.admod_menu {
	z-index: 4;
	display: none;
	position: absolute;
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26),0 2px 10px 0 rgba(0, 0, 0, 0.16);
	background: white;
	max-width: 240px;
	border-radius: 3px;
	padding: 9px 0;
}

.admod_menu a {
	color: #444;
	font-size: 14.5px;
	height: 40px;
	padding: 0 24px;
	line-height: 40px;
	display: block;
	cursor: pointer;
}

.admod_menu a:hover {
	background-color: #F4F4F5;
	color: #444;
}

.chat_box {
	background-image: url('../images/chat/bg.jpg');
	background-color: #e0dad6;
	background-size: cover;
	background-position: center center;
	position: relative;
}

.chat_msgs {
	position: relative;
	height: 600px;
	overflow-y: auto;
	padding: 15px 0;
}

.chat_page *::-webkit-scrollbar  {
	width: 6px;
	border: none;
}

.chat_page *::-webkit-scrollbar-track  {
	background: transparent;
}

.chat_page *::-webkit-scrollbar-thumb  {
	background: #aea8a6;
}

.chat_msgs ul li {
	display: block;
	overflow: hidden;
	padding: 2px 20px;
	margin-bottom: 5px;
}

.chat_msgs ul li #bubble {
	position: relative;
	border-radius: 7.5px;
	background: white;
	max-width: 470px;
	padding: 8px 7px 8px 9px;
	box-shadow: 0 1px .5px rgba(0,0,0,.13);
	display: block;
	float: left;
}

.chat_msgs ul li #bubble:before {
	content: '';
	position: absolute;
	left: -11px;
	bottom: 3px;
	width: 12px;
	height: 19px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAmCAYAAADeB1slAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAZZJREFUeNq0l79Kw1AUh3tjSTRa0CWD+GcQBHUsDj6ALpLJuZBBcMjq6ib4CA4OggpuGXwIH0CIwS7aQRyl4JCmaY6/QCIxxqZN7vngkBBy73eTc3PviSCiRooQoiELSjpWGsywCDB4jVUAdG5Bi1sw4Bbw5iAIgnlWgaIoa9yCTe4cbGc/ip+QRRRFz5QgXYB+ViiD9FeE0R/mjVKfAILH7BNIFaCPXcohVYDRP7AJ0P6ACpAiQNsW4pVFgHYCcU//IENwQWOoJUCbcyqhkgD3ziJuaAKmFiRz/YkmZGJBssZcIkKaglIBru+NRqMrHH2qQKEA50vo9AxHj2oiikpHXHN/bRo1+CNIqrIvRJOldIRk4Pv+MRauD1k7UFGShWmauud5Zr/fv0M+PqvmoGwWxUlpWpa12O12jyC7DsPwTeo0zcsQc47jbPV6vRMIb1FkvYz7NkSNH5A4fzOxtNPptGzb3jEMY0PX9XVN05ZVVV3F+b7MHU2kQoTabrd15O6dpS5KGQ6Hp6wC13UXBNdPYMq3AAMA932Yhlf0jSsAAAAASUVORK5CYII=);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: contain;
}

.chat_msgs ul li #bubble.green {
	background-color: #dcf8c6;
	float: right;
}

.chat_msgs ul li #bubble.green:before {
	content: '';
	position: absolute;
	left: auto;
	right: -11px;
	bottom: 3px;
	width: 12px;
	height: 19px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAmCAYAAADeB1slAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0YTJkYTc4Ni0yMmE3LTQzODktOTFjNy03Y2M1ZDgzZGRmNWIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTE2OTAxNkQxNTA5MTFFNDkwQjVDMTY4RUYwRURBRTYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTE2OTAxNkMxNTA5MTFFNDkwQjVDMTY4RUYwRURBRTYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGJjOTEyYjktODYzMC00ZWI5LTlhYmQtZDdjNmE0YmRiYmQ5IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRhMmRhNzg2LTIyYTctNDM4OS05MWM3LTdjYzVkODNkZGY1YiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PjKJFeEAAAJKSURBVHjaYrz36dz/f//+fVYRMJEHst8zkAiU+Iywiv///x9MMzHQGIAtYGRkZKO1BezySrIsNLMABNx8HHloasH9Ow9/AiOMkWYWKKrIs4NSFM0sAMYBJ019oKGtIkPTOBCXElOhRb6AG8jFzaVBUwu4uTmtgBQLzSxgY2czqOsqFaWZBUDA7Oxp5w5MSUy0soBBVEwkgtrBhGIBBye7w+pd8/SomR/Qg4NJU1etHBRctLIAlFyD95xdZ0ctX2CLUEY5BZnp/XNaeGllAQMLK4uaq4/jJGqkKJwGcHFxxl96eriWUkvwaubh5W648vxIJSWWENQIjPSW669OzDxx+AwHTSwAAXYOthRTS8Ojnz5+NiQ1dRHtdWYWZiM+ft6Tt96emvT+7QdJqlsABazAFJYjIMR/98/vP9O/f/9hCkrW+DQwUloPA1uFV///+7/k6ZMX0x30fD9SvWXHxMSkDQy+dmkZiV3YihiqFc1MzEzaoHqLJhb8/fP3yc2rdwpAIYZRKpBt6N9/74DJdsu9W/fXZsWWHn/98u03oPB3iiz4/ev3g8+fvux/8ujZjpqCtsNXLlz/AhT+CcR/sLkerwXAVPAXaODdr1+/n3z/9v2xQ3uPH2kq634GlPoFxX+AKfAfrv4BigVfPn/d8efPn+c/vv98+vXLt0fPn764N7F91vWzJy6AvPwbauBfkCtJTdYsQFfe0ZO2TQCyP0G9CcfUaKuyPH38fBaQ/gw07DtNmo55iZVLoBFFmx4OMCV8BLr+L60sAAgwAKLk6X4B6GN3AAAAAElFTkSuQmCC);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: contain;
}


.chat_msg > .msg_line {
	position: relative;
	padding-right: 40px;
}

.chat_msg > .msg_line a.hidden, .chat_user a.hidden {
	display: none;
}


.chat_msg > .msg_line:hover a.hidden, .chat_user:hover a.hidden {
	display: inline-block;
}

.chat_msg > .msg_line.long {
	padding-right: 100px;
}

.chat_user {
	display: block;
	margin-bottom: 5px;
}

.chat_date {
	font-size: 11px;
	color: rgba(0,0,0,.45);
	position: absolute;
	bottom: -2px;
	right: 0;
}

.chat_form {
	position: relative;
	border-top: 1px solid #ccc;
	background-color: rgba(255, 255, 255, 0.6);
	position: relative;
}

.chat_form:after {
	content: '';
	display: table;
	clear: both;
}

.chat_emotes {
	display: none;
	position: absolute;
	bottom: 76px;
	right: 0;
	left: 0;
}

.chat_emotes img {
	padding: 10px;
	cursor: pointer;
}

.chat_emotes .tabs {
	display: flex;
	background: white;
	height: 50px;
}

.chat_emotes .tabs button {
	position: relative;
	height: 50px;
	width: auto;
	min-width: 100px;
	flex: 1;
}

.chat_emotes .tabs button.active:before {
	height: 4px;
	position: absolute;
	background-color: #33A196;
	content: '';
	bottom: 0;
	left: 0;
	right: 0;
}

.chat_emotes .emotes_container {
	background-color: #E7E7E7;
}

.emotes_container div {
	overflow-x: auto;
	height: 160px;
	display: none;
}

button {
	background-color: transparent;
	background-size: 24px 24px;
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	opacity: .4;
	height: 40px;
	width: 70px;
	float: left;
	border: 0;
	padding: 0;
	margin: 0;
}

.btn_send {
	background-image: url('../images/chat/send.svg');
}

.btn_emotes {
	background-image: url('../images/chat/emoticon.svg');
}

.btn_online {
	background-image: url('../images/chat/people.svg');
}

.btn_more {
	background-image: url('../images/chat/more_vert.svg');
}

.btn_refresh {
	background-image: url('../images/chat/refresh.svg');
}

.btn_help {
	background-image: url('../images/chat/help.svg');
}

.btn_recent {
	background-image: url('../images/chat/recent.svg');
}

.btn_others {
	background-image: url('../images/chat/world.svg');
}

.btn_add {
	background-image: url('../images/chat/add.svg');
}

.btn_arrow_down {
	background-image: url('../images/chat/arrow_down.svg');
}

.input_container {
	height: 40px;
	overflow: hidden;
	margin: 18px 0;
}

.chat_text {
	background: white;
	border-radius: 5px;
	font-size: 15px;
	padding: 10px 12px;
	float: left;
	height: 20px;
	resize: none;
	border: 0;
}

.chat_text:focus {	
	outline: none;
}

.chat_aviso {
	z-index: 5;
	position: absolute;
	padding: 15px 10px;
	background: #FF6C6C;
	text-align: center;
	text-transform: uppercase;
	color: white;
	right: 10px;
	left: 10px;
	top: 10px;
}

.chat_img {
	max-height: 45px;
}

.emotes_container .chat_img {
	max-width: 45px;
}

.chat_footer {
	overflow: hidden;
	margin: 3px 5px;
	margin-top: 0;
}

kbd {
	padding: 1px 6px;
	border: 1px solid #CCC;
	font-size: 12px;
	font-family: Arial;
	background-color: #F7F7F7;
	box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 1px #FFF inset;
	border-radius: 2px;
	text-shadow: 0 1px 0 #FFF;
}

.chat_table {
	border: 1px solid #ddd;
	border-width: 1px 0 0 1px;
	background: white;
	font-size: 13px;
}

.chat_table thead {
	background: #F4F4F4;
}

.chat_table th, .chat_table td {
	padding: 10px 20px;
	border: 1px solid #ddd;
	border-width: 0px 1px 1px 0px;
	vertical-align: middle;
	text-align: center;
}

.chat_online {
	max-width: 500px;
}

.chat_online span:last-child {
	display: none;
}

#mydialog #cuerpo {
	padding-top: 0;
}

#modalBody {
	overflow: auto;
	padding: 15px;
	max-height: 500px;
}

#mydialog #buttons {
	padding-top: 0;
}

@media (max-width: 1270px) {
	#modalBody { max-height: 400px; }
}

@media (max-width: 800px) {
	#modalBody { max-height: 300px; }
}

.center {
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	position: absolute;
	left: 50%;
	top: 50%;
}

.message-divider {
	height: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
	margin: 6px 0;
	width: 25%;
}

.green .message-divider {
	margin-left: 75%;
}

.color-0 {
	color:#fe7c7f!important;
}

.color-1 {
	color:#35cd96!important;
}

.color-2 {
	color:#6bcbef!important;
}

.color-3 {
	color:#e542a3!important;
}

.color-4 {
	color:#91ab01!important;
}

.color-5 {
	color:#ffa97a!important;
}

.color-6 {
	color:#1f7aec!important;
}

.color-7 {
	color:#dfb610!important;
}

.color-8 {
	color:#029d00!important;
}

.color-9 {
	color: #8b7add!important;
}