/* pichat.css */

body {
	
background:#EEF2FF url(/static/img/fade-blue.png) top center repeat-x;
	margin:0;

	background-repeat:repeat-x;
	background-position:top;
overflow:hidden;
	
}

a {
 font-size: 12px;
 color: #000;
}
a:link {
 text-decoration: none;
}
a:visited {
 text-decoration: none;
 color: #000;
}
a:hover {
 text-decoration: none;
 color: #00F;
}
a:active {
 text-decoration: none;
 color: #000;
}
.white a:link {
 text-decoration: none;
 font-size:14px;
 
 color: #fff;
}
.white a:visited {
 text-decoration: none;
 font-size:14px;
 color: #fff;
}
#content{
    z-index: 3;
    overflow: auto;
	min-width:600px;
}

#chatboxx {
    position: fixed;
    top:80px;
}

#rapper {
    top: 0px;
}
#trophy{
position:fixed;
right:2;
bottom:30;

}
#effects-msg{
position:fixed;
bottom:68;
z-index:1111;
right:38;
font-size:15;
color:#000;
text-shadow: #000 1px 1px 1px;

}
#footerc
{
	text-align:center;
	position:fixed;
	width:100%;
	bottom:0px;
line-height:3.1;
	font-size:11px;
word-spacing:6px;
height:28px;
	color: #000;

}
#footerc a {
	font-size: 11px;
	color: #000;
}
#footerc a:link {
	text-decoration: none;
	font-size: 11px;
color:000;
}

#footerc a:hover {
	text-decoration:none;
	font-size: 11px;
	color: #f0e;
}


#messagePane {
	border: 2px solid #c8cbce;
top:40px;
bottom:65px;
	position:fixed;
	width: 99.3%;
	background-color:#FFF;
left:0.2%;
	z-index:5;
}

#messageList {
    height: 100%;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}
#messagetabs {
    height: 40px;
    padding: 5px;
    position: fixed;
    width: 80%;
    max-width:1500px;
    overflow-y: hidden;
    overflow-x: hidden;
    top:48px;
    left:0px;
    z-index:1;
}

#msgInputDiv {
	position:relative;
	min-width:500px;
	z-index:100;
left:1px;
bottom:10px;
	width: 100%;
}

#msgInput {
    width: 99.7%;
	z-index:100;
	background-color:#FFF;
    margin-top: 16px;
	left:-3px;
    position:relative;
		border:2px solid #c8cbce;
height:35px;
font-size:20px;
    min-width:500px;
		box-shadow: 2px 3px 4px #eee;
}
.msgInput {
    min-width:500px;
	z-index:100;
}
#msginputrapper{
margin-right:374;

}
#msgSubmit {
			
	position:absolute;
	display:inline-block;
	width:120px;
height:35px;
right:260px;
font-size:20px;
background-image:url(/static/img/urlbutton.png);
text-indent:27;

top:15px;
	text-align:center;
	z-index:100;
	cursor:pointer;
	background-color:#0c8fff;
	font-size:12px;
	color:#fff;
	text-shadow:1px 1px 3px rgba(0,0,0,1);
}
#webcam-button-upload{
		border-top-right-radius:10px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
	border-radius:5px;
	position:absolute;
	display:inline-block;
	width:120px;
height:35px;
background-position:center;
right:20;
top:15px;
padding-bottom:1;
text-indent:28;
	text-align:center;
	z-index:100;
	cursor:pointer;
background-color:#0c8fff;
	font-size:12px;
	color:#fff;

background-image:url(/static/img/cambutton.png);

	text-shadow:1px 1px 3px rgba(0,0,0,1);
}
#webcam-button-snap{
		border-top-right-radius:10px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
	border-radius:5px;
	position:absolute;
	display:inline-block;
	width:120px;
height:35px;
background-position:center;
right:20;
top:15px;
padding-bottom:4;
	text-align:center;
	z-index:100;
	cursor:pointer;
background-color:yellow;
	font-size:17px;
	color:#fff;
background-image:url(/static/img/bg-btn-red.png);
	text-shadow:1px 1px 3px rgba(0,0,0,1);
}
#webcam-button-snap.blink{
  color:#4f4;
}


