Welcome Guest [Log In] [Register]
Add Reply
Twilight
Topic Started: Apr 27 2015, 05:53 PM (50 Views)
Wolt
Member Avatar


Skin designed by: Shinsō
Skin created on: July 11th, 2007
Side notes by author: This skin was created for the second round of the InvisionFree Skin Zone Skin League. We were to create a skin without any gradients, and very little use of gray/black/white. This was my entry, I hope you enjoy.

Click here to preview.


Skinning & Styles » Board Wrappers » Header & Body
Quote:
 

<table class="outterboard" align="center">
  <td width="100%" class="innerboard">
<% BOARD HEADER %>
<% NAVIGATION %>
<% BOARD %>
<% STATS %>
<center>Find more skins at <a href="http://z1.invisionfree.com/forums/NumeriqueStyles">Numerique Styles</a></center>

Skinning & Styles » Manage Style Sheets » CSS
Quote:
 

html
{
overflow-x: auto;
overflow-y: auto;
}


form
{
display:inline;
}

img
{
vertical-align:middle;
border:0px;
}


/*** This section controls the main look of text, and the background behind most of the board. ***/
BODY
{
font-family: "Helvetica", Arial, sans-serif;
font-size: 11px;
color: #303441;
margin:10px 0px 10px 0px;
background-color:#626a84;
}

TABLE, TR, TD
{
font-family: "Helvetica", Arial, sans-serif;
font-size: 11px;
color: #303441;
}

/*** End section ***/

/*** This section controls the looks of links on your board. ***/
a:link, a:visited, a:active
{
text-decoration: none;
color: #fffed6;
}

a:hover
{
color: #fffed6;
text-decoration:underline;
}

/*** End section ***/

fieldset.search
{
padding:6px;
line-height:150%;
}

label
{
cursor:pointer;
}

/*** This section controls the look of attached images. ***/
img.attach
{
border:2px outset #EEF2F7;
padding:2px;
}

/*** End section ***/

.googleroot
{
padding:6px;
line-height:130%;
}

.googlechild
{
padding:6px;
margin-left:30px;
line-height:130%;
}

.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active
{
font-size:11px;
color: #3A4F6C;
}

.googlish, .googlish a:link, .googlish a:visited, .googlish a:active
{
font-size:14px;
font-weight:bold;
color:#00D;
}

.googlepagelinks
{
font-size:1.1em;
letter-spacing:1px;
}

.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited
{
font-size:10px;
color:#434951;
}



/*** This section controls the list on the Help page. ***/
li.helprow
{
padding:0px;
margin:0px 0px 10px 0px;
}

ul#help
{
padding:0px 0px 0px 15px;
}

/*** End section ***/
option.cat
{
font-weight:bold;
}

option.sub
{
font-weight:bold;
color:#555;
}


/*** This section controls the strip where the Calendar date is located. ***/
.caldate
{
text-align:right;
font-weight:bold;
font-size:11px;
border-bottom: 1px solid #545e7b;
background-color:#747f9b;
padding:4px;
margin:0px;
}

/*** End section ***/

.warngood
{
color:green;
}

.warnbad
{
color:red;
}


#padandcenter
{
margin-left:auto;
margin-right:auto;
text-align:center;
padding:14px 0px 14px 0px;
}



/*** This section controls the looks of user's names, on their profile and on the Calendar. ***/
#profilename
{
font-size:28px;
font-weight:bold;
}

#calendarname
{
font-size:11px;
}

/*** End section ***/

#photowrap
{
padding:6px;
}

#phototitle
{
font-size:24px;
border-bottom:1px solid black;
}

#photoimg
{
text-align:center;
margin-top:15px;
}



/*** This section controls the look of the User CP. ***/
#ucpmenu
{
line-height:150%;
width:22%;
border: 1px solid #1a1d27;
background-color:#747f9b;
}

#ucpmenu p
{
padding:2px 5px 6px 9px;
margin:0px;
}

