You are on page 1of 32

PHPFox CSS Guide

This is a basic guide for changing the colors of the


standard Konsort theme.
Find your CSS file here: /file/style/
Please make a copy of your original css file. Use at
your own risk.
I use coordinated color combo sets, find it here
http://www.colorcombos.com

Scooty
Changes the main background color

• body {
background:#7F5417;
color:#000;
text-align:center;
margin-left:auto;
margin-right:auto;
font-size:9pt;
font-family:verdana, arial, helvetica,
sans-serif;
margin-bottom:20px;
margin-top:0px;
‘Welcome Guest’ ‘or’ ‘|’ ‘language’ colors’

}
#top td {
color:#32FA0B;
}
Changes top color strip of logo background

.top2 {
background:#32FA0B;
Changes color of left/right sides of BROWSE HOME GALLERY
menu links

#outer2 {
background:#32FA0B;
text-align:center;
Changes background color of

BROWSE HOME GALLERY ETC

.menu {
border-bottom:2px #54A4DE solid;
background:#FF3333;
height:30px;
padding-left:5px;
padding-right:5px;
cursor:pointer;
color:#fff;
font-size:7pt;
font-weight:bold;
Changes color of logo background

.top2 {
background:#32FA0B;
Changes color of comment background

/* COMMENT BOX */
.comment {
border:1px #BDBDBD solid;
background:#FF3333;
color:#000;
Changes color of Not yet a member?
.mainmenu4 {
background:#FF3333;
font-size:7pt;
color:#fff;
Changes color of comment text
.comment-text {
color:#FF3333;
font-size:8pt;
Changes background mouse over color of BROWSE HOME
GALLERY

menu2 {
background:#FFCC33;
height:30px;
padding-left:5px;
padding-right:5px;
cursor:pointer;
Changes language dropdown box background upper right corner

#top input,select {
font-size:8pt;
background:#32FA0B;
color:#000;
Changes color of bottom menu

#bottom3 {
background:#FF3333;
width:100%;
font-size:7pt;
font-weight:bold;
text-align:center;
color:#fff;
Changes footer text color

#bottom3 a {
color:#FF3333;
Changes text color of footer on mouseover

#bottom3 a:hover {
color:#FF3333;
text-decoration:underline;
Changes color strip of footer

#bottom4 {
background:#FF3333;
width:100%;
color:#fff;
Changes the color of this symbol | bottom page

#bottom3 {
background:#195B85;
width:100%;
font-size:7pt;
font-weight:bold;
text-align:center;
color:#FF3333;
Changes the colors of LIVE CHAT- IM -BOOKMARK

#top a {
font-size:7pt;
color:#32FA0B;
Changes background color of all pages

#main {
background:#FF3333;
font-size:8pt;
color:#000;
border-left:1px #D9D9D9 solid;
border-right:1px #D9D9D9
solid;
Changes font color on forum, and new pages
#main {
background:#fff;
font-size:8pt;
color:#FF3333;
border-left:1px #D9D9D9 solid;

border-right:1px #D9D9D9 solid ;


Changes color of login background
.border {
border:1px #332F2F solid;
background:#FF3333;
Changes mouse over color of LIVE CHAT- FLASH CHAT- IM - BOOKMARK

#top a:hover {
font-size:7pt;
color:#32FA0B;
text-decoration:underline;
Changes color of little squares on visitor page

.sqr1
{
background:#FF3333;
vertical-align:middle;
margin-left: 4px;
margin-right: 3px;
}
Changes color of boxes on pages
.border2 { border:1px #BDBDBD solid; color:#000;

background:#FF3333; }
Changes color of member login box and recent login on visitor page

.mainmenu3 {
background:#FF3333;
font-size:7pt;
color:#fff;
Changes color of some title boxes and comment header box

.mainmenu5 {

background:#FF3333
;
font-size:7pt;
color:#fff;
Changes background color of Main, My Account, Settings etc
.item2 {
border-top:2px #000 solid;
border-left:1px #ccc solid;
border-right:1px #ccc solid;
border-bottom:1px #fff solid;
padding-top:9px;
padding-bottom:5px;
padding-right:5px;
padding-left:5px;
cursor:pointer;
font-size:7pt;
font-weight:bold;
background:#FF3333;
color:#195B85;
Changes Forum strips
.forum-1 {
background:#FF3333;
color: #fff; You can change the font color here.
font-size:8pt;
Changes forum background & icon background
.forum-2 {
background:#FF3333;
color:#000;
font-size:8pt;
Changes forum links colors

.forum-2 a { color:#FF3333; }
Changes forum links mouseover color

.forum-2 a:hover { color:#FF3333; text-decoration:underline; }


Changes forum message background color
.forum-4 {
border:1px #000 solid;
background:#FF3333;
color:#000;
font-size:8pt;

You might also like