@charset "iso-8859-1"; /******************************************************************************* * jamesrossantcom.css : 2005.02.26 * ----------------------------------------------------------------------------- * Based on the Skidoo layout by Ruthsarian with the middle column appearing first in * source ordering. *******************************************************************************/ /* begin with generic selectors so that they can be overridden if needed * by classes deeper in the stylesheet */ .clear { clear: both; } .hide { display: none; } .inside { /* glitch in IE caused by vertical padding in this class, so 0 padding is * set here and those blocks that need the vertical padding must be * applied to the parent element. the purpose of this class is to provide * horizontal padding without using hacks to get around IE's broken box * model. so it's okay to apply vertical padding to the parent element, * just not horizontal padding. */ padding: 0 1em; } html[xmlns] .mozclear { /* this selector should be valid CSS, but Opera 7.5 (and above) will pick * this up as well. Shouldn't be a problem, Opera should handle this fine, * but it's a Mozilla-targeted hack, and it should probably only affect * mozilla. You can do that by replacing the INVALID CSS selector * :root .mozclear for what's given here. */ border-bottom: 1px solid; border-color: transparent; margin-bottom: -1px; } /* margin values and font sizes for headings, and margins on paragraphs * and lists are not consistent across browser platforms. to achieve a * consistent look we need to explicity set these values here. it may * seem an odd way to declare the margins like this but you never * know what kind of horizontal padding a browser may be using on an * element, and I only want to change the vertical padding. * * pixels are used here, rather than ems, because I want a consistent * margin on the different headings. if I use ems, 1em for an h1 element * is much larger than 1em on an h6 element. I don't wnat this. * * salt to taste */ ul, ol, dl, p, h1, h2, h3, h4, h5, h6 { margin-top: 14px; margin-bottom: 14px; padding-top: 0; padding-bottom: 0; } h1 { font-size: 300%; } h2 { font-size: 250%; } h3 { font-size: 200%; } h4 { font-size: 150%; } h5 { font-size: 100%; } h6 { font-size: 70%; } /* alter some HTML elements' default style */ a, a:link, a:visited, a:active { text-decoration: none; } /* changed decoration from "underline" to "none" */ a:hover { text-decoration: none; font-weight: bold; } a img { border-width: 0; } /* added this element, on the advice of Ruthsarian -- it removes all borders around all images */ code { font-family: "Courier New", Courier, monospace; } label { cursor: pointer; } table { font-size: 100%; } td, th { vertical-align: top; } /* now we craft the core layout of the page. this includes positioning and * gutter space. colors and fonts should not come into play at this point. * when defining a border, default its color to white which is probably * the safest thing to do. */ body { padding: 20px 0; margin: 0; } #pageWrapper { border: solid 1px #fff; border-width: 0 1px; margin: 0 5%; /* set side margins here 'cause IE doesn't like it set on the body element */ min-width: 40em; /* IE doens't understand this property. I use ems rather than pixels so that the layout shouldn't break even when the browser's default size is set very large */ width: 800px; /* changed from "auto" to 750px */ } * html #pageWrapper { /* \*/ word-wrap: break-word; /* invalid CSS but keeps IE from breaking horribly under narrow viewports */ } #masthead { border: solid 1px #fff; border-width: 1px 0; padding: 0.5em; } #masthead h1 { padding: 0; margin: 0; } #outerColumnContainer { /* reserves space for the left and right columns. you can use either * padding, margins, or borders, depending on your needs. however you * can use the border method to create a background color for both left * and right columns */ border-left: solid 14em #fff; border-right: solid 14em #fff; } #innerColumnContainer { border: solid 1px #fff; border-width: 0 1px; margin: 0 -1px; /* compensate for the borders because of 100% width declaration */ width: 100%; z-index: 1; } #leftColumn, #middleColumn, #rightColumn, #SOWrap { overflow: visible; /* fix for IE italics bug */ position: relative; /* fix some rendering issues */ } #SOWrap { float: left; margin: 0 -1px 0 0; width: 100%; z-index: 3; } #middleColumn { float: right; margin: 0 0 0 -1px; width: 100%; z-index: 5; } #leftColumn { float: left; margin: 0 1px 0 -14em; width: 14em; z-index: 4; } #rightColumn { float: right; width: 14em; margin: 0 -14em 0 1px; z-index: 2; } #footer { border: solid 1px #fff; border-width: 1px 0; padding: 0.5em; } /* vertical navigation stuff. mostly exactly as seen in the vnav.css styleheet * in the original skidoo layout. */ .vnav { margin: 1em 0; } .vnav ul, .vnav ul li { margin: 0; padding: 0; list-style-type: none; display: block; } .vnav ul { border: solid 1px #fff; border-bottom-width: 0; } .vnav ul li { border-bottom: solid 1px #fff; } .vnav ul li a { display: block; text-decoration: none; padding: 2px 10px; } * html .vnav ul li a/* hide from IE5.0/Win & IE5/Mac */ { height: 0.01%; } * html .vnav ul { position: relative; /* IE needs this to fix a rendering problem */ } .vnav h3 { margin-bottom: 0; padding-bottom: 0; font-size: 126%; } /* horizontal navigation stuff. mostly exactly as seen in the hnav.css styleheet * in the original skidoo layout. */ .hnav { border-bottom: solid 1px #fff; margin: 0; padding: 3px 0 4px 0; white-space: nowrap; } .hnav ul span.divider { display: none; } * html .hnav/* Hide from IE5/Mac (& IE5.0/Win) */ { height: 0.01%; /* holly hack to fix a render bug in IE6/Win */ } * html .HNAV { height: auto; /* above IE6/Win holly hack breaks IE5/Win when page length get beyond the point that 1% height is taller than the text height. IE5/Win does not need this holly hack so we remove it here */ padding: 0; /* IE5/Win will resize #hnav to fit the heights of its inline children that have vertical padding. So this incorrect case selector will remove that padding */ } .hnav ul { text-align: center; list-style-type: none; line-height: normal; margin: 0; padding: 0; } .hnav ul li { display: inline; white-space: nowrap; margin: 0; } .hnav ul li a, .hnav ul li a:link, .hnav ul li a:visited, .hnav ul li a:active { text-decoration: none; margin: 0 -1px 0 0; padding: 3px 10px 4px 10px; border-left: solid 1px #000; border-right: solid 1px #000; } * html .HNAV ul li a { /* \*/ width: 1%; /* holly hack for IE5/Win inline padding. this hack fixes different * rendering bugs in 5.0 and 5.5. Width is used instead of height * because if the document is too long, these elements become very tall * and disrupt the look of the document. too wide an element is better, * visually, than too tall. */ } .hnav ul li a:hover { text-decoration: none; } /* below is a series of selectors to get a consistent font size across * platforms. this is outside the 'theme' section on purpose. use #pageWrapper * to set the base font-size for the layout. */ body { font-size: 100.1%; } html>body { /* Opera's default font size is typically 10% smaller than IE or Mozilla * so we correct for this here, since we're using percentages * everywhere. And we do this because pixel-based fonts don't resize * under IE/Win and percentages/ems are essentially the same, and I like * percentages for fonts. */ font-size: 110%; } body:last-child, * html body { /* of course the previous selector for Opera's fix is caught by more * than a few other browsers, so we reset that value here. */ font-size: 100.1%; } /* everything below this point is related to the page's "theme" and could be * placed in a separate stylesheet to allow for multiple color/font scemes on * the layout. you should probably leave a default theme within this stylesheet * just to be on the safe side. */ #pageWrapper, #masthead, #innerColumnContainer, #footer, .vnav ul, .vnav ul li, .hnav, .hnav ul li a { border-color: #fff; } /* removed all borders */ body { background-color: #fff; color: #000; font-family: univers, helvetica, monotype, arial, sans-serif; } body ul li a:link, ul li a:visited, ul li a:active { text-decoration: none; background-color: #fff; color: #FF3300; /* was 660000 */ } /* completely new addition */ body ul li a:hover { text-decoration: none; background-color: #CCCCCC; color: #FF0000; } /* completely new addition */ body a:link, a:visited, a:active { text-decoration: none; background-color: #fff; color: #FF3300; /* was 000033, 000066, 000099, 0000CC, 660000 */ } /* completely new addition */ body a:hover { text-decoration: none; background-color: #CCCCCC; color: #FF0000; } /* completely new addition */ #pageWrapper { font-size: 80%; /* set your default font size here. */ } #masthead { background-color: #fff; color: #999999; } /* changed background color */ .hnav { background-color: #333333; color: #fff; } /* changed background color */ #outerColumnContainer { border-left-color: #fff; /* left column background color */ border-right-color: #fff; /* right column background color */ } /* changed background color */ .vnav ul li a:link, .vnav ul li a:visited, .vnav ul li a:active { text-decoration: none; background-color: #fff; color: #000; } /* changed background color */ /* changed color */ .vnav ul li a:hover { text-decoration: none; background-color: #CCCCCC; color: #FF0000; } /* changed background color */ /* changed color */ .vnav a:link, .vnav a:visited, .vnav a:active { text-decoration: none; background-color: #fff; color: #999999; } /* completely new addition, to control links not part of