#ucpcontent
{
border: 1px solid #1a1d27;
background-color:#747f9b;
line-height:150%;
width:auto;
}

#ucpcontent p
{
padding:10px;
margin:0px;
}

#ucpcontent .pformstrip, #ucpmenu .pformstrip {
background-color: #757e9b;
padding: 2px;
font-weight: normal;
color:#322c23;
border-top: 1px solid #545e7b;
border-bottom: 1px solid #545e7b;
border-left: none;
border-right: none;
}

#ucpcontent .pformleft, #ucpcontent .pformright {
border: 0px solid #545e7b;
}

#ucpcontent .tableborder {
margin: 0px auto;
width: 98%;
}

#ucpcontent td .tableborder {
border: 0px;
}

/*** End section ***/
#ipsbanner
{
position:absolute;
top:1px;
right:5%;
}


/*** This section controls the look of the boards banner. ***/
#logostrip
{
border:1px solid #545e7b;
background-color: #757e9b;
padding:0px;
margin:0px;
}

/*** End section ***/

/*** This section controls the look of the menu just below the banner. ***/
#submenu
{
border:1px solid #545e7b;
border-top: 1px solid #858eac;
border-bottom: none;
background-color: #78839f;
font-size:10px;
}

#submenu img {
display: none;
}

#navstrip img {
display: none;
}

.maintitle img {
display: none;
}

/*** End section ***/

/*** This section controls the look of the user menu, above the navigation. ***/

#userlinks
{
margin-top: -4px;
border:1px solid #545e7b;
border-top: none;
background-color: #78839f;
}

/*** End section ***/

/*** This section controls the look of the navigation strip. ***/

#navstrip
{
font-weight: normal;
}

/*** End section ***/

/*** This section controls the strip at the bottom of topics, with 'Next Oldest | Next Newest'***/

.activeuserstrip
{
background-color:#747f9b;
padding:6px;
border: 1px solid #545e7b;
border-bottom: none;
}

div.row2 {
border: 1px solid #545e7b;
border-bottom: none;
border-top: none;
}

/*** End section ***/

/*** This section controls the look of the Add Reply / New Topic pages, though the .pformstrip also controls various strips around the board. ***/

.pformstrip
{
font-weight: normal;
background-color: #757e9b;
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
color:#474c60;
padding:2px;
margin:0px;
}

.pformleft
{
background-color: #757e9b;
padding:6px;
margin-top:1px;
width:25%;
border-top:1px solid #545e7b;
border-right:1px solid #545e7b;
}

.pformleftw
{
background-color: #757e9b;
padding:6px;
margin-top:1px;
width:40%;
border-top:1px solid #545e7b;
border-right:1px solid #545e7b;
}

.pformright
{
background-color: #757e9b;
padding:6px;
margin-top:1px;
border-top:1px solid #545e7b;
}

/*** End section ***/

/*** This section controls the look of the strip at the top of topics, with the topic options. ***/

.postlinksbar
{
background-color:#747f9b;
padding:2px;
border: 1px solid #545e7b;
border-bottom: none;
}

/*** End section ***/

/*** This section controls the main color of categories, member viewing, and the Board Statistics. ***/

.row2 {
background-color: #747f9b;
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
}

.row4, .post1, .post2, .row1, .row3
{
background-color: #78839f;
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
}

div.row4 {
border: 1px solid #545e7b!important;
padding: 2px;
}

/*** End section ***/

/*** This section controls the look of various strips on the board. The .darkrow1 controls the rows between posts, and unused Calendar dates. The .darkrow2 controls the rows at the bottom of forums, and the .darkrow3 controls the strips below posts. ***/

.darkrow1
{
background-color: #6f7996;
}

div.darkrow1 {
background-color: #6f7996;
}

td.darkrow1 {
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
background-color: #6f7996;
}

.darkrow2
{
background-color: #747f9b;
}

td.darkrow2 {
font-size:1px!important;
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
}

