# Kirupa Forum User Style

**URL:** <https://forum.kirupa.com/t/kirupa-forum-user-style/262212>\
**Category:** random\
**Created:** [June 4, 2008, 6:25am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212 "2008-06-04T06:25:11Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![ajcates](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ajcates/32/2435_2.png) [@ajcates](https://forum.kirupa.com/u/ajcates)\
**Post date:** [June 4, 2008, 6:25am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/1 "2008-06-04T06:25:11Z")

</div>

So I think that the current style is really bad looking so I went thur and made a user style.

You need to install the Firefox extension stylish for it to work. - [https://addons.mozilla.org/en-US/firefox/addon/2108](https://addons.mozilla.org/en-US/firefox/addon/2108)

Screenshot:  
[![](http://forum.kirupa.com/uploads/kirupa/4786/193af7f255bb43ec.png)](http://ajcates.com/public/dump/Kirupa%20Blue%20and%20Tan.png)

Code:

```auto

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.kirupa.com") {
body
{
	background-color: #2E4E6B!important;
background-image:none !important;
	color: #000000 !important;
	font: 10pt arial, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
	margin: 5px 5px 10px 5px !important;
}
a:link, body_alink
{
	color: #2E4E6B !important;
	text-decoration: none !important;
}
a:visited, body_avisited
{
	color: #2E4E6B !important;
	text-decoration: none !important;
}
a:hover, a:active, body_ahover
{
	color: #0066FF !important;
	text-decoration: none !important;
}
.page
{
	background: #2E4E6B !important;
	color: #000000 !important;
}
td, th, p, li
{
	font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.tborder
{
	background: #DAE9F6 !important;
	color: #000000 !important;
}
.tcat
{
	background: #FBF2D3 !important;
	color: #000052 !important;
	font: bold 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.tcat a:link, .tcat_alink
{
	background: transparent !important;
	color: #000000 !important;
	text-decoration: none !important;
}
.tcat a:visited, .tcat_avisited
{
	background: transparent !important;
	color: #333333 !important;
	text-decoration: none !important;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
	background: transparent !important;
	color: #4C96E1 !important;
	text-decoration: none !important;
}
.thead
{
	background: #4C96E1 !important;
	color: #222 !important;
	font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.thead a:link, .thead_alink
{
	color: #2E4E6B !important;
}
.thead a:visited, .thead_avisited
{
	color: #003399 !important;
}
.thead a:hover, .thead a:active, .thead_ahover
{
	color: #3366CC !important;
}
.tfoot
{
	background: #FBF2D3 !important;
	color: #E0E0F6 !important;
}
.tfoot a:link, .tfoot_alink
{
	color: #2E4E6B !important;
}
.tfoot a:visited, .tfoot_avisited
{
	color: #2E4E6B !important;
}
.tfoot a:hover, .tfoot a:active, .tfoot_ahover
{
	color: #0066CC !important;
}
.alt1, .alt1Active
{
	background: #EBF3FA !important;
	color: #000000 !important;
}
.alt1 a:hover, .alt1 a:active, .alt1_ahover, .alt1Active a:hover, .alt1Active a:active, .alt1Active_ahover
{
	text-decoration: underline !important;
}
.alt2, .alt2Active
{
	background: #FAF6EB !important;
	color: #000000 !important;
}
.inlinemod
{
	background: #FFFFCC !important;
	color: #000000 !important;
}
.wysiwyg
{
	background: #F5F5FF !important;
	color: #000000 !important;
	font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
	margin: 5px 10px 10px 10px !important;
	padding: 0px !important;
}
.wysiwyg a:link, .wysiwyg_alink
{
	color: #22229C !important;
}
.wysiwyg a:visited, .wysiwyg_avisited
{
	color: #22229C !important;
}
.wysiwyg a:hover, .wysiwyg a:active, .wysiwyg_ahover
{
	color: #FF4400 !important;
}
textarea, .bginput
{
	font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.bginput option, .bginput optgroup
{
	font-size: 10pt !important;
	font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.button
{
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
select
{
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
option, optgroup
{
	font-size: 11px !important;
	font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.smallfont
{
	color: #000000 !important;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.time
{
	color: #2E4E6B !important;
}
.navbar
{
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.highlight
{
	color: #FF0000 !important;
	font-weight: bold !important;
}
.fjsel
{
	background: #EFEFEF !important;
	color: #3E3E3E !important;
}
.fjdpth0
{
	background: #F7F7F7 !important;
	color: #000000 !important;
}
.panel
{
	background: #E4E7F5 url(../../images/gradients/gradient_panel.gif) repeat-x top left !important;
	color: #000000 !important;
	padding: 10px !important;
	border: 2px outset !important;
}
.panelsurround
{
	background: #D1D4E0 url(../../images/gradients/gradient_panelsurround.gif) repeat-x top left !important;
	color: #000000 !important;
}
legend
{
	color: #22229C !important;
	font: 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
}
.vbmenu_control
{
	background: #4C96E1 !important;
	color: #1F414E !important;
	font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
	padding: 3px 6px 3px 6px !important;
	white-space: nowrap !important;
}
.vbmenu_control a:link, .vbmenu_control_alink
{
	color: #1F414E !important;
	text-decoration: none !important;
}
.vbmenu_control a:visited, .vbmenu_control_avisited
{
	color: #1F414E !important;
	text-decoration: none !important;
}
.vbmenu_control a:hover, .vbmenu_control a:active, .vbmenu_control_ahover
{
	color: #2E4E6B !important;
	text-decoration: underline !important;
}
.vbmenu_popup
{
	background: #FFFFFF !important;
	color: #000000 !important;
	border: 1px solid #0B198C !important;
}
.vbmenu_option
{
	background: #F8F8F8 !important;
	color: #000000 !important;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
	white-space: nowrap !important;
	cursor: pointer !important;
}
.vbmenu_option a:link, .vbmenu_option_alink
{
	color: #2E4E6B !important;
	text-decoration: none !important;
}
.vbmenu_option a:visited, .vbmenu_option_avisited
{
	color: #2E4E6B !important;
	text-decoration: none !important;
}
.vbmenu_option a:hover, .vbmenu_option a:active, .vbmenu_option_ahover
{
	color: #0066FF !important;
	text-decoration: none !important;
}
.vbmenu_hilite
{
	background: #EEEEEE !important;
	color: #656565 !important;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif !important;
	white-space: nowrap !important;
	cursor: pointer !important;
}
.vbmenu_hilite a:link, .vbmenu_hilite_alink
{
	color: #2E4E6B !important;
	text-decoration: none !important;
}
.vbmenu_hilite a:visited, .vbmenu_hilite_avisited
{
	color: #2E4E6B !important;
	text-decoration: none !important;
}
.vbmenu_hilite a:hover, .vbmenu_hilite a:active, .vbmenu_hilite_ahover
{
	color: #0033FF !important;
	text-decoration: none !important;
}
/* *****styling for 'big' usernames on postbit etc.***** */
.bigusername { font-size: 14pt !important; }

/* *****small padding on 'thead' elements***** */
td.thead, div.thead { padding: 4px !important; }

/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none !important; }
.pagenav td { padding: 2px 4px 2px 4px !important; }

/* *****define margin and font-size for elements inside panels***** */
.fieldset { margin-bottom: 6px !important; }
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px !important; }

.buttonStyle {
	font-size: 10px !important;
	font-family: Arial, Helvetica, sans-serif !important;
	margin-left: 4px !important;
	border-color: black !important;
	border-width: 1px !important;
}
.textInputStyle {
	font-size: 11px !important;
	font-family: Arial, Helvetica, sans-serif !important;
	margin-left: 4px !important;
	border-color: black !important;
	border-width: 1px !important;
	text-indent: 2px !important;
}
.InputTextStyle {
	background-image: url('http://www.kirupa.com/mini_icons/magnifier.gif') !important;
	background-repeat: no-repeat !important;
	background-position: 3px 2px !important;
	font-family: Arial, Helvetica, sans-serif !important;
	font-size: 12px !important;
	font-weight: normal !important;
	color: #333333 !important;
	border-width: 1px !important;
	border-color: #999999 !important;
	padding-left: 20px !important;
}

/* *****don't change the following***** */
form { display: inline !important; }
label { cursor: default !important; }
.normal { font-weight: normal !important; }
.inlineimg { vertical-align: middle !important; }
}

```

---

<div class="post-metadata">

**Author:** ![TheCanadian](https://avatars.discourse-cdn.com/v4/letter/t/67e7ee/32.png) [@TheCanadian](https://forum.kirupa.com/u/TheCanadian)\
**Post date:** [June 4, 2008, 6:29am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/2 "2008-06-04T06:29:47Z")

</div>

Maybe we should have a contest or something where people can create their own custom headers and styles to match.

---

<div class="post-metadata">

**Author:** ![Anogar](https://avatars.discourse-cdn.com/v4/letter/a/ed655f/32.png) [@Anogar](https://forum.kirupa.com/u/Anogar)\
**Post date:** [June 4, 2008, 6:32am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/3 "2008-06-04T06:32:06Z")

</div>

Heh, I hates it. :-/

---

<div class="post-metadata">

**Author:** ![ajcates](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ajcates/32/2435_2.png) [@ajcates](https://forum.kirupa.com/u/ajcates)\
**Post date:** [June 5, 2008, 6:06am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/4 "2008-06-05T06:06:04Z")

</div>

Yea I think for the header contest people should have to submit a css file as well.

---

<div class="post-metadata">

**Author:** ![built\_by](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/built_by/32/1994_2.png) [@built\_by](https://forum.kirupa.com/u/built_by)\
**Post date:** [June 5, 2008, 6:14am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/5 "2008-06-05T06:14:31Z")

</div>

yeah, not a fan of the color combos.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [June 5, 2008, 6:48am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/6 "2008-06-05T06:48:40Z")

</div>

Having users submit their own CSS styles would be too complicated for users…as I found out when I tried to do that in the first iteration of this contest 🙂

New styles will be arriving shortly, and a ton more will be arriving after the contest ends.

---

<div class="post-metadata">

**Author:** ![k77](https://avatars.discourse-cdn.com/v4/letter/k/c67d28/32.png) [@k77](https://forum.kirupa.com/u/k77)\
**Post date:** [June 6, 2008, 12:34am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/7 "2008-06-06T00:34:12Z")

</div>

I find your code arrogant. Just looking at it.

Why did you turn styles off? Mario!

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [June 6, 2008, 5:10am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/8 "2008-06-06T05:10:56Z")

</div>

> [@dj\_kyron;2337353](#):
>
> The submissions for the contest are racking up big time. So you’ll be changing the CSS of the site to match the new headers right?

People will have a selection of styles to choose from, and it will only be for the forums. The site will not get the custom styles.

---

<div class="post-metadata">

**Author:** ![ajcates](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ajcates/32/2435_2.png) [@ajcates](https://forum.kirupa.com/u/ajcates)\
**Post date:** [June 6, 2008, 8:06am UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/9 "2008-06-06T08:06:56Z")

</div>

[quote=k77;2337690]I find your code arrogant. Just looking at it.

Why did you turn styles off? Mario![/quote]

That is not my code, it is kirupa’s all I did was change the colors, I did this in about 15 mins. I would have gone thur and only added important tags onto the items I changed, but I lost track of witch ones I changed, Also I would have taken out ones that just repeated them selves.

@Kirupa, you were asking that users submit a Photoshoped version of the site, not CSS. All I did was change the colors, if you go thur and pick out the parts that make up the colors for [kirupa.com](http://kirupa.com) and had them just edit those parts, it would be really easy.

---

<div class="post-metadata">

**Author:** ![hl1](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/hl1/32/849_2.png) [@hl1](https://forum.kirupa.com/u/hl1)\
**Post date:** [June 6, 2008, 12:57pm UTC](https://forum.kirupa.com/t/kirupa-forum-user-style/262212/10 "2008-06-06T12:57:38Z")

</div>

The _current theme_ is bad looking? _hides_