/*
 * default style for pusher chat 
 * Pusher chat
 * facebook like chat jQuery plugin using Pusher API 
 * version: 1.0   
 * Author & support : zied.hosni.mail@gmail.com 
 * © 2012 html5-ninja.com
 * for more info please visit http://html5-ninja.com
 *
*/

#pusherChat{position: fixed; right:0; bottom: 0;width: 100%; z-index:99}
#pusherChat #membersContent{
    position:absolute;right: 10px; bottom:-2px ; width: 220px; border:#ccc 1px solid ;
    padding: 2px;box-shadow: 1px 1px 5px rgba(0,0,0,0.2); border-radius:4px 4px 0 0;
}
#pusherChat #members-list a{
    position: relative; padding: 10px;display: block;width: available;
    text-decoration: none; color: #414042;
}
#pusherChat #membersContent a.off{opacity: 0.5; background/*\**/: #eee\9;}
#pusherChat #membersContent a:hover{background: #00B4FF;color :#fff}
#pusherChat #membersContent h2{margin:10px;font-size:15px;}
#pusherChat #membersContent .scroll{overflow-y :auto }
#pusherChat #expand, #pusherChat .chat-parameter.dropdown, #pusherChat .chat-parameter.dropup, #pusherChat .contact-parameter.dropdown, #pusherChat .contact-parameter.dropup{ font-size:15px; position: absolute; cursor: pointer;color:#FFFFFF;}
#pusherChat .chat-parameter.dropdown,#pusherChat .chat-parameter.dropup{top:20px; right: 40px;}
#pusherChat .chat-parameter.dropdown > a,#pusherChat .chat-parameter.dropup > a{color:#FFFFFF; font-size:15px;}
#pusherChat .contact-parameter.dropdown,#pusherChat .contact-parameter.dropup{top:17px; right: 40px;}
@-moz-document url-prefix() {
    #pusherChat .contact-parameter.dropdown,#pusherChat .contact-parameter.dropup{top:12px; right: 40px;}
}
#pusherChat .contact-parameter.dropdown > a,#pusherChat .contact-parameter.dropup > a{color:#FFFFFF; font-size:15px;}
#pusherChat .contact-parameter .dropdown-menu{right:-30px;left:auto;}
#pusherChat #expand{top:10px; right: 15px;}
#pusherChat #expand .closeChat, #pusherChat #expand .closeChat,#pusherChat .pusherChatBox .expand .openChat{display: none; }
#pusherChat .pusherChatBox .expand {right: 45px;}
#pusherChat #membersContent a img{width: 35px;height: 35px;}
#pusherChat .pusherChatBox{width: 220px;padding: 0px; background: #fff;position: relative;bottom: -2px ;border:#ccc 1px solid;box-shadow: 0px -1px 3px #ccc }
#pusherChat .pusherChatBox textarea{overflow: auto;resize: none; width: 240px;display:block; margin: 10px auto;font-size: 14px;border:1px solid #ccc; }
#pusherChat .pusherChatBox .logMsg{width: 100%; background: #fff; height: 300px;margin: 0 auto;overflow: hidden;position: relative; overflow-y: auto;}
#pusherChat .pusherChatBox .logMsg p{margin:10px; padding:5px 10px;display:inline-block;max-width:80%;}
#pusherChat .pusherChatBox .logMsg img{height:auto;}
#pusherChat .pusherChatBox h2{margin: 0;padding: 0;display: block;font-size: 16px;padding-top: 1px;padding:10px;background:#5d5b5e;color:#FFFFFF;}
#pusherChat .pusherChatBox h2 img{z-index: 100;position: relative ; border-radius:5px; margin-right: 4px; width:35px; height:35px;}
#pusherChat .pusherChatBox .closeBox{font-size:22px; font-weight: bold;position: absolute; right: 10px; top: 17px;cursor: pointer;color:#FFFFFF;overflow:hidden;}
#pusherChat .pusherChatBox h2  a{text-decoration: none; color:inherit}
#pusherChat .pusherChatBox .state{position: absolute; left: 26px ; top :3px;z-index: 101}
#pusherChat .pusherChatBox .state .quote,#pusherChat .pusherChatBox .state .pencil{display: none}
#pusherChat .pusherChatBox .msgTxt{font-size: 13px;line-height: normal;}
#pusherChat .pusherChatBox.off{background-color: #ccc;}
#pusherChat .pusherChatBox.off h2 img{opacity: 0.6}
#pusherChat .pusherChatBox .userName,#pusherChat #members-list .name{width: 100px;display: inline-block;text-overflow: ellipsis; overflow: hidden; font-size:13px;line-height:1.2;}
#pusherChat #members-list .name{width: 105px;}
#pusherChat .pusherChatBox.writing .state .pencil{display: block}
#pusherChat .pusherChatBox.recive .state .quote{
    display: block;
    -webkit-animation: pulsate 0.5s ease-out;
    -webkit-animation-iteration-count: infinite; 
    animation: pulsateFF 1s ease-out;
    animation-iteration-count: infinite; 
    opacity: 1;
}