div.darkrow2{
border: 1px solid #545e7b;
border-top: none;
}

.darkrow3
{
background-color: #747f9b;
}

td.darkrow3 {
background-color: #747f9b;
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
}

div.darkrow3 {
color:#67AE4A;
background-color: #78839f;
border: 1px solid #545e7b;
padding:2px;
padding-left:0;
padding-right:0;
border-right:0;
}

div.darkrow3 a {
border-right:1px solid #545e7b;
padding:2px;
text-align:center;
border-left:1px solid #858eac;
padding-left:6px;
padding-right:6px;
}

div.darkrow3 a:hover {
background: #858eac;
text-decoration:none;
}

/*** End section ***/

/*** This section controls the look of the Private message lists. ***/

.hlight
{
background-color: #747f9b;
}

.dlight
{
background-color: #78839f;
}

/*** End section ***/

/*** This section controls the sub-headers below category names. ***/

.titlemedium
{
font-weight: normal;
background-color: #757e9b;
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
color:#474c60;
padding:2px;
margin:0px;
}

.titlemedium a:link, .titlemedium a:visited, .titlemedium a:active
{
text-decoration: none;
color: #474c60;
}

/*** End section ***/

/*** This section controls the category titles, and headers on most pages. ***/

.maintitle
{
margin: 1px;
margin-bottom: -1px;
color: #fffed6;
background-color: #67708b;
font-weight: bold;
padding:4px 0px 4px 5px;
border-top: 2px solid #727c98;
border-left: 1px solid #727c98;
border-bottom: 1px solid #545e7b;
}

.maintitle a:link, .maintitle a:visited, .maintitle a:active
{
text-decoration: none;
color: #fffed6;
}

.maintitle a:hover
{
text-decoration: none;
}

/*** End section ***/
.plainborder
{
border:1px solid #345487;
background-color:#F5F9FD;
}

td.plainborder table {
background-color: #545e7b;
}

td.plainborder {
background-color: #6f7996;
border: 0px!important;
}

td.plainborder td.maintitle {
border-top: 2px solid #858eac;
border-left: 1px solid #858eac;
border-bottom: 0px!important;
}

/*** This section controls the border around the categories, and the borders inside them. ***/

.tableborder {
border:1px solid #1a1d27;
background-color:#545e7b;
padding:0px;
margin:0px;
width:100%
}

/*** End section ***/
.tablefill
{
border: 1px solid #545e7b;
background-color:#747f9b;
padding:6px;
}

.tablepad
{
border: 1px solid #545e7b;
background-color:#747f9b;
padding:6px;
}

.tablebasic
{
width:100%;
padding:0px 0px 0px 0px;
margin:0px;
border:0px;
}


.wrapmini
{
float:left;
line-height:1.5em;
width:25%;
}

.pagelinks
{
float:left;
line-height:1.2em;
width:35%;
}

.desc
{
font-size:11px;
color:#303441;
}

.edit
{
font-size: 9px;
}


/*** This section controls the look of text in posts, and on the members information. ***/

.signature
{
font-size: 11px;
color: #303441;
}

.postdetails
{
font-size: 11px;
}

.postcolor
{
font-size: 12px;
line-height: 160%;
}

/*** End section ***/

/*** This section controls the look of user's names on various parts of the board. ***/

.normalname
{
font-size: 12px;
font-weight: bold;
color: #fffed6;
}

.normalname a:link, .normalname a:visited, .normalname a:active
{
font-size: 12px;
}

.unreg
{
font-size: 11px;
font-weight: bold;
color: #fffed6;
}

/*** End section ***/

.searchlite
{
font-weight:bold;
color:#F00;
background-color:#FF0;
}


/*** This section controls the looks of Quotes and Code blocks. ***/

.post1 table, .post2 table {
border: 1px solid #545e7b;
background-color:#747f9b;
}

