@charset "UTF-8";
/* CSS Document */

#chatbar a {
color: #2a2a2a;
}

#chatbox, #chatting, #contactform, #chatbubble, #popout-btn, #chatbox-close, #drawer, div#chathistory
{
	display:none;
}

#chatbubble
{
	margin:-110px 280px 0;
	float:right;
	background:url(/images/chatbar/chatbubble.png) 0 0 no-repeat;
	width:170px;
	height:107px;
	text-indent:-9999px;
	overflow:hidden;
	
}

#chatbar
{
	position:fixed;
	bottom:0;
	width:100%;
	z-index:10000;
	height:32px;
	background:url(/images/chatbar/bg_chatbar.png) 0 0 repeat-x;
	font-family:Tahoma, Geneva, sans-serif;
	font-size: 100%;
}

#chatbar[style]
{
	position: fixed !important;
}

/* Chat div with width for centering */

#chat 
{ 
	width:960px;
	margin:0 auto;
	height:26px;
	margin-top:6px;
	position:relative;
}
	
	/* Chat Info Box Styling */
	span.chatinfo
	{
		padding:7px 0 0 0;
		float:left;
		font-size:13px;
		color:#3d3d3d;
		width: 250px;
	}
	
	span.chatinfo a:link, span.chatinfo a:visited
	{
		color:#286e96;
		font-weight:bold;
		text-decoration:none;
	}
	
	span.chatinfo a:active { text-decoration:underline; }
	span.chatinfo a:hover {
		text-decoration:underline;
		cursor: pointer;
	} 

#chatstatus
{
	float:right;
	width:307px;
	height:26px;
	display:inline;
	margin:0 20px 0 0;
	background:url(/images/chatbar/bg_chatstatus.png) 0 0 no-repeat;
}
	#chatstatus #chatstatus-title-controls { float:right; }
	#chatstatus span.title-chatbox-minimize
	{
		padding: 0 0 0 4px;
		background:url(/images/chatbar/title_btn_minimize.png) 0 0 no-repeat;
	}

/* Status Icon */

#status-icon {
	float: left;
	height: 14px;
	width: 14px;
	margin:6px 8px 0 8px;
	background-color: transparent;
	outline-color: transparent;
}

#status-msg
{
	font-size:14px;
	float:left;
	padding:6px 0 0 0;
	color:#3d3d3d !important;
	width: 225px;
}

#status-icon.available { background:url(/images/chatbar/status_available.png) 0 0 no-repeat; }
#status-icon.waiting { background:url(/images/chatbar/status_waiting.png) 0 0 no-repeat; }
#status-icon.unavailable { background:url(/images/chatbar/status_unavailable.png) 0 0 no-repeat; }
#status-icon.ended { background:url(/images/chatbar/status_ended.png) 0 0 no-repeat; }
#status-icon.error { background:url(/images/chatbar/status_error.png) 0 0 no-repeat; }
#status-icon.available.connecting, #status-icon.connecting { background:url(/images/chatbar/status_connecting.gif) 0 0 no-repeat; }

#popout-btn
{
	width:18px;
	height:18px;
	background:url(/images/chatbar/popout_button.png) 0 0 no-repeat;
	margin: 4px 10px 0px 0px;
	position: relative; 
}

	.status-popout
	{
		display:block;
	}

#chatbox
{
	margin-top:-304px;
	margin-right:-306px;
	float:right;
	background:#dddddd;
	width:305px;
	height:305px;

	font-size:.8em;
	color:#3d3d3d;

}

#titlebar
{
	color:#fff;
	height:29px;
	background:url(/images/chatbar/titlebar_sprite.png) 0 0 no-repeat;
	text-shadow:0 1px 1px #000000;
	width: 305px;
	font-size: 13px;
}
.title-status { width: 225px; }

#titlebar.connecting, #titlebar.ready, #titlebar.thanks { background-position:0 0; }
#titlebar.waiting { background-position:0 -29px; }
#titlebar.chatting { background-position:0 -58px; }

	#titlebar .title-status, #titlebar #chatbox-title-controls
	{
		margin:5px 10px;
		float:left;
	}
	
	#titlebar .title-status { margin-top:8px; }

	#titlebar #chatbox-title-controls { float:right; }
	
	#titlebar span.title-chatbox-minimize
	{
		padding: 0;
		background:url(/images/chatbar/title_btn_minimize.png) 0 0 no-repeat;
	}
	
	#titlebar span.title-chatbox-close
	{
		background:url(/images/chatbar/title_btn_close.png) 0 0 no-repeat;
	}

	.title-button
	{
		display:block;
		width:15px;
		height:10px;
		float:left;
		margin-top:3px;
	}

