B&O
  • A simple theme that will require your own background image.
  • Side bar items are high lighted on hover, and change on visiting selecting page
  • There are changes to the way the forums layout included because i didn't like the original forum layout
  • the theme viewer here does not do a lot of themes the justice that they deserve so best go have a proper look :-)
preview.JPG

Creative Commons Attribution-ShareAlike 3.0 License

body{  background-color:white; }
 
#container{
border:5px ridge white;
width:900px;
margin-right:auto;
margin-left:auto;
margin-top:10px;
}
/* ..........navtop  ...........*/
 
#top-bar {
color: white;
background-color: black;
font-size: 110%;
text-align: center;
margin-top: 0pt;
margin-right: 0pt;
margin-bottom: 0pt;
margin-left: 0pt;
padding-top: 0.0px;
padding-right: 0pt;
padding-bottom: 0.0px;
padding-left: 0px;
position: absolute;
bottom: 0px;
left: 0px;
right: 0px;
width: 100%;}
 
#top-bar a {color: Orange;}
#top-bar ul {float: right;}
#top-bar ul li a, #top-bar ul li ul li a {
border-left-width: 2px;
border-left-color: #ffffff;
background-color: black;}
 
#top-bar ul li a:hover, #top-bar ul li ul li a:hover 
{background-color: gold;
color: black;
text-decoration: none;
}
 
/* .........HEADERStuff...........*/
 
#header {
    border-bottom: 1px solid #888;
    height:117px;
background-image: url(http://bhgc.wikidot.com/local--files/start/phil_banner.jpg);
}
 
#header h1{
 color:red;
    font-size: 220%;
           padding: 0.5em 0 0 0.5em;
    font-family: arial,helvetica,sans-serif;
    font-weight: bold;
 
}
#header h2{
    font-size: 150%;
    font-weight: bold;
    padding: 0 0 0 2em;
    font-family: arial,helvetica,sans-serif;
color:white;
 
}
/* ..........login and search ...........*/
 
#login-status{    right: 5em;}
 
/* ..........fiddly bits...........*/
 
.printuser{color: gold;}
#header h1 a{color: Orange;}
 
/* ##### Main Copy ##### */
 
#main-content {
  color: black;
  background-color: white;
  text-align: justify;
  /*line-height: 1.5em;*/
  margin: 5px;
  padding: 0.5ex 4em 1em 16em;
  border-left: 1px solid rgb(216,210,195);
}
 
#main-content p{line-height: 1.4em;}
 
#content-wrap{
    min-height: 0; /* fixes ie7 peekaboo bug */
    _height: 0; /* fixes ie6 peekaboo bug */
}
 
#page-title{
    margin: 0em 0 0.5em 0;
    font-size: 200%;    
    border: none;
    font-weight: bold;
 color: rgb(166,140,83)}
 
#main-content h1 {
  color: rgb(166,140,83);
  background-color: transparent;
  font-family: arial, verdana, helvetica, sans-serif;
  font-size: 175%;
  font-weight: bold;
  font-style: italic;
  text-align: left;
  margin: 0.5em 0 0.5em 0;
  padding: 1em 0 0 0;
  border-top: 1px solid rgb(216,210,195);
}
 
#main-content h2 {
     font-family: arial, verdana, helvetica, sans-serif;
     font-weight: bold;
      font-style: italic;
    color: rgb(166,140,83);
}
 
#main-content h3 {
     font-family: arial, verdana, helvetica, sans-serif;
     font-weight: bold;
    color: rgb(180,150,93);
}
 
 a {
  color: #7e5223;
  background-color: transparent;
  text-decoration: underline;
}
 
a:hover {
  text-decoration: none;
  background-color: transparent;
}
 
p {
  margin: 1em 0 1.5em 0;
  padding: 0;
}
 
dt {
  font-weight: bold;
  margin: 0;
  padding: 0 0 0.5ex 0;
}
 
dd {
  margin: 0 0 1.5em 1.5em;
  padding: 0;
}
 
/* ##### side bar ##### */
#side-bar{
        color: white;
    width: 15em;
    padding: 5px ;
    background-color: black;
    border-right: 1px solid #ACBF60;
    margin:5px;
}
 
#side-bar h1, #side-bar h2, #side-bar h3{
    text-align: center;
color: Orange;
}
 
#side-bar ul{
    display: block;
    padding: 0;
    margin: 0;
    list-style: none;
}
#side-bar ul li{display:block;}
 
#side-bar li a {
    padding-top: 2px;
    padding-bottom: 2px;
    display: block;
    padding-left: 1em;
    border-bottom: 1px solid #D9DDCF;
    color: white;
    text-decoration: none;
}
#side-bar li a:hover {
    background-color: gold;
    color: black;
}
 
#side-bar p {
    padding: 5px;
    margin: 0px;
    margin-bottom: 3px;
    margin: 0px;
}
pre {word-wrap:break-word;}
 
#side-bar a{color: white;}
#side-bar a:hover{color: LawnGreen }
#side-bar a:visited {color: BlueViolet }
  • This was the very first theme i did. I had no idea about vss when i did it, so you will probably look at the code and say "wtf!" :-)
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License