#QUOTE, #CODE
{
border: 1px solid #545e7b;
background-color:#747f9b;
padding-top: 2px;
padding-right: 2px;
padding-bottom: 2px;
padding-left: 2px;
}

/*** End section ***/

.copyright
{
font-family: Verdana, Tahoma, Arial, Sans-Serif;
font-size: 9px;
line-height: 12px;
}


/*** This sections controls the look of text feild, buttons, and so on. ***/

.codebuttons
{
color: #303441;
margin: 2px;
padding: 2px;
font-size: 11px;
font-family: verdana, helvetica, sans-serif;
vertical-align: middle;
border: 1px solid #545e7b;
background-color:#747f9b;
}

.forminput, .textinput, .radiobutton, .checkbox, textarea, div.tableborder div.tablepad input
{
color: #303441;
margin: 2px;
padding: 2px;
font-size: 11px;
font-family: verdana, helvetica, sans-serif;
vertical-align: middle;
border: 1px solid #545e7b;
background-color:#747f9b;
}

/*** End section ***/

/*** This section controls the topic buttons. ***/

.topicbtn {
font-weight: normal;
text-align:center;
vertical-align:middle;
color:#f6e8e3;
margin: 2px;
padding:3px 12px 3px 12px;
border: 1px solid #545e7b;
background-color:#747f9b;
}

/*** End section ***/

/*** This section controls the section where active members appear (in the Board Statistics). ***/

.thin
{
padding:6px 0px 6px 0px;
line-height:140%;
margin:2px 0px 2px 0px;
border-top:1px solid #545e7b;
border-bottom:1px solid #545e7b;
}

/*** End section ***/

.purple
{
color:purple;
font-weight:bold;
}

.red
{
color:red;
font-weight:bold;
}

.green
{
color:green;
font-weight:bold;
}

.blue
{
color:blue;
font-weight:bold;
}

.orange
{
color:#F90;
font-weight:bold;
}

.innerboard {
background-color: #6f7996;
padding:10px;
}

.outterboard {
border:1px solid #303441;
padding:0px;
background-color: #7984a3;
width:75%;
}

div.tableborder div.tablepad table font {
font-family: "Helvetica", Arial, sans-serif;
font-size: 11px;
color: #303441;
}

div.tableborder div.tablepad {
background-color: #747f9b!important;
}

div.tableborder div.tablepad  table {
background-color: #747f9b!important;
}

.tablefill .pformstrip {
border-top: 1px solid #1a1d27;
border-right:0px;
border-left:0px;
}

.tablefill .tableborder {
background: #757e9b;
border-right: 1px solid #1a1d27;
border-left:1px solid #1a1d27;
border-top: 1px solid #1a1d27;
}

.tablefill .pformright, .tablefill .pformleft {
border:0px
}

input.row1 {
color: #303441;
background-color: #757e9b;
}

#ipbwrapper {
background-color: #6f7996;
border: 1px solid #1a1d27;
padding: 6px;
width: 80%;
padding: 10px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px
}

#ipbwrapper td.post1, td.post2 {
border-left: none;
}

#ipbwrapper .row2 img, #ipbwrapper .maintitle img {
display: none;
}

#ipbwrapper .row4 {
border: 0px solid #1a1d27;
}

#ipbwrapper td.row2 {
border-bottom: 1px solid #545e7b;
border-top: 1px solid #1a1d27;
}

#ipbwrapper div.row2 {
border-top: 1px solid #545e7b;
}

div.desc {
background-color: #757e9b;
}

#ipbwrapper div.row2 {
border-top: 1px solid #1a1d27;
border-bottom: 1px solid #1a1d27;
}

form div.tableborder td.row1 {
border: 1px solid #1a1d27!important;
background-color:#747f9b;
}

td#ucpcontent form div.tableborder td.row1 {
background-color: #747f9b;
border: none!important;
}

table.tableborder .pformstrip {
border-top:1px solid #545e7b;
}
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Public Releases · Next Topic »
Add Reply