body{ font-family:Arial, Helvetica, sans-serif}

a {
	text-decoration: underline;
	font-family:Arial, Helvetica, sans-serif
}

input[type="text"],
input[type="password"],
input[type="file"],
select,
textarea{padding:5px !important; font:12px Arial, Helvetica, sans-serif; background:#f7f7f7; border:1px #CCC solid !important; border-radius:2px; outline:none;}
select{padding:4px !important;}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="file"]:focus,
select:focus,
textarea:focus{background:#fff; border:1px #999 solid !important;}

a:hover {
	text-decoration: none;
}

a img {
	font:11px Arial, Helvetica, sans-serif;
}

form {
	margin-bottom: 0px;
	margin-top: 0px;
}



.form td{
	color:#525252;
}

div#typingdiv, div#engineinfo {
	border: 0px solid gray;
	font:11px Arial, Helvetica, sans-serif;
	padding-right: 10px;
	padding-left: 10px;
	background: #fafafa;
	color: #B11E23;
}

.bgcn {
	background-position: center;
	background-repeat: no-repeat;
}

.bgrn {
	background-position: right;
	background-repeat: no-repeat;
}

.bgcy {
	background-position: center;
	background-repeat: repeat-y;
}

.bgry {
	background-position: right;
	background-repeat: repeat-y;
}

.bgly {
	background-position: left;
	background-repeat: repeat-y;
}

.bgbx {
	background-position: bottom;
	background-repeat: repeat-x;
}

.window {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}

.window a {
	color: #880000;
}

.window h1 {
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 18px;
	color: #000000;
	font-weight: normal;
}

.window h2 {
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 12px;
	color: #000000;
}

.topo-chat-no-logo{

}

.topo-chat-no-logo img{
    vertical-align:middle;
}

.topo-chat-no-logo a{
    text-decoration:none;
}

.topo-chat-no-logo span{
    margin-left:-10px;
    padding:4px 6px 4px 7px;
	border:1px #CDCDCD solid;
	border-left:0;
	font-size:18px;
	font-weight:bold;
	color:#222;
	border-radius:0 3px 3px 0;
}

#header{
	height:50px;
	width:99.6%;
	margin:0px 0px 20px 0px;
	border-radius:3px;
	border:1px #ddd solid;
	background-color: #f2f2f2;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#e2e2e2) );
	background-image: -moz-linear-gradient(top, #ffffff, #e2e2e2);
	background-image: -ms-linear-gradient(top, #ffffff, #e2e2e2);
	background-image: -o-linear-gradient(top, #ffffff, #e2e2e2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e2e2e2');
}

.mmimg{
   padding-left:10px;
   font-size:12px;
   color:#777;
}

.msgSucesso{ background: #00CC33 !important; border:0 !important; color:#fff !important}

.text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.error{
  color:#c00 !important;
}

.text span.grey {
	color: #787878;
}

.www a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	text-decoration: none;
}

.message {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #4F4F4F;
	padding-left: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 3px;
	line-height: 20px;
}

.message span.time {
	color: #000000;
}

.message span.nuser {
	color: #B11E23;
	font-weight: bold;
}

.message span.nagent {
	font-weight: bold;
}

.message span.minf {
	color: #1E48B1;
	font-size: 12px;
}

.message span.mevent {
	color: #A1A1A1;
	font-size: 12px;
}

.message span.mhidden {
	color: #A1A1A1;
	font-size: 12px;
}

.message span.mconn {
	color: #A1A1A1;
	font-size: 12px;
}

textarea.message {
	width: 99%;
	height: 88%;
	border: 0px solid Blue !important;
	overflow: auto;
	margin-left: 3px;
	margin-top: 3px;
	margin-bottom: 3px;
	margin-right: 5px;
	background-color:#ffffff !important;
	
}
textarea.message:focus{box-shadow:0 0 0 #fff !important;}


.username {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #383838;
	padding-left: 3px;
}

input.username {
	border: 1px solid #878787;
}

.answer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #575757;
	width: 170px;
}

.submit a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
}

.button a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
}

.copyr {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #929292;
}

.copyr a {
	color: #929292;
}


/* Botões */
.but{
	padding:5px 8px; 
	height:26px;
	text-shadow:-1px -1px 0 #000; 
	color:#fff; font:bold 12px Arial, Helvetica, sans-serif; 
	text-transform:uppercase; 
	cursor:pointer; 
	text-decoration:none;
	border:1px #000 solid; 
	box-shadow: inset 0 1px 0px #999; 
    border-radius:3px;
	background-color: #555555;
	background-image: -webkit-linear-gradient(#555555, #111111);
	background-image: -moz-linear-gradient(#555555, #111111);
	background-image: -o-linear-gradient(#555555, #111111);
	background-image: linear-gradient(#555555, #111111);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#111111');
}
.bt:hover{box-shadow:0 0 5px #aaa; color:#ccc; cursor:pointer; text-decoration:none;}


@media screen and (min-width: 320px) and (max-width: 600px) {

    input, textarea{width: calc(100% - 12px);}
    select{width:100%;}

    .mmimg{padding:8px 10px;}
    
    .text, .username, .usermessage, .mmimg, .but, .message{font-size: 14px !important;}
    .username-small{font-size: 12px !important; width:100%;}

    .but{padding:7px 10px; height:30px;}
    .submit a, .button a{font-size:12px;}

    .usermessage{height:70px;}

    .topo-chat-no-logo img{max-width:150px;}

    .nome-atual-visitante{display: none;}

    .bt-send-desktop{display:none;}
    .bt-send-mobile{display:table !important;}

}