@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
50% {opacity: 1.0;}
100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}

@keyframes pulsateFF {
    0% {transform: scale(0.1, 0.1); opacity: 0.0;}
50% {opacity: 1.0;}
100% {transform: scale(1.2, 1.2); opacity: 0.0;}
}
#pusherChat .chatBoxWrap{float: left;  position: relative }
#pusherChat .chatBoxWrap .pusherChatBox{ margin-right: 10px;position: absolute}
#templateChatBox{display: none}
.chatBoxslide{float: right;position: relative;}
.overFlow{top: 9000px !important}
#pusherChat .chatBoxWrap #slideLeft,#pusherChat .chatBoxWrap #slideRight{display: none;position: absolute;font-size: 18px; top:-24px;cursor: pointer;color :#00B4FF }
#pusherChat .chatBoxWrap #slideLeft img,#pusherChat .chatBoxWrap #slideRight img{display: none}
#pusherChat .chatBoxWrap #slideLeft.on img,#pusherChat .chatBoxWrap #slideRight.on img{display: block}
#pusherChat .chatBoxWrap #slideLeft {left: 10px;}
#pusherChat .chatBoxWrap #slideRight{right: -10px}
#pusherChat .chatBoxWrap  .overFlowHide{display: none}
#members-list{
	background:#FFFFFF;
	font-size:13px;
}
#members-list > div,#pusherChat .pusherChatBox .msgTxt > div{
	overflow:hidden;
}
#pusherChat .slider{
	width:100%;
}

#pusherChat .inputChat .message{
	height:35px;
}

#pusherChat .logMsg::-webkit-scrollbar-track, #pusherChat .scroll::-webkit-scrollbar-track, #pusherChat .inputChat .message::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

#pusherChat .logMsg::-webkit-scrollbar, #pusherChat .scroll::-webkit-scrollbar, #pusherChat .inputChat .message::-webkit-scrollbar
{
	width: 6px;
}

#pusherChat .logMsg::-webkit-scrollbar-thumb, #pusherChat .scroll::-webkit-scrollbar-thumb, #pusherChat .inputChat .message::-webkit-scrollbar-thumb
{
-webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(215,215,215,0.8); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#pusherChat .logMsg::-webkit-scrollbar-thumb:window-inactive,#pusherChat .scroll::-webkit-scrollbar-thumb:window-inactive, #pusherChat .inputChat .message::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(215,215,215,0.4); 
}
#pusherChat .smiley .dropdown-menu{
	margin-bottom:45px;
	max-height: 300px;
    width: 285px;
	overflow:auto;
}
#pusherChat .image-gif .dropdown-menu{
	width:300px;
	left:-90px;
}
#pusherChat .image-gif .result-gif{
	height:300px;
	overflow-y:auto;
	color:#000000;
}
#pusherChat .result-gif img{
	margin:0;
}
#pusherChat .toRead {position:absolute;top:32px;left:53px;}
#members-list .toRead {position:absolute;top:8px;left:33px;}
#pusherChat .toReadReduced {position:absolute;top:30px;left:35px;z-index:999}
#pusherChat .online{position:absolute;top:35px;left:35px;border:2px solid #FFFFFF;width:18px;height:18px;}
#membersContent .fa-tick{margin-left:-18px;}