@import url(luna_core.css); /* This file inherits from luna_core.css, so styles in this file will override styles defined in it. Changes to this file will NOT be overwritten during upgrades. Here's a quick tutorial on overriding styles. Say you want to change the background colour of the body. Looking at luna_core.css, the colour is defined in the rule: body { margin: 0px; padding: 0px; color: #33332e; background: #ffffff; font: normal 11px tahoma, geneva, verdana, sans-serif; } To change the background colour of white (#ffffff) to gray (#dddddd), you would add the following to this file: body { background: #dddddd; } If you also wanted to change the font as well as the background, then you could use: body { background: #dddddd; font: normal 12px times new roman; } Also note that every template's body id is assigned the template name (without the .htm extension). So if you want to change the h2 heading in the home.htm template, you can do this by: #home h2 { color: red; font-weight: bold; } To start you off, some sample overriding styles have been provided below. Note that you will have to uncomment the rules for them to work. */ /* Logo size and image source */ /* #logo { width: 250px; height: 80px; background-image: url(images/logo.gif); } */ /* If the height of your logo changes from the original, then you will probably want to also change the vertical position of the login link */ /* #loginbar a { margin-top: 25px; } */ /* Change width of document */ /* #wrapper { width: 750px; } */ /* Don't want the shadows? */ /* .shadowtop, .shadowbottom, .shadowleft, .shadowright { background: none; } .shadowtopleft, .shadowtopright, .shadowbottomleft, .shadowbottomright { width: auto; height: auto; float: none; background: none; } */