/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ WELCOME to /style.css . Created by Bryson Web Production, Inc. 10/17/00 Attributes specified here are tested for cross browser compatibility. COLOR and BORDER attributes may be altered to suit the purpose. NO further spacing or design attributes may be added to ANY element. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BOX LIMITERS:READ ME!! a box limiter is any container tag that specifies a 'box' in which further page elements will be contained. In reference to the stylesheet below, and to the site in general, there are 3 basic box limiters: the Parent Table: opened in header.cfm, and closed in footer.cfm width="600" ceelpadding="0" cellspacing="0" DIV.docbody width: (dynamic)100% padding: 3px all content should be nested within DIV.docbody. DIV.docbody may be opened and closed in succession, as often as necessary. DIV.highlight width: specified locally, alignment (float): specified locally (see further notes below) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ A:* colorsets may be customized Always use the same color for ACTIVE and VISITED. When creating local or sitewide navigational elements, must be used in conjunction with FONT.sitenavi, or FONT.localnavi. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ BODY { background-color: #1F0D90; } A:LINK { color : #00FF00; } A:ACTIVE { color : #FFFFFF; } A:HOVER { background-color : #000066; } A:VISITED { color : #FFCC00; } /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ HR width is dynamic (100%), and will stretch to its block limiter, size is 1px. size="1" must be specified within the
to maintain style in netscape. e.g.:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ HR { width: 100%; color: #1F0D90; height : 1px; } /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BODY specifies font family and name, and base font size. The font style is inherited wherever possible. FONT is specified alone to ensure cross browser compatibility. All text must be wrapped with . FONT.head1 is used for the displayed title in the header.cfm includes. Border attribute is currently set to "0px" It is the only FONT class with a padding-left: attribute. padding-left is "5px". this ensures proper alignment with other text elements. FONT.head2 is used to define major elements of the page, such as DIV. FONT.head3 is used for paragraph headers, within a block limiter, such as DIV. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #RED { color: #FF0000; } #GREEN { color: #00FF00; } FONT { font-family : arial, verdana, sans-serif; font-size : 16px ; line-height: 17px; margin-top: 0px; vertical-align: top; color: #ffffff; } FONT.head1 { font-size : 22px; font-weight : 900; line-height : 26px; border : solid; border-bottom-width : 0px; border-left-width : 0px; border-right-width : 0px; border-top-width : 0px; padding-left: 0px ; color: #FFCC00; } FONT.head2 { font-size : 18px; font-weight : 600; line-height : 26px; padding-left : 0px; } FONT.head3 { font-size : 15px; font-weight : 600; line-height : 18px; color: #ffffff; } FONT.head4 { font-size : 14px; font-weight : 600; line-height : 18px; } FONT.head5 { font-family : arial, verdana, sans-serif; font-size : 16px ; line-height: 17px; margin-top: 0px; vertical-align: top; color: #ff0000; } /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ DIV.docbody is a dynamic width text box (100%). It is used sitewide as the block limiter for the main content of each page. Background-color: may be altered to suit the purpose. Border: may be altered to suit the purpose. DIV.highlight is a dynamic width text box (40%). It is used sitewide as the block limiter for the highlight area(s). It may be used within or without the DIV.docbody. Background-color: may be altered to suit the purpose. Border: may be altered or removed to suit the purpose. FONT.sitenavi is used in the sitewide 'common' navigational elements. It is heavier than .localnavi. FONT.localnavi is used wherever a local navi.cfm include is used. It is the same size as the base FONT, but heavier (600). Both .sitenavi and .localnavi should only be used in conjunction with tags. FONT.fineprint is used in the DIV.highlight box limiter, footer, or anywhere legal notice or information is listed. It is the smallest of all specified font styles. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ DIV.docbody { background-color : #1F0D90; margin-bottom : 3px; margin-left : 3px; margin-right : 3px; margin-top : 0px; padding : 1px 0px 3px 0px; vertical-align : top; border: 0px solid; border-color: Black; border-style: solid; } /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ NOTES about POSITIONING the DIV.highlight element: The following local style must be ammended to the DIV tag, to allow text to flow around a right aligned DIV.highlight:
float: should always be 'right' for a right-aligned box, and vice-versa. width: should always be specified locally, since the element has no inherent width. width: may be percentage, or pixels. e.g.: When DIV.highlight is right aligned, follow this rule: open DIV.docbody open FONT open DIV.highlight ammend DIV.highlight with local STYLE="(as shown above)" add text for highlight box (use FONT.fineprint if necessary) close DIV.highlight add text that flows around left side, and below the box close FONT close DIV.docbody Notice that although DIV.highlight is positioned to the RIGHT of the regular text, it appears in the code BEFORE the left side text. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ DIV.highlight { background-color : #D5CCBB; border: 2px solid; border-color: Black; border-style: solid; padding: 6px; } FONT.sitenavi { font-size : 16px; font-weight : 600; } FONT.localnavi { font-size : 14px; font-weight : 600; } FONT.fineprint { font-size: 12px ; line-height: 16px; color: #FFFFFF; }