Signs CSS Skin

Barry · Aug 13, 2007

Hi

Here is a different skin for the signs page. The main change is all the text is now in Arial, I find it easier to read than Verdana, hence the change. If you would like to use the skin, please note you need to be registered. Then just log in, click "settings" in the main menu at the top of the page, and paste the code over the existing code in the css box, then click "edit". If you want to change back, just click "reset to default".

----------------------copy below this line:

body {
color: #000000;
background-color: #ffffff;
font-family: Arial, Verdana, Helvetica sans-serif;
font-size: 85%;
padding: 3px;
overflow-x: hidden;
}
#header {
position: absolute;
width: 100%;
top: 0;
left: 0;
}
#left {
position: absolute;
left: 1%;
top: 5px;
width: 18%;
}
#middle {
position: absolute;
left: 20%;
top: 35px;
width: 58%;
padding: 10px;
}
#middle a:hover {
color: black;
}
#middle p a, p a visited {
font-size: 100%;
text-decoration: underline;
}
#right {
position: absolute;
left: 81%;
top: 22px;
width: 18%;
}
#new_message {
color: #480000;
font-weight: bold
}
@media print {
div#left,div#right,div#header { display:none;}
div .box {border:none;}
div#middle {width: 99%; left:0; top 0;}
}
#main-menu {
padding-top: 1px;
}
#main-menu a,a:visited {
text-decoration: none;
padding-left: 5px;
padding-right: 5px;
}
#main-menu a:hover {
background: #FFFFFF;
text-decoration: none;
padding-left: 5px;
padding-right: 5px;
}

#left-content {
padding: 5px;
border: 1px solid #E6C0AE;
}
a, a visited {
color: #6C0000;
text-decoration: none;
font-size: 85%;
}
a:hover {
color: black;
}
#right-content {
padding: 5px;
border: 1px solid #E6C0AE;
}
#right-content a, a:visited {
color: #6C0000;
text-decoration: none;
}
#left-content a, a:visited {
color: #6C0000;
text-decoration: none;
}

#left-content a:hover{
color: black;
background: #ffffff;
text-decoration: none;
}
#right-content a:hover {
color: black;
background: #ffffff;
text-decoration: none;
}

h1,h2,h3,h4 {
color: #480000;
}
img {
padding-right: 5px;
}

/*************************************/
/*************************************/
/* Backwards compatibility stuff */
/*************************************/
/*************************************/
.Flashback {
background:#FFDBE5;
border: 1px solid #FEB2C8;
-moz-border-radius: 2px;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
padding: 2px;
}
.StorySource {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #990000;
background-color: #F8FCFF;
border: 1px solid #CCCCCC;
-moz-border-radius: 2px;
padding:6px;
}
.StorySummary {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 13px;
color: #480000;
padding: 10px;
}
.StoryLink a {
font-size: 14px;
color: #480000;
text-decoration: none;
border-bottom: none;
font-weight: bold;
padding: 2px;

}
.StoryLink a:hover {
font-size: 14px;
color: #0C4040;
background-color: white;
text-decoration: none;
font-weight: bold;
border-bottom: none;
}
.StoryLink {
font-family: Arial, Verdana, Helvetica, sans-serif;
color: #480000;
font-weight:bold;
font-size: 14px;
padding:2px;
}
.StoryText {
text-align: left;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 13px;
color: #333333;
padding: 10px;
}

.StoryText a,a:visited {
color: #634130;
padding-left: 2px;
padding-right: 2px;
}
.StoryText a:hover {
color: #0C4040;
background-color: white;
border-bottom: none;
padding-left: 2px;
padding-right: 2px;
}

.StoryComment {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #990000;
background-color: #EFF6FB;
border: 1px solid #999999;
-moz-border-radius: 4px;
padding: 5px;
}
.StoryComment a:hover {
color: black;
background-color: #EFF6FB;
}

.box a, a visited {
color: #480000;
text-decoration: none;
border-bottom: none;
}
.editorialBox a, a visited {
color: #480000;
font-size: 12px;
text-decoration: none;
font-weight:bold;
border-bottom: none;
}
.editorialBox a:hover {
font-size: 12px;
color: #480000;
background-color: #E9F7DB;
border-bottom: none;
}

.editorialBox {
border: 1px dashed #C3D2AB;
padding: 3px;
}

.storyBox a, a visited {
color: #AB795A;
font-size: 12px;
text-decoration: none;
background-color: #ffffff;
font-weight:bold;
border-bottom: none;
}
.storyBox a:hover {
font-size: 12px;
color: #FF9900;
background-color: #E9F7DB;
border-bottom: none;
}

