Forum Url: http://fuedalworld.smfforfree3.com
How can i change these?

http://img528.imageshack.us/img528/3889/screentt1.png
(ScreenShot)

And when I edit the CSS, do I Click "Modify Style" or "Edit Style"

And if I just want a color, do i take out the image URL?

Simply Sibyl:
Note:   Lets say you change the background to black   (#000000)
          You will then want to change the font color so that it can be seen.
           Change color: black;   to the color you want
=========================================
I want this color: #009900

?Confused.

Do this and if you need a different font color change the #ffffff in both places in this code

Refresh your browser after you click Modify Style to see the changes.

This is really helpful to me too Sibyl.  I've wondered how you can change those areas, now i know.

Tabs are in the section that starts with the following, goes all the way to the bottom of the css to just before the Ajax Notifier section:

/* definitions for the main tab, active means the tab reflects which page is displayed */
.maintab_first, .maintab_back, .maintab_last, .maintab_active_first, .maintab_active_back, .maintab_active_last
{
   color: white;
   text-transform: uppercase;
   vertical-align: top;
}


The tabs are graphic images.   
To change those you  need to make new images and replace the urls in the css.
Then, if need be, you change the font colors to go with the new tab colors. 

There are a total of 12 tab images.   

There are 6 maintab images: 
maintab_first, maintab_back, maintab_last
maintab_active_first, maintab_active_back, maintab_active_last

There are 6 mirrortab images:
mirrortab_first, mirrortab_back, mirrortab_last,
mirrortab_active_first, mirrortab_active_back, mirrortab_active_last

(The "active" tabs are those that you see when you mouseover a tab.)

When you are modifying a style if you look at the top section you can see the graphics there.  You could download them from there, and use a graphics program to change the colors of them.   There are transparent areas so you would need to save them as a transparent .gif   (or a png if you dont mind that some browsers (IE6 for instance) that do not support png transparency)    Upload them to Photobucket,etc.. get the urls and replace them in the css.

---

Option 2:

Tabs can also be done as "links" instead of graphics.
You replace the graphic image urls with color codes.
 
This stylesheet has links instead of tabs -  Dark Aqua Marble   Click the thumbnail on that page to see how the tabs are done.

Look at the section of the css for the tabs and compare it to the default stylesheet and you will see how it is done.       
( plus many others you can find in the stylesheet index-  Stylesheet Index )

 

BlueButterfly you are welcome

I do have a tip about changing the graphic image for the catbg and titlebg areas.
When you make the new images keep in mind that you need to do the following:

Make the image height taller then the default images are.
Depending on the image (lets say it is a gradient) - get the color code for the very bottom of the image and use that color code as the background color for that section.

Reason for doing so:   
Ever notice on some forums when there is a large logo put in the logo image url that you see a part of the graphic image under the logo then another color under it?   

That is because the graphic is too "short" in height and/or the color code for the background underneath the graphic either does not match or is not the same as the bottom of the graphic so that it blends well if that area is filled with a large image.