client-io.css

body {
  background: #FFF;
  font-family: "monospace", Helvetica, Arial, sans-serif;
  padding: 0; margin: 0;
}

a img {
  border: none !important; }

a {
  text-decoration: none;
  color: #a9c;
  outline: none;
 }

label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
.ie7 img { -ms-interpolation-mode: bicubic; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }

a:hover { opacity: 0.8; }

#ribbon {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 2; }



#room {
  position: absolute;
  top: 150px;
}
#room, #users {
  line-height: 30px;
  color: #9F9686;
}
.chat {
  position: absolute;
  bottom: 76px;
  left: 2px;
  top: 10px;
  right: 110px;
  overflow-y: auto;
  color: #222;
  padding: 10px;
  background: transparent;
  font-size:13px;
  
  word-wrap: break-word;  
}
.chat .from {        
  font-weight: bold;
  border-bottom: 1px solid #7F8794;
  margin-top: 5px;
  color: #222;
  font-size:13px;
  font-family: arial, sans-serif;
}

.chat .from .date {
  float: right;
  font-size: 0,9em;
  font-weight: normal;
}

input[type=submit] {
  border-style: solid;
  background-color: #EEE;
  padding: 5px 10px;
  
  -webkit-border-radius: 3px;
  
  right: -10px;
  bottom: 5px;
  position: absolute;
  
}
.room form {
  position: absolute;
  bottom: 32px;
  left: 2px;
  right: 130px;
}
.room form input[type=text]{
  border:1px solid #D9D9D9;
  color: #222;
  cursor: auto;
  display: inline-block;
  font-family: arial, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  height: 36px;
  left: auto;
  letter-spacing: normal;
  line-height: normal;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  outline-color: #222;
  outline-style: none;
  outline-width: 0px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 0px;
  padding-left: 3px;
  padding-right: 0px;
  padding-top: 2px;
  position: relative;
  resize: none;
  text-align: -webkit-auto;
  text-indent: 0px;
  text-shadow: none;
  text-transform: none;
  top: auto;
  visibility: visible;
  white-space: pre-wrap;
  width: 100%;
  word-spacing: 0px;
  word-wrap: break-word;
  z-index: auto;
}

.nicks {
  font-size:13px;
  position: absolute;
  border-left:1px solid #406;
  top: 10px;
  padding-top:10px;
  bottom: 0;
  right: 0;
  width: 100px;
  color: black;
  padding-left:5px;
}

::-webkit-scrollbar 
{
  margin-left:2px;
  width:6px;
  background-color:#fff;
}

::-webkit-scrollbar-thumb 
{
  background-color:#bbb;
}

#rooms {
  position: absolute;
  bottom: 0px;
  left: 0;
  right: 0;
  height: 30px;
}
#rooms ul {
  margin: 1px;
  padding: 0;
  color: black;
  oorder-spacing:2px;
  border-collapse:separate;
}
#rooms ul li {
  float: left;
  list-style: none;
  margin: 0 1px;
  padding: 0px 10px;
  line-height: 21px;
  background: #F7F7F7;
  cursor: pointer;
  font-size:13px;
  border:1px solid #D0D0D0;
}
#rooms ul li.active {
  font-weight:bold;
}
.help {
  background: #440066;
  padding: 15px;
  color:white;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 18px;
  text-align: left;
  padding: 5px 10px;
  margin: 0;
  line-height: 32px;



}
.help span {
  font-family: 'Lobster', Helvetica, Arial, sans-serif;
  font-size:32px;
  text-shadow:#110044 0 -1px 1px, #EEDDFF 0 1px 1px;
}
.help img {
  position: relative;
  top: 5px;
  left: 0;
}
/*em {
  color:rgba(255, 255, 255, 0.699219);
  font-style:normal;
}*/
.help em {
  color:#a9c;
  font-style:normal;
}
.help b {
  color:rgba(255, 255, 255, 0.699219);
  font-size: 18px;
}

b {
  color: #9F998D;
  font-size: 18px;
}

#rooms ul li.pm {
  background: #440066;
}
#rooms ul li.pm.active {
  background: purple;
  color: rgba(255, 255, 255, 0.699219);
}
.nicks {
  font-size:13px;
  font-weight:bold;
}
.nicks a {
  font-size:13px;
  text-decoration: none;
  color: #333;
  font-weight:normal;
}
.notice {
  color: #777;
}
.fork {
  float: right;
}