#webcam-button-close { /* 16 x 14 */
  position: fixed;
  bottom: 330px; /* 240 + 68 - (16 / 2) */
  right: 335px; /* 320 - (14 / 2) */
  z-index: 5001;
border:1px solid #000;
		box-shadow: 3px 4px 4px #c8cbce;
-webkit-box-shadow: 3px 4px 4px #c8cbce;
-moz-box-shadow: 3px 4px 4px #c8cbce;
  cursor: pointer;
}

#webcam-preview {
  position:fixed;
  bottom: 82;
opacity:0.9;
  right:30;
		box-shadow: 3px 4px 4px #c8cbce;
-webkit-box-shadow: 3px 4px 4px #c8cbce;
-moz-box-shadow: 3px 3px 4px #c8cbce;
	border-top-right-radius:5px;
	background-color:#FFF;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
border:1px solid #999;
  z-index:5000;
}
#upload {
		border-top-right-radius:10px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
	border-radius:5px;
	position:absolute;
	display:inline-block;
	width:120px;
height:35px;
background-position:center;
right:140;
top:15px;
padding-bottom:1;
text-indent:24;
	text-align:center;
	z-index:100;
	cursor:pointer;
background-color:#0c8fff;
	font-size:12px;
	color:#fff;
background-image:url(/static/img/upbutton.png);

	text-shadow:1px 1px 3px rgba(0,0,0,1);
}
.msgDiv img{
    max-width:650px;
    width: expression(this.width > 650 ? 650: true);
    max-height:400px;
    height: expression(this.width > 400 ? 400: true);
    max-width:400px;
margin:-2;
 z-index: 1;
}
.msgDiv {padding:2px;   
}
.oldmsg {
    color: #666;
}

#userList {
	overflow-x: hidden;
	overflow-y:auto;
	max-height: 55%;
	margin: 0px;
	position: absolute;
	padding: 5px;
	top:85px;
	min-width: 200px;
	width:11%;
	float:right;
	right: 6.2%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight:420;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
	-webkit-border-top-left-radius:5px;
	background-color:#FFF;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
border-right:2px solid #c8cbce;
border-bottom:2px solid #c8cbce;

		box-shadow: 3px 4px 4px #c8cbce;
-webkit-box-shadow: 3px 4px 4px #c8cbce;
-moz-box-shadow: 3px 3px 4px #c8cbce;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#c8cbce, offX=3, offY=4, positive=true);
	text-overflow:ellipsis;
opacity:0.87;
	z-index:18;
	text-align: left;
}
.username{height:30px;
margin-top:6px;
line-height:20px;
text-indent:6px;
z-index:18;
min-width:90px;
overflow:hidden;

}
.username a { 
display:block; 
width:100%; 
height:100%; 
text-decoration:none; 
}  
.username a:hover { 
display:block; 
width:100%;
height:100%;
background-image:url(/static/img/moverc.png);
background-repeat:repeat-x;
color:#fff;
text-decoration:none;
background-color:#f3f3f3;
	border-top-right-radius:5px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
}  
#userList img{
    max-width:30px;
    width: expression(this.width > 30 ? 30: true);
    max-height:30px;
    height: expression(this.width > 30 ? 30: true);
    max-width:30px;

	float:right;
	right:1px;
	z-index:77;
	height:30px;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	-webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
	-moz-border-radius-topleft:3px;
	-moz-border-radius-topright:3px;
	border-bottom-left-radius:3px;
	border-bottom-right-radius:3px;
	-webkit-border-bottom-left-radius:3px;
	-webkit-border-bottom-right-radius:3px;
	-moz-border-radius-bottomleft:3px;
	-moz-border-radius-bottomright:3px;
}

#userListicon {
    overflow: auto;
    height: 70%;
    margin: 0px;
    position: fixed;
    padding: 5px;
    top:48px;
    width: 7%;
    float:right;
    right: 35px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    min-width:72px;
    line-height:13px;
    z-index:1;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    color: #666;
    text-transform:none;
    
}
#avatar
{	
	right:1px;
	float:right;
	text-align:left;
	width:auto;
	
}
#mgsavatar{
left:0;
}
#binfo {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    bottom
}

#preload {
  position: absolute;
  left: 0px;
  top: 0px;
}

.invisible { display: none !important; }