Chatbox Colors

[problematic]

Hello everyone,

I'm looking to change the color of my forumotion chatbox.
I'm mainly concerned about the link colors in the top right of it.. (like the little login link)
the top right buttons are so small and thin, that they are hard to see.
but the color of it that it was set to as default makes it even worse.

I realize that in order to edit anything, you need to access the CSS sheet, and add codes there... but I'm not sure what codes to add... or where in it... I'm guessing.. under the Body?

Anyways, if anyone could post the codes on editing
AS MANY THINGS ABOUT THE CHATBOX as you could (example; colors of things.. just anything to personalize it up a bit) and being kind enough to tell how/where exactly to place them in the CSS sheet, that would be a huge help.

-Probs

EDIT: in case anyone would like to see it, it is located here; Chat Box

[RoNo]

Here is your complete chatbox Css
Submit/edit/submit to get what you want

Code:

/* Chatbox */

#frame_chatbox {
  border: none !important;
  }

body.chatbox {
  min-width: 550px !important;
  background-image: none;
  padding: 0;
  margin: 0;
  background-color: #e5e5e5;}
 
#chatbox_members {
  position: absolute;
  top: 30px;
  bottom: 30px;
  width: 180px;
  overflow: auto;
  border-right: 1px solid ;}
 
#chatbox {
  position: absolute;
  top: 30px;
  left: 181px;
  right: 0;
  bottom: 30px;
  overflow: auto;
  line-height: 10px;
  }
 
.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
  font-size: 12px;
  }
 
.chatbox-options {
  text-align:right;
  }
 
#chatbox_messenger_form .gen,#chatbox_messenger_form .text-field,#chatbox_messenger_form {
  float:right;
  }
 
#chatbox_footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 30px;
  }
 
#chatbox_footer table.text-styles {
  float: right;
  }
 
#chatbox_footer .text-field {
  float: left;
  }
 
#chatbox_header {
  height: 30px;
  background-color: #e5e5e5;
  }
 
#chatbox p {
  line-height: 1.2em;
  }
 
.chatbox_row_1 {
  padding: 4px;
  background-color: #1d1d1d;
  }

.chatbox_row_2 {
  padding: 4px;
  background-color: #1d1d1d;
  }
 
.chatbox_row_3 {
  padding: 4px;
  background-color: #1d1d1d;
  }
 
.memberlist_row_1 {
  padding: 2px 2px 2px 10px;
  background-color: #1d1d1d;
  }
 
#chatbox_members .member-title {
  text-align: center;
  padding: 0.5em 0.25em;
  background-image: none;
  font-size: 12px;
  background-color: #1d1d1d;
  color : #ffffff;
  font-family: Verdana,Arial,Helvetica,sans-serif;
  }
 
#chatbox_members ul {
  list-style: none;
  margin: 0 0 0 10px;
  }
 
#chatbox_members ul li {
  margin: 2px 2px 2px 0;
  }
 
#message,#submit_button{
  border-width: 1px;
  }
 
.fontbutton {
  padding: 1px;
  cursor: pointer;
  text-align: left;
  }
 
.fontbutton_normal {
  background: #E1E1E2;
  }
 
.fontbutton_selected {
  background: #BBC7CE;
  border: 1px solid #22229C;
  }
 
.fontbutton_clicked {
  background: #959595;
  border: 1px solid #22229C;
  }
 
.fontbutton_hover {
  background: #E1E1E2;
  border: 1px solid #22229C;
  }
 
#chatbox .user {
  font-weight: bold;
  }
 
div#chatbox {
  color: #ffffff;
  }
 
#chatbox_contextmenu {
  background-color: #1d1d1d;
  border:1px solid #aaa;
  }
 
#chatbox_contextmenu p {
  margin:0;
  padding: 1px 4px;
  font-family: verdana, arial, sans-serif;
  background: #;
  border-bottom:1px solid #777;
  }
 
#chatbox_contextmenu p.hover {
  background: #;
  }
 
#chatbox_contextmenu p.close {
  background: #ddd;
  padding: 1px;
  font-size: 70%;
  color:#fff;
  background: url('');
  }
 
#chatbox_contextmenu p.close img {
  vertical-align: middle;
  padding-left: 20px;
  }
 
#chatbox_contextmenu a {
  color: #;
  text-decoration: none;
  font-size: 70%;
  }
 
#chatbox_contextmenu a:hover {
  color: #;
  }

.fontbutton{
  border:0;
  }
 
  * html #chatbox-members { /* IE expressions helping IE work in Standards mode */height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");}* html #chatbox { /* IE expressions helping IE work in Standards mode */height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 10) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 1) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 1.3) ) + "px");}* html #chatbox-footer {/* IE expressions helping IE work in Standards mode */width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");}

Css stylesheet location
Admin Panel [click]


Have fun

[problematic]

I appreciate the reply really... but see.. I can't edit that stuff

When I open up the CSS Style Sheet tab... it shows me a lil page of codes and what not...but there's nothin in there with the word "chatbox" trust me, i've check and used Ctrl + F to try to find it :S

BUT when i click on "See your forum basic CSS"
I can see a lot of stuff about the chatbox! but I can't edit any of it :s because the page that opens is just a viewing type page only :S

get what i'm saying?

[RoNo]

Add the code I posted to make the changes you want.

Copy the chatbox code above, paste it to the bottom
of your Css stylesheet (like in the screen shot above)
click "submit", edit your desired colors, click "submit'
after making each color change, test/view the chatbox.

Don't disable the basic Css.

[problematic]

Thank you very much!

Stupid me didn't even realize you could scroll down on those codes you gave me

But hey, still problems..
I can't figure out what color codes are for the top right links :S
I tried looking here; Formotion Thread on This
But those codes didn't do anything for me :S

is the Basic CSS suppose to be disabled??? when I do that, it messes up the form of my chatbox when i start editing things :S


Thank you for all your help so far.

[RoNo]

Remove the previous code from your Css & try these...

To change the size & color of options (Archives, Log out etc)
edit "font-size" and "color" in the code below,
copy & paste it to your Css stylesheet and click "submit".

Code:

.chatbox-options {
   float: right;
   list-style: none;
   font-size: 11px;
   margin: 0.7em 0.5em 0.5em 0.5em;
   }
.chatbox-options li {
   display:inline;
   }
.chatbox-options li,.chatbox-options li a,.chatbox-options li label {
   color: #7DF9FF;
   }

To change the colors of members names in the chatbox
Experiment / edit the colors in the code below,
copy & paste it to your Css stylesheet and click "submit".

Code:

.chatbox a {
  color: #7DF9FF;
  }
 
.chatbox a:hover {
  color:red;
  }
 
#chatbox_members {
  color:lightblue
  }

[problematic]

I hate to be the moron that can't get anything right

But I took out all the previous chatbox codes, and replaced em with Rono's.. and it seems to have no effect on it at all :s

I DO NOT want to disable basic CSS sheet right???

Idk what's wrong.. somethings like the background color I can alter.. and yet other things like this stuff I can't :S
any more ideas??

also, if you wanted to help me out over chat (i doubt you do) BUT IF you do, justin.fcb@hotmail.com = msn
Thanks so far guys!