.box {
border: 1px solid #CCCCCC;
padding: 3px;
}

.BoldGrey {
font-weight: bold;
color: #333333;
}

.BoldRed {
font-weight: bold;
color: #AD0000;
}
.list-odd {
font-size: 105%;
background-color: #F8F3E7;
border: 2px solid #CCCCCC;
}
.list-even {
font-size: 105%;
background-color: #ffffff;
border: 2px solid #CCCCC;
}
.list-odd a, a:visited {
text-decoration: none;
}
.list-even a, a:visited {
text-decoration: none;
}
.list-odd a:hover {
text-decoration: none;
color: black;
background-color: #FFF4EA;
}
.list-even a:hover {
text-decoration: none;
background-color: #ffffff;
}
#user_menu {
background: #FFFFC0;
border: 1px solid #FFF4EA;
}
#user_menu a, a:visited {
text-decoration: none;
}
#user_menu a:hover {
color: black;
background: #CB6767;
text-decoration: none;
}
#tags,input,textarea {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 13px;
color: #274D74;
background-color: #EFF6FB;
border: 1px solid #BCD8EB;
-moz-border-radius: 4px;
padding: 5px;
}
#tags,select {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #274D74;
background-color: #EFF6FB;
border: 1px solid #BCD8EB;
-moz-border-radius: 4px;
padding-left: 5px;
padding-right: 1px;
padding-top: 5px;
padding-bottom: 5px;
}
input.submitButton {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #480000;
background-color: #EFF6FB;
border: 3px solid #BCD8EB;
-moz-border-radius: 4px;
padding: 5px;
}
input.submitButtonSearch {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #48000;
background-color: #EFF6FB;
border: 3px solid #FF9900;
-moz-border-radius: 4px;
padding: 2px;
}
input.ed_button {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #202020;
background-color: #DCDCDC;
border: 2px solid #A0A0A0;
-moz-border-radius: 3px;
padding: 2px;
}
#tags a,a:visited {
text-decoration: none;
}
#tags a:hover {
background-color: #EFF6FB;
text-decoration: underline;
}
td {
padding: 3px;
}
label {
font-weight: bold;
}
.comment {
background-color: #f3f8ff;
}
.comment-title, .comment-title a, .comment-title a:visited{
background-color: #480000;
color: white;
}

.comment-body {
background-color: #FFE6E6;
border: 1px solid #3A66A7;
}
td.table-head {
color: #303030;
font-weight: bolder;
font-size: 120%;
border-bottom: 1px solid #202020;
}
td.table-head a {
color: #303030;
font-weight: bolder;
font-size: 105%;
text-decoration: none;
}
td.table-head a:hover {
color: black;
background-color: white;
}
td.chain-head {
color: #980000;
font-size: 100%;
font-weight: bolder;
border-bottom: 1px solid #616161;
}
td.chain-head a {
color: #980000;
font-size: 100%;
text-decoration: none;
}
td.chain-head a:hover {
color: black;
background-color: white;
}
.highlight {
background-color: yellow;
}
.highlight a:hover {
color: black;
background-color: yellow;
}
td.highlight {
border:1px solid orange;
background: yellow;
}
td.highlight a:hover {
color: black;
background: yellow;
}
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
#search {
width: 200px;
font-size: 90%;
}
#messages_menu {
background-color: #f3f8ff;
}
#messages_menu a:hover {
color: black;
background-color: #f3f8ff;
}
.message-unread {
font-weight: bolder;
}
.tiny {
font-size: 70%;
}
.caption {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 90%;
font-weight: bold;
color: #222222;
}
.vote a:hover {
color: black;
background-color: white;
}
.hometxt a:hover {
color: black;
background-color: white;
}
.smalltext {
font-size: 75%;
}

-----------------copy above this line.

dantem · Aug 13, 2007

Barry said:
... If you want to change back, just click "reset to default".

----------------------copy below this line:

body {
color: #000000;
background-color: #ffffff;
font-family: Arial, Verdana, Helvetica sans-serif;
font-size: 85%;
padding: 3px;
overflow-x: hidden;
}

That's cool!

Put "Futura" after "font-family:" and "100%" after "font-size:",
I think I'll keep it up for awhile ;-)

Zadius Sky · Aug 14, 2007

That is really sweet skin. I like it. Does it come in green?

Craig · Aug 14, 2007

Nice, thanks! The ol' peepers seem to like those darker borders better around each section.

Signs CSS Skin

Barry

Padawan Learner

dantem

The Living Force

Zadius Sky

The Living Force

Craig

Jedi Master

Trending content