#chatrequest > p:first-child
{
	font-size: 13px;
	line-height:16px;
	margin:0px 0px 20px 0px;
}

#chatrequest form { display: block; }

.chatinside { padding:10px; }

.hidetext
{
	text-indent:-9999px;
	overflow:hidden;
}

.fl_right { float:right; }

/** Form Elements **/

#chatbar form label
{
	margin:0;
	padding:0;
	color:#1a4f6c;
	font-size: 13px;
	line-height: .5;
}

div.input_wrapper, div.input_wrapper input, div.input_textarea, div.input_textarea textarea, input.simple_short, input.simple_long, div#chathistory
{
	background:url(/images/chatbar/formelements_sprite.png) no-repeat;
	margin: 0;
	padding:0;
}

div.input_wrapper, div.input_wrapper_hover
{
	height:33px;
	background-position:right 0;
	width:284px;
	margin:5px 0;
}

div.input_wrapper_hover {
	cursor: pointer;
}

div.input_wrapper input, div.input_wrapper_hover input, div.input_textarea textarea
{
	border:0 none;
	width:260px;
	padding:7px 8px 9px 8px;
}

div.input_wrapper input 
{
	padding: 8px 8px 9px;
}

#text
{
	padding: 8px 8px 9px 8px;
 	color: black;
 	font-size: 12.8px;
 	resize: none;
 	line-height: 16px;
}

div.input_textarea
{
	background-position:right -74px;
	width:284px;
	margin:5px 0;
	height:86px;
}

div.input_textarea textarea
{
	height:70px;
	background-position:0 -74px;
}

/*Hover States for inputs*/
div.input_wrapper_hover { 
	background-position:right -37px;
	cursor: pointer;
}
div.input_wrapper_hover input { 
	background-position:0 -37px;
	cursor: pointer;
}
div.input_textarea_hover { 
	background-position:right -164px;
	cursor: pointer;
}
div.input_textarea_hover textarea { 
	background-position:left -164px;
	cursor: pointer;
}

input, textarea, select 
{
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
	outline-style:none;
	outline-width:0;
}

#request-button {
	font-family: Tahoma,Geneva,sans-serif;
	font-size: 12.8px;
	font-weight: bold;
	font-style:	normal;
	color: #FFFFFF;
}

#chatbar #how
{
    resize: none;
	overflow:auto;
	color: black;
	font-size: 12.8px;
}
 #chatbar #nickname 
 {
 	color: black;
 	font-size: 12.8px;
 	resize: none;
 	line-height: 16px;
 }
input.simple_short, input.simple_long
{
	width:99px;
	height:29px;
	background-position:left -253px;
	border:0 none;
	color:#fff;
	font-weight:bold;
	text-shadow:0 1px 1px #000000;
	font-size: 12.8px;
}

input.simple_short:hover { 
	background-position:left -283px;
	cursor: pointer;
}
input.simple_short:active { background-position:left -313px; }

input.simple_long
{
	background-position:-99px -253px;
	width:129px;
}

input.simple_long:hover { 
	background-position:-99px -283px;
	cursor: pointer;
}
input.simple_long:active { 
	background-position:-99px -313px;
}

.chatusername, .chatservicername {
	display: block;
	border-bottom: 1px dotted #ccc;
	font-size: 1em;
	padding:3px 0;
	margin-bottom:3px;
}


div#chathistory p:first-child { margin-top:10px; }

.server{ font-style:oblique; color:#bb392f; }
.chatservicername { color:#666; }
.chatusername { font-weight: bold; }

div#chathistory 
{
	overflow-y: auto;
	position: relative;	
	clear: both;
	
	width: 265px;
	height:201px;
	
	margin:10px 0;
	padding:0 10px 0 10px;
	
	background-position: left -345px;
	background-attachment: scroll;
}

div#chathistory p
{
	font-size:11px;
	color: #3D3D3D;
	margin-top: 5px;
	margin-bottom: 5px;
}

div#chat-content
{
	overflow-y: auto;
	position: relative;
	clear: both;
	background: transparent;
}

