Customizing Arctos headers with CSS

[ copied from http://arctosblog.blogspot.com/2010/06/customizing-arctos-headers-with-css.html ]

* IMPORTANT *

You will want to try this out in TEST before moving to production!

You must coordinate loading all images with the development team, or host them on your own site.

* IMPORTANT *

To customize the header for your collection, you may simply supply the required values under Manage Collections.

To customize beyond the defaults, you’ll need to create a CSS file, coordinate loading it with the developers, and select it under STYLESHEET on the Manage Collection form.

Example: Use a dark background image for the header, and change the header links to be white for contrast.

Create a transparent-background logo approximately 100px in height. Load to Arctos (you’ll need developer assistance), and select the image in HEADER_IMAGE. Set HEADER_COLOR to “white” or it will override your image with gray.
Create a background image of height=1px less than the logo you created in (1).
Create a CSS file. (// signifies a comment below. This is not valid CSS comment syntax!)
// header_color is the ID of Arctos header
#header_color {
// this is the background image
background:url(“/images/DMNSHeaderBg2.png”) repeat-x scroll 0 0 #1C3664;
}
// change the color for the large text
.headerInstitutionText, .headerCollectionText{
color:white;
}
// and the links at the top-right
#headerLinks, #headerLinks a {
color:white;
size:small;
}
// add hover behavior to differentiate the links from text
#headerLinks a:hover {
color:red;
}