diff options
39 files changed, 57244 insertions, 0 deletions
@@ -0,0 +1,19 @@ +Copyright (C) 2007 J-M Bell + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + + * The above copyright notice and this permission notice shall be included in + all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..1de428e --- /dev/null +++ b/Makefile @@ -0,0 +1,44 @@ +# Toolchain definitions for building on the destination platform +CC := gcc +AR := ar +LD := gcc + +CP := cp +RM := rm +MKDIR := mkdir +MV := mv +ECHO := echo +MAKE := make +PERL := perl +PKGCONFIG := pkg-config +INSTALL := install +SED := sed +LCOV := lcov +GENHTML := genhtml + +# Toolchain flags +WARNFLAGS := -Wall -Wextra -Wundef -Wpointer-arith -Wcast-align \ + -Wwrite-strings -Wstrict-prototypes -Wmissing-prototypes \ + -Wmissing-declarations -Wnested-externs -Werror -pedantic +CFLAGS += -std=c99 -D_BSD_SOURCE -I$(TOP)/include/ $(WARNFLAGS) \ + `$(PKGCONFIG) --cflags libparserutils` +RELEASECFLAGS = $(CFLAGS) -DNDEBUG -O2 +DEBUGCFLAGS = $(CFLAGS) -O0 -g +ARFLAGS := -cru +LDFLAGS += `$(PKGCONFIG) --libs libparserutils` -L$(TOP)/ + +CPFLAGS := +RMFLAGS := -f +MKDIRFLAGS := -p +MVFLAGS := +ECHOFLAGS := +MAKEFLAGS := +PKGCONFIGFLAGS := + +EXEEXT := + +# Default installation prefix +PREFIX ?= /usr/local + + +include build/Makefile.common diff --git a/Makefile-riscos b/Makefile-riscos new file mode 100644 index 0000000..77a5977 --- /dev/null +++ b/Makefile-riscos @@ -0,0 +1,46 @@ +# Toolchain definitions for building for RISC OS using the GCCSDK cross-compiler +GCCSDK_INSTALL_CROSSBIN ?= /home/riscos/cross/bin +GCCSDK_INSTALL_ENV ?= /home/riscos/env + +CC := $(GCCSDK_INSTALL_CROSSBIN)/gcc +AR := $(GCCSDK_INSTALL_CROSSBIN)/ar +LD := $(GCCSDK_INSTALL_CROSSBIN)/gcc + +CP := cp +RM := rm +MKDIR := mkdir +MV := mv +ECHO := echo +MAKE := make +PERL := perl +PKGCONFIG := pkg-config +INSTALL := install +SED := sed +LCOV := echo +GENHTML := echo + +# Toolchain flags +WARNFLAGS := -Wall -Wextra -Wundef -Wpointer-arith -Wcast-align \ + -Wwrite-strings -Wstrict-prototypes -Wmissing-prototypes \ + -Wmissing-declarations -Wnested-externs -Werror -pedantic +CFLAGS += -std=c99 -D_BSD_SOURCE -I$(TOP)/include/ $(WARNFLAGS) \ + -mpoke-function-name `$(PKGCONFIG) --cflags libparserutils` +RELEASECFLAGS = $(CFLAGS) -DNDEBUG -O2 +DEBUGCFLAGS = $(CFLAGS) -O0 -g +ARFLAGS := -cru +LDFLAGS += `$(PKGCONFIG) --libs libparserutils` -L$(TOP)/ + +CPFLAGS := +RMFLAGS := -f +MKDIRFLAGS := -p +MVFLAGS := +ECHOFLAGS := +MAKEFLAGS := +PKGCONFIGFLAGS := + +EXEEXT := ,ff8 + +# Default installation prefix +PREFIX ?= $(GCCSDK_INSTALL_ENV) + +include build/Makefile.common @@ -0,0 +1,45 @@ +LibCSS -- a CSS parser and selection engine +=========================================== + +Overview +-------- + + LibCSS is a CSS parser and selection engine. It aims to parse the forward + compatible CSS grammar. + +Requirements +------------ + + LibCSS requires the following tools: + + + A C99 capable C compiler + + GNU make or compatible + + Perl (for the testcases) + + Pkg-config (for the testcases) + + LibCSS also requires the following libraries to be installed: + + + LibParserUtils + +Compilation +----------- + + If necessary, modify the toolchain settings in the Makefile. + Invoke make: + $ make + +Verification +------------ + + To verify that the parser is working, it is necessary to specify a + different makefile target than that used for normal compilation, thus: + + $ make test + +API documentation +----------------- + + Currently, there is none. However, the code is well commented and the + public API may be found in the "include" directory. The testcase sources + may also be of use in working out how to use it. + diff --git a/build/Makefile.common b/build/Makefile.common new file mode 100644 index 0000000..2e320e6 --- /dev/null +++ b/build/Makefile.common @@ -0,0 +1,119 @@ +# Top-level Makefile fragment + +# Default target +all: release + +# Name of component +COMPONENT := libcss + +# Environment +EXPORT := $(CURDIR)/dist +TOP := $(CURDIR) +RELEASEDIR := build/Release +DEBUGDIR := build/Debug +COVERAGEDIR := build/coverage + +# List of items to delete on clean +ITEMS_CLEAN := +# List of items to delete on distclean +ITEMS_DISTCLEAN := + +# List of targets to run for testing +TARGET_TESTS := + +# Source files +SOURCES := + +# Include Makefile fragments in subdirectories + +define do_include +DIR := $$(dir $(1)) +include $(1) + +endef + +MAKE_INCLUDES := $(wildcard */Makefile) +$(eval $(foreach INC, $(MAKE_INCLUDES), $(call do_include,$(INC)))) + +# Calculate objects to build +OBJECTS := $(subst /,_,$(subst .c,.o,$(SOURCES))) + +.PHONY: release debug test coverage profile \ + clean distclean setup export install uninstall + +# Rules +release: setup $(addprefix $(RELEASEDIR)/,$(OBJECTS)) + @$(AR) $(ARFLAGS) $(COMPONENT).a $(RELEASEDIR)/* + +debug: setup $(addprefix $(DEBUGDIR)/,$(OBJECTS)) + @$(AR) $(ARFLAGS) $(COMPONENT)-debug.a $(DEBUGDIR)/* + +test: debug $(TARGET_TESTS) + +coverage: clean + @$(LCOV) --directory . --zerocounters + @$(MAKE) test CFLAGS="$(CFLAGS) -fprofile-arcs -ftest-coverage" \ + LDFLAGS="$(LDFLAGS) -lgcov" + @$(LCOV) --directory $(DEBUGDIR) --base-directory $(TOP) \ + --capture --output-file $(COVERAGEDIR)/$(COMPONENT)_tmp.info + @$(LCOV) --extract $(COVERAGEDIR)/$(COMPONENT)_tmp.info "$(TOP)/src*" \ + -o $(COVERAGEDIR)/$(COMPONENT).info + @$(RM) $(RMFLAGS) $(COVERAGEDIR)/$(COMPONENT)_tmp.info + @$(GENHTML) -o $(COVERAGEDIR) --num-spaces 2 \ + $(COVERAGEDIR)/$(COMPONENT).info + +profile: clean + @$(MAKE) test CFLAGS="$(CFLAGS) -pg" LDFLAGS="-pg $(LDFLAGS)" + +clean: + -@$(RM) $(RMFLAGS) $(ITEMS_CLEAN) + -@$(RM) $(RMFLAGS) gmon.out + -@$(RM) $(RMFLAGS) -r $(COVERAGEDIR) + -@$(RM) $(RMFLAGS) -r $(RELEASEDIR) + -@$(RM) $(RMFLAGS) -r $(DEBUGDIR) + -@$(RM) $(RMFLAGS) $(COMPONENT).a + -@$(RM) $(RMFLAGS) $(COMPONENT)-debug.a + -@$(RM) $(RMFLAGS) $(COMPONENT).pc + +distclean: clean + -@$(RM) $(RMFLAGS) $(ITEMS_DISTCLEAN) + -@$(RM) $(RMFLAGS) -r $(TOP)/dist + +setup: + @$(MKDIR) $(MKDIRFLAGS) $(RELEASEDIR) + @$(MKDIR) $(MKDIRFLAGS) $(DEBUGDIR) + @$(MKDIR) $(MKDIRFLAGS) $(COVERAGEDIR) + +export: release + @$(MKDIR) $(MKDIRFLAGS) $(TOP)/dist/lib + @$(CP) $(CPFLAGS) -r include $(EXPORT)/ + @${CP} ${CPFLAGS} $(COMPONENT).a ${EXPORT}/lib/ + +install: release + @$(MKDIR) $(MKDIRFLAGS) -p $(PREFIX)/lib/pkgconfig + @$(MKDIR) $(MKDIRFLAGS) -p $(PREFIX)/include/libcss + @$(SED) -e 's#PREFIX#$(PREFIX)#' $(COMPONENT).pc.in >$(COMPONENT).pc + @$(INSTALL) --mode=644 -t $(PREFIX)/lib $(COMPONENT).a + @$(INSTALL) --mode=644 -t $(PREFIX)/lib/pkgconfig $(COMPONENT).pc + @$(INSTALL) --mode=644 -t $(PREFIX)/include/libcss $(filter %.h, $(wildcard include/libcss/*)) + +uninstall: + @$(RM) $(RMFLAGS) $(PREFIX)/lib/$(COMPONENT).a + @$(RM) $(RMFLAGS) $(PREFIX)/lib/pkgconfig/$(COMPONENT).pc + @$(RM) $(RMFLAGS) -r $(PREFIX)/include/libcss + +# Finally, build rules for compilation +define do_compile +$$(RELEASEDIR)/$(2): $(1) + @$$(ECHO) $$(ECHOFLAGS) "==> $(1)" + @$$(CC) -c $$(RELEASECFLAGS) -o $$@ $(1) + +$$(DEBUGDIR)/$(2): $(1) + @$$(ECHO) $$(ECHOFLAGS) "==> $(1)" + @$$(CC) -c $$(DEBUGCFLAGS) -o $$@ $(1) + +endef + +$(eval $(foreach SOURCE,$(filter %.c,$(SOURCES)), \ + $(call do_compile,$(SOURCE),$(subst /,_,$(SOURCE:.c=.o))))) + diff --git a/docs/Lexer b/docs/Lexer new file mode 100644 index 0000000..8f8e1ea --- /dev/null +++ b/docs/Lexer @@ -0,0 +1,30 @@ +Lexical analyser +================ + +This document contains various snippets of information about the lexer +implementation. + +First sets +---------- + +IDENT [a-zA-Z] | '-' | '_' | [^#x0-#x7F] | '\' +ATKEYWORD '@' +STRING '"' | "'" +HASH '#' +NUMBER [0-9] | '.' +PERCENTAGE [0-9] | '.' +DIMENSION [0-9] | '.' +URI [Uu] +UNICODE-RANGE [Uu] +CDO '<' +CDC '-' +S #x9 | #xA | #xC | #xD | #x20 +COMMENT '/' +FUNCTION [a-zA-Z] | '-' | '_' | [^#x0-#x7F] | '\' +INCLUDES '~' +DASHMATCH '|' +PREFIXMATCH '^' +SUFFIXMATCH '$' +SUBSTRINGMATCH '*' +CHAR anything except " or ' + diff --git a/docs/Tokens b/docs/Tokens new file mode 100644 index 0000000..21e09da --- /dev/null +++ b/docs/Tokens @@ -0,0 +1,65 @@ +Production rules for lexical tokens +=================================== + +This file provides a complete set of production rules for the tokens generated +by the lexer. In case of ambiguity, the longest match wins. + +Components +---------- + +ident ::= '-'? nmstart nmchar* +name ::= nmchar+ +nmstart ::= [a-zA-Z] | '_' | nonascii | escape +nonascii ::= [#x80-#xD7FF#xE000-#xFFFD#x10000-#x10FFFF] +unicode ::= '\' [0-9a-fA-F]{1,6} wc? +escape ::= unicode | '\' [^\n\r\f0-9a-fA-F] +nmchar ::= [a-zA-Z0-9] | '-' | '_' | nonascii | escape +num ::= [0-9]+ | [0-9]* '.' [0-9]+ +string ::= '"' (stringchar | "'")* '"' | "'" (stringchar | '"')* "'" +stringchar ::= urlchar | #x20 | #x29 | '\' nl +urlchar ::= [#x9#x21#x23-#x26#x28#x2A-#x7E] | nonascii | escape +nl ::= #xA | #xD #xA | #xD | #xC +w ::= wc* +wc ::= #x9 | #xA | #xC | #xD | #x20 + +Tokens +------ + +IDENT ::= ident +ATKEYWORD ::= '@' ident +STRING ::= string +HASH ::= '#' name +NUMBER ::= num +PERCENTAGE ::= num '%' +DIMENSION ::= num ident +URI ::= "url(" w (string | urlchar*) w ')' +UNICODE-RANGE ::= [Uu] '+' [0-9a-fA-F?]{1,6} ('-' [0-9a-fA-F]{1,6})? +CDO ::= "<!--" +CDC ::= "-->" +S ::= wc+ +COMMENT ::= "/*" [^*]* '*'+ ([^/] [^*]* '*'+) '/' +FUNCTION ::= ident '(' +INCLUDES ::= "~=" +DASHMATCH ::= "|=" +PREFIXMATCH ::= "^=" +SUFFIXMATCH ::= "$=" +SUBSTRINGMATCH ::= "*=" +CHAR ::= any other character, except " or ' + +Differences from the CSS3 Syntax module specification +----------------------------------------------------- + +1) UNICODE-RANGE is case insensitive (it's uppercase only in the spec) +2) escape follows CSS2.1. CSS3 defines it as: + escape ::= unicode | '\' [#x20-#x7E#x80-#xD7FF#xE000-#xFFFD#x10000-#x10FFFF] +3) urlchar omits ' and ): + a) If ' is permitted verbatim then, as stringchar inherits from urlchar, + single quoted strings may contain verbatim single quotes. This is + clearly nonsense. + b) If ) is permitted verbatim then it becomes impossible to determine the + true end of URI. Thus, for sanity's sake, it's omitted here. +4) stringchar explicitly includes ). See 3(b) for why it won't inherit it + from urlchar as the spec implies. +5) BOM ::= #xFEFF is omitted. It is assumed that any leading BOM will be + stripped from the document before lexing occurs. + diff --git a/include/libcss/errors.h b/include/libcss/errors.h new file mode 100644 index 0000000..f7eeba2 --- /dev/null +++ b/include/libcss/errors.h @@ -0,0 +1,31 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_errors_h_ +#define css_errors_h_ + +#include <stddef.h> + +typedef enum css_error { + CSS_OK = 0, + + CSS_NOMEM = 1, + CSS_BADPARM = 2, + CSS_INVALID = 3, + CSS_FILENOTFOUND = 4, + CSS_NEEDDATA = 5, + CSS_BADCHARSET = 6, + CSS_EOF = 7, +} css_error; + +/* Convert a libcss error value to a string */ +const char *css_error_to_string(css_error error); +/* Convert a string to a libcss error value */ +css_error css_error_from_string(const char *str, size_t len); + +#endif + diff --git a/include/libcss/functypes.h b/include/libcss/functypes.h new file mode 100644 index 0000000..22a48bf --- /dev/null +++ b/include/libcss/functypes.h @@ -0,0 +1,27 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007-8 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_functypes_h_ +#define css_functypes_h_ + +#include <stdbool.h> +#include <stdint.h> +#include <stdlib.h> + +#include <libcss/types.h> + +/* Type of allocation function for libcss */ +typedef void *(*css_alloc)(void *ptr, size_t size, void *pw); + +/** + * Type of parse error handling function + */ +typedef void (*css_error_handler)(uint32_t line, uint32_t col, + const char *message, void *pw); + +#endif + diff --git a/include/libcss/libcss.h b/include/libcss/libcss.h new file mode 100644 index 0000000..364a3eb --- /dev/null +++ b/include/libcss/libcss.h @@ -0,0 +1,23 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_h_ +#define css_h_ + +#include <libcss/errors.h> +#include <libcss/functypes.h> +#include <libcss/types.h> + +/* Initialise the CSS library for use */ +css_error css_initialise(const char *aliases_file, + css_alloc alloc, void *pw); + +/* Clean up after LibCSS */ +css_error css_finalise(css_alloc alloc, void *pw); + +#endif + diff --git a/include/libcss/types.h b/include/libcss/types.h new file mode 100644 index 0000000..b3e18dc --- /dev/null +++ b/include/libcss/types.h @@ -0,0 +1,33 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_types_h_ +#define css_types_h_ + +#include <stdbool.h> +#include <inttypes.h> + +/** Source of charset information, in order of importance + * A client-dictated charset will override all others. + * A document-specified charset will override autodetection or the default */ +typedef enum css_charset_source { + CSS_CHARSET_DEFAULT = 0, /**< Default setting */ + CSS_CHARSET_REFERRED = 1, /**< From referring document */ + CSS_CHARSET_METADATA = 2, /**< From linking metadata */ + CSS_CHARSET_DOCUMENT = 3, /**< Defined in document */ + CSS_CHARSET_DICTATED = 4, /**< Dictated by client */ +} css_charset_source; + +/** + * String type + */ +typedef struct css_string { + uint8_t *ptr; /**< Pointer to data */ + size_t len; /**< Byte length of string */ +} css_string; + +#endif diff --git a/libcss.pc.in b/libcss.pc.in new file mode 100644 index 0000000..fc45a57 --- /dev/null +++ b/libcss.pc.in @@ -0,0 +1,10 @@ +prefix=PREFIX +exec_prefix=${prefix} +libdir=${exec_prefix}/lib +includedir=${prefix}/include + +Name: libcss +Description: CSS parsing and selection library +Version: 0.0.1 +Libs: -L${libdir} -lcharset -lcss +Cflags: -I${includedir} diff --git a/src/Makefile b/src/Makefile new file mode 100644 index 0000000..f56a87f --- /dev/null +++ b/src/Makefile @@ -0,0 +1,49 @@ +# Child makefile fragment +# +# Toolchain is provided by top-level makefile +# +# Variables provided by top-level makefile +# +# COMPONENT The name of the component +# EXPORT The location of the export directory +# TOP The location of the source tree root +# RELEASEDIR The place to put release objects +# DEBUGDIR The place to put debug objects +# +# do_include Canned command sequence to include a child makefile +# +# Variables provided by parent makefile: +# +# DIR The name of the directory we're in, relative to $(TOP) +# +# Variables we can manipulate: +# +# ITEMS_CLEAN The list of items to remove for "make clean" +# ITEMS_DISTCLEAN The list of items to remove for "make distclean" +# TARGET_TESTS The list of target names to run for "make test" +# +# SOURCES The list of sources to build for $(COMPONENT) +# +# Plus anything from the toolchain + +# Push parent directory onto the directory stack +sp := $(sp).x +dirstack_$(sp) := $(d) +d := $(DIR) + +# Manipulate include paths +CFLAGS := $(CFLAGS) -I$(d) + +# Sources +SRCS_$(d) := libcss.c + +# Append to sources for component +SOURCES += $(addprefix $(d), $(SRCS_$(d))) + +# Now include any children we may have +MAKE_INCLUDES := $(wildcard $(d)*/Makefile) +$(eval $(foreach INC, $(MAKE_INCLUDES), $(call do_include,$(INC)))) + +# Finally, pop off the directory stack +d := $(dirstack_$(sp)) +sp := $(basename $(sp)) diff --git a/src/charset/Makefile b/src/charset/Makefile new file mode 100644 index 0000000..dda58c1 --- /dev/null +++ b/src/charset/Makefile @@ -0,0 +1,46 @@ +# Child makefile fragment +# +# Toolchain is provided by top-level makefile +# +# Variables provided by top-level makefile +# +# COMPONENT The name of the component +# EXPORT The location of the export directory +# TOP The location of the source tree root +# RELEASEDIR The place to put release objects +# DEBUGDIR The place to put debug objects +# +# do_include Canned command sequence to include a child makefile +# +# Variables provided by parent makefile: +# +# DIR The name of the directory we're in, relative to $(TOP) +# +# Variables we can manipulate: +# +# ITEMS_CLEAN The list of items to remove for "make clean" +# ITEMS_DISTCLEAN The list of items to remove for "make distclean" +# TARGET_TESTS The list of target names to run for "make test" +# +# SOURCES The list of sources to build for $(COMPONENT) +# +# Plus anything from the toolchain + +# Push parent directory onto the directory stack +sp := $(sp).x +dirstack_$(sp) := $(d) +d := $(DIR) + +# Sources +SRCS_$(d) := detect.c + +# Append to sources for component +SOURCES += $(addprefix $(d), $(SRCS_$(d))) + +# Now include any children we may have +MAKE_INCLUDES := $(wildcard $(d)*/Makefile) +$(eval $(foreach INC, $(MAKE_INCLUDES), $(call do_include,$(INC)))) + +# Finally, pop off the directory stack +d := $(dirstack_$(sp)) +sp := $(basename $(sp)) diff --git a/src/charset/detect.c b/src/charset/detect.c new file mode 100644 index 0000000..11ee699 --- /dev/null +++ b/src/charset/detect.c @@ -0,0 +1,161 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2008 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#include <stdbool.h> +#include <string.h> + +#include <parserutils/charset/mibenum.h> + +#include "charset/detect.h" +#include "utils/utils.h" + +static parserutils_error css_charset_read_bom_or_charset(const uint8_t *data, + size_t len, uint16_t *mibenum); + +/** + * Extract a charset from a chunk of data + * + * \param data Pointer to buffer containing data + * \param len Buffer length + * \param mibenum Pointer to location containing current MIB enum + * \param source Pointer to location containing current charset source + * \return PARSERUTILS_OK on success, appropriate error otherwise + * + * ::mibenum and ::source will be updated on exit + * + * CSS 2.1 $4.4 + */ +parserutils_error css_charset_extract(const uint8_t *data, size_t len, + uint16_t *mibenum, uint32_t *source) +{ + css_error error; + uint16_t charset = 0; + + if (data == NULL || mibenum == NULL || source == NULL) + return PARSERUTILS_BADPARM; + + /* If the charset was dictated by the client, we've nothing to detect */ + if (*source == CSS_CHARSET_DICTATED) + return PARSERUTILS_OK; + + /* We need at least 4 bytes of data */ + if (len < 4) + goto default_encoding; + + /* Look for a BOM and/or @charset */ + error = css_charset_read_bom_or_charset(data, len, &charset); + if (error != PARSERUTILS_OK) + return error; + + if (charset != 0) { + *mibenum = charset; + *source = CSS_CHARSET_DOCUMENT; + + return PARSERUTILS_OK; + } + + /* If we've already got a charset from the linking mechanism or + * referring document, then we've nothing further to do */ + if (*source != CSS_CHARSET_DEFAULT) + return PARSERUTILS_OK; + + /* We've not yet found a charset, so use the default fallback */ +default_encoding: + + charset = parserutils_charset_mibenum_from_name("UTF-8", SLEN("UTF-8")); + + *mibenum = charset; + *source = CSS_CHARSET_DEFAULT; + + return PARSERUTILS_OK; +} + + +/** + * Inspect the beginning of a buffer of data for the presence of a + * UTF Byte Order Mark and/or an @charset rule + * + * \param data Pointer to buffer containing data + * \param len Buffer length + * \param mibenum Pointer to location to receive MIB enum + * \return PARSERUTILS_OK on success, appropriate error otherwise + */ +parserutils_error css_charset_read_bom_or_charset(const uint8_t *data, + size_t len, uint16_t *mibenum) +{ + uint16_t charset = 0; + + if (data == NULL) + return PARSERUTILS_BADPARM; + + /* We require at least 4 bytes of data */ + if (len < 4) + return PARSERUTILS_NEEDDATA; + + + /* Look for BOM */ + if (data[0] == 0x00 && data[1] == 0x00 && + data[2] == 0xFE && data[3] == 0xFF) { + charset = parserutils_charset_mibenum_from_name("UTF-32BE", + SLEN("UTF-32BE")); + } else if (data[0] == 0xFF && data[1] == 0xFE && + data[2] == 0x00 && data[3] == 0x00) { + charset = parserutils_charset_mibenum_from_name("UTF-32LE", + SLEN("UTF-32LE")); + } else if (data[0] == 0xFE && data[1] == 0xFF) { + charset = parserutils_charset_mibenum_from_name("UTF-16BE", + SLEN("UTF-16BE")); + } else if (data[0] == 0xFF && data[1] == 0xFE) { + charset = parserutils_charset_mibenum_from_name("UTF-16LE", + SLEN("UTF-16LE")); + } else if (data[0] == 0xEF && data[1] == 0xBB && data[2] == 0xBF) { + charset = parserutils_charset_mibenum_from_name("UTF-8", + SLEN("UTF-8")); + } + + /* BOM beats @charset. + * UAs differ here, but none appear to match the spec. + * The spec indicates that any @charset present in conjunction with a + * BOM, should match the BOM. In reality, it appears UAs just take the + * BOM as gospel and ignore any @charset rule. The w3c CSS validator + * appears to do the same (at the least, it doesn't complain about a + * mismatch). + */ + if (charset != 0) { + *mibenum = charset; + return PARSERUTILS_OK; + } + + /** \todo UTF-32 and UTF-16 @charset support */ + + /* Look for @charset, assuming ASCII-compatible source data */ + if (len > 10 && strncmp((const char *) data, "@charset \"", + SLEN("@charset \"")) == 0) { + const uint8_t *end; + + /* Look for "; at end of charset declaration */ + for (end = data + 10; end < data + len; end++) { + if (*end == '"' && end < data + len - 1 && + *(end + 1) == ';') + break; + } + + if (end == data + len) { + /* Ran out of input */ + return PARSERUTILS_NEEDDATA; + } + + /* Convert to MIB enum */ + charset = parserutils_charset_mibenum_from_name( + (char *) data + 10, end - data - 10); + } + + *mibenum = charset; + + return PARSERUTILS_OK; +} + diff --git a/src/charset/detect.h b/src/charset/detect.h new file mode 100644 index 0000000..d907921 --- /dev/null +++ b/src/charset/detect.h @@ -0,0 +1,24 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_charset_detect_h_ +#define css_charset_detect_h_ + +#include <inttypes.h> + +#include <libcss/errors.h> +#include <libcss/functypes.h> +#include <libcss/types.h> + +#include <parserutils/errors.h> + +/* Extract a charset from a chunk of data */ +parserutils_error css_charset_extract(const uint8_t *data, size_t len, + uint16_t *mibenum, uint32_t *source); + +#endif + diff --git a/src/lex/Makefile b/src/lex/Makefile new file mode 100644 index 0000000..73f8ecf --- /dev/null +++ b/src/lex/Makefile @@ -0,0 +1,49 @@ +# Child makefile fragment +# +# Toolchain is provided by top-level makefile +# +# Variables provided by top-level makefile +# +# COMPONENT The name of the component +# EXPORT The location of the export directory +# TOP The location of the source tree root +# RELEASEDIR The place to put release objects +# DEBUGDIR The place to put debug objects +# +# do_include Canned command sequence to include a child makefile +# +# Variables provided by parent makefile: +# +# DIR The name of the directory we're in, relative to $(TOP) +# +# Variables we can manipulate: +# +# ITEMS_CLEAN The list of items to remove for "make clean" +# ITEMS_DISTCLEAN The list of items to remove for "make distclean" +# TARGET_TESTS The list of target names to run for "make test" +# +# SOURCES The list of sources to build for $(COMPONENT) +# +# Plus anything from the toolchain + +# Push parent directory onto the directory stack +sp := $(sp).x +dirstack_$(sp) := $(d) +d := $(DIR) + +# Manipulate include paths +CFLAGS := $(CFLAGS) -I$(d) + +# Sources +SRCS_$(d) := lex.c + +# Append to sources for component +SOURCES += $(addprefix $(d), $(SRCS_$(d))) + +# Now include any children we may have +MAKE_INCLUDES := $(wildcard $(d)*/Makefile) +$(eval $(foreach INC, $(MAKE_INCLUDES), $(call do_include,$(INC)))) + +# Finally, pop off the directory stack +d := $(dirstack_$(sp)) +sp := $(basename $(sp)) diff --git a/src/lex/lex.c b/src/lex/lex.c new file mode 100644 index 0000000..4df6cea --- /dev/null +++ b/src/lex/lex.c @@ -0,0 +1,2116 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2008 John-Mark Bell <jmb@netsurf-browser.org> + */ + +/** \file CSS lexer + * + * See docs/Tokens for the production rules used by this lexer. + * + * See docs/Lexer for the inferred first characters for each token. + * + * See also CSS3 Syntax module and CSS2.1 $4.1.1 + errata + * + * The lexer assumes that all invalid Unicode codepoints have been converted + * to U+FFFD by the input stream. + * + * The lexer comprises a state machine, the top-level of which is derived from + * the First sets in docs/Lexer. Each top-level state may contain a number of + * sub states. These enable restarting of the parser. + */ + +#include <assert.h> +#include <stdarg.h> +#include <stdbool.h> +#include <stdint.h> + +#include <parserutils/charset/utf8.h> +#include <parserutils/input/inputstream.h> +#include <parserutils/utils/buffer.h> + +#include <libcss/errors.h> + +#include "lex/lex.h" +#include "utils/parserutilserror.h" + +/** \todo Optimisation -- we're currently revisiting a bunch of input + * characters (Currently, we're calling parserutils_inputstream_peek about + * 1.5x the number of characters in the input stream). Ideally, + * we'll visit each character in the input exactly once. In reality, + * the upper bound is twice, due to the need, in some cases, to read + * one character beyond the end of a token's input to detect the end + * of the token. Resumability adds a little overhead here, unless + * we're somewhat more clever when it comes to having support for + * restarting mid-escape sequence. Currently, we rewind back to the + * start of the sequence and process the whole thing again. + */ + +enum { + sSTART = 0, + sATKEYWORD = 1, + sSTRING = 2, + sHASH = 3, + sNUMBER = 4, + sCDO = 5, + sCDC = 6, + sS = 7, + sCOMMENT = 8, + sMATCH = 9, + sURI = 10, + sIDENT = 11, + sESCAPEDIDENT = 12, + sURL = 13, + sUCR = 14 +}; + +/** + * CSS lexer object + */ +struct css_lexer +{ + parserutils_inputstream *input; /**< Inputstream containing CSS */ + + size_t bytesReadForToken; /**< Total bytes read from the + * inputstream for the current token */ + + css_token token; /**< The current token */ + + bool escapeSeen; /**< Whether an escape sequence has + * been seen while processing the input + * for the current token */ + parserutils_buffer *unescapedTokenData; /**< Buffer containing + * unescaped token data + * (used iff escapeSeen == true) + */ + + uint32_t state : 4, /**< Current state */ + substate : 4; /**< Current substate */ + + struct { + uint8_t first; /**< First character read for token */ + size_t origBytes; /**< Storage of current number of + * bytes read, for rewinding */ + bool lastWasStar; /**< Whether the previous character + * was an asterisk */ + bool lastWasCR; /**< Whether the previous character + * was CR */ + size_t bytesForURL; /**< Input bytes read for "url(", for + * rewinding */ + size_t dataLenForURL; /**< Output length for "url(", for + * rewinding */ + int hexCount; /**< Counter for reading hex digits */ + } context; /**< Context for the current state */ + + bool emit_comments; /**< Whether to emit comment tokens */ + + uint32_t currentCol; /**< Current column in source */ + uint32_t currentLine; /**< Current line in source */ + + css_alloc alloc; /**< Memory (de)allocation function */ + void *pw; /**< Pointer to client-specific data */ +}; + +#define APPEND(lexer, data, len) \ +do { \ + css_error error; \ + error = appendToTokenData((lexer), \ + (const uint8_t*) (data), (len)); \ + if (error != CSS_OK) \ + return error; \ + (lexer)->bytesReadForToken += (len); \ + (lexer)->currentCol += (len); \ +} while(0) \ + +static inline css_error appendToTokenData(css_lexer *lexer, + const uint8_t *data, size_t len); +static inline css_error emitToken(css_lexer *lexer, css_token_type type, + const css_token **token); + +static inline css_error AtKeyword(css_lexer *lexer, const css_token **token); +static inline css_error CDCOrIdentOrFunction(css_lexer *lexer, + const css_token **token); +static inline css_error CDO(css_lexer *lexer, const css_token **token); +static inline css_error Comment(css_lexer *lexer, const css_token **token); +static inline css_error EscapedIdentOrFunction(css_lexer *lexer, + const css_token **token); +static inline css_error Hash(css_lexer *lexer, const css_token **token); +static inline css_error IdentOrFunction(css_lexer *lexer, + const css_token **token); +static inline css_error Match(css_lexer *lexer, const css_token **token); +static inline css_error NumberOrPercentageOrDimension(css_lexer *lexer, + const css_token **token); +static inline css_error S(css_lexer *lexer, const css_token **token); +static inline css_error Start(css_lexer *lexer, const css_token **token); +static inline css_error String(css_lexer *lexer, const css_token **token); +static inline css_error URIOrUnicodeRangeOrIdentOrFunction( + css_lexer *lexer, const css_token **token); +static inline css_error URI(css_lexer *lexer, const css_token **token); +static inline css_error UnicodeRange(css_lexer *lexer, const css_token **token); + +static inline css_error consumeDigits(css_lexer *lexer); +static inline css_error consumeEscape(css_lexer *lexer, bool nl); +static inline css_error consumeNMChars(css_lexer *lexer); +static inline css_error consumeString(css_lexer *lexer); +static inline css_error consumeStringChars(css_lexer *lexer); +static inline css_error consumeUnicode(css_lexer *lexer, uint32_t ucs); +static inline css_error consumeURLChars(css_lexer *lexer); +static inline css_error consumeWChars(css_lexer *lexer); + +static inline uint32_t charToHex(uint8_t c); +static inline bool startNMChar(uint8_t c); +static inline bool startNMStart(uint8_t c); +static inline bool startStringChar(uint8_t c); +static inline bool startURLChar(uint8_t c); +static inline bool isDigit(uint8_t c); +static inline bool isHex(uint8_t c); +static inline bool isSpace(uint8_t c); + +/** + * Create a lexer instance + * + * \param input The inputstream to read from + * \param alloc Memory (de)allocation function + * \param pw Pointer to client-specific private data + * \return Pointer to instance, or NULL on memory exhaustion + */ +css_lexer *css_lexer_create(parserutils_inputstream *input, + css_alloc alloc, void *pw) +{ + css_lexer *lex; + + if (input == NULL || alloc == NULL) + return NULL; + + lex = alloc(NULL, sizeof(css_lexer), pw); + if (lex == NULL) + return NULL; + + lex->input = input; + lex->bytesReadForToken = 0; + lex->token.type = CSS_TOKEN_EOF; + lex->token.data.ptr = NULL; + lex->token.data.len = 0; + lex->escapeSeen = false; + lex->unescapedTokenData = NULL; + lex->state = sSTART; + lex->substate = 0; + lex->emit_comments = false; + lex->currentCol = 1; + lex->currentLine = 1; + lex->alloc = alloc; + lex->pw = pw; + + return lex; +} + +/** + * Destroy a lexer instance + * + * \param lexer The instance to destroy + */ +void css_lexer_destroy(css_lexer *lexer) +{ + if (lexer == NULL) + return; + + if (lexer->unescapedTokenData != NULL) + parserutils_buffer_destroy(lexer->unescapedTokenData); + + lexer->alloc(lexer, 0, lexer->pw); +} + +/** + * Configure a lexer instance + * + * \param lexer The lexer to configure + * \param type The option type to modify + * \param params Option-specific parameters + * \return CSS_OK on success, appropriate error otherwise + */ +css_error css_lexer_setopt(css_lexer *lexer, css_lexer_opttype type, + css_lexer_optparams *params) +{ + if (lexer == NULL || params == NULL) + return CSS_BADPARM; + + switch (type) { + case CSS_LEXER_EMIT_COMMENTS: + lexer->emit_comments = params->emit_comments; + break; + default: + return CSS_BADPARM; + } + + return CSS_OK; +} + +/** + * Retrieve a token from a lexer + * + * \param lexer The lexer instance to read from + * \param token Pointer to location to receive pointer to token + * \return CSS_OK on success, appropriate error otherwise + */ +css_error css_lexer_get_token(css_lexer *lexer, const css_token **token) +{ + css_error error; + + if (lexer == NULL || token == NULL) + return CSS_BADPARM; + + switch (lexer->state) + { + case sSTART: + start: + return Start(lexer, token); + case sATKEYWORD: + return AtKeyword(lexer, token); + case sSTRING: + return String(lexer, token); + case sHASH: + return Hash(lexer, token); + case sNUMBER: + return NumberOrPercentageOrDimension(lexer, token); + case sCDO: + return CDO(lexer, token); + case sCDC: + return CDCOrIdentOrFunction(lexer, token); + case sS: + return S(lexer, token); + case sCOMMENT: + error = Comment(lexer, token); + if (!lexer->emit_comments && error == CSS_OK) + goto start; + return error; + case sMATCH: + return Match(lexer, token); + case sURI: + return URI(lexer, token); + case sIDENT: + return IdentOrFunction(lexer, token); + case sESCAPEDIDENT: + return EscapedIdentOrFunction(lexer, token); + case sURL: + return URI(lexer, token); + case sUCR: + return UnicodeRange(lexer, token); + } + + /* Should never be reached */ + assert(0); + + return CSS_OK; +} + +/****************************************************************************** + * Utility routines * + ******************************************************************************/ + +/** + * Append some data to the current token + * + * \param lexer The lexer instance + * \param data Pointer to data to append + * \param len Length, in bytes, of data + * \return CSS_OK on success, appropriate error otherwise + * + * This should not be called directly without good reason. Use the APPEND() + * macro instead. + */ +css_error appendToTokenData(css_lexer *lexer, const uint8_t *data, size_t len) +{ + css_token *token = &lexer->token; + + if (lexer->escapeSeen) { + css_error error = css_error_from_parserutils_error( + parserutils_buffer_append( + lexer->unescapedTokenData, data, len)); + if (error != CSS_OK) + return error; + } + + token->data.len += len; + + return CSS_OK; +} + +/** + * Prepare a token for consumption and emit it to the client + * + * \param lexer The lexer instance + * \param type The type of token to emit + * \param token Pointer to location to receive pointer to token + * \return CSS_OK on success, appropriate error otherwise + */ +css_error emitToken(css_lexer *lexer, css_token_type type, + const css_token **token) +{ + css_token *t = &lexer->token; + + t->type = type; + + /* Calculate token data start pointer. We have to do this here as + * the inputstream's buffer may have moved under us. */ + if (lexer->escapeSeen) { + t->data.ptr = lexer->unescapedTokenData->data; + } else { + size_t clen; + uintptr_t ptr = parserutils_inputstream_peek( + lexer->input, 0, &clen); + + assert(type == CSS_TOKEN_EOF || + (ptr != PARSERUTILS_INPUTSTREAM_EOF && + ptr != PARSERUTILS_INPUTSTREAM_OOD)); + + t->data.ptr = (type == CSS_TOKEN_EOF) ? NULL : (uint8_t *) ptr; + } + + switch (type) { + case CSS_TOKEN_ATKEYWORD: + /* Strip the '@' from the front */ + t->data.ptr += 1; + t->data.len -= 1; + break; + case CSS_TOKEN_STRING: + /* Strip the leading quote */ + t->data.ptr += 1; + t->data.len -= 1; + + /* Strip the trailing quote */ + t->data.len -= 1; + break; + case CSS_TOKEN_HASH: + /* Strip the '#' from the front */ + t->data.ptr += 1; + t->data.len -= 1; + break; + case CSS_TOKEN_PERCENTAGE: + /* Strip the '%' from the end */ + t->data.len -= 1; + break; + case CSS_TOKEN_DIMENSION: + /** \todo Do we want to separate the value from the units? */ + break; + case CSS_TOKEN_URI: + /* Strip the "url(" from the start */ + t->data.ptr += sizeof("url(") - 1; + t->data.len -= sizeof("url(") - 1; + + /* Strip any leading whitespace */ + while (isSpace(t->data.ptr[0])) { + t->data.ptr++; + t->data.len--; + } + + /* Strip any leading quote */ + if (t->data.ptr[0] == '"' || t->data.ptr[0] == '\'') { + t->data.ptr += 1; + t->data.len -= 1; + } + + /* Strip the trailing ')' */ + t->data.len -= 1; + + /* Strip any trailing whitespace */ + while (isSpace(t->data.ptr[t->data.len - 1])) { + t->data.len--; + } + + /* Strip any trailing quote */ + if (t->data.ptr[t->data.len - 1] == '"' || + t->data.ptr[t->data.len - 1] == '\'') { + t->data.len -= 1; + } + break; + case CSS_TOKEN_UNICODE_RANGE: + /* Remove "U+" from the start */ + t->data.ptr += sizeof("U+") - 1; + t->data.len -= sizeof("U+") - 1; + break; + case CSS_TOKEN_COMMENT: + /* Strip the leading '/' and '*' */ + t->data.ptr += sizeof("/*") - 1; + t->data.len -= sizeof("/*") - 1; + + /* Strip the trailing '*' and '/' */ + t->data.len -= sizeof("*/") - 1; + break; + case CSS_TOKEN_FUNCTION: + /* Strip the trailing '(' */ + t->data.len -= 1; + break; + default: + break; + } + + *token = t; + + /* Reset the lexer's state */ + lexer->state = sSTART; + lexer->substate = 0; + + return CSS_OK; +} + +/****************************************************************************** + * State machine components * + ******************************************************************************/ + +css_error AtKeyword(css_lexer *lexer, const css_token **token) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + enum { Initial = 0, Escape = 1, NMChar = 2 }; + + /* ATKEYWORD = '@' ident + * + * The '@' has been consumed. + */ + + switch (lexer->substate) { + case Initial: + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + c = *((uint8_t *) cptr); + + if (!startNMStart(c)) + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + if (c != '\\') { + APPEND(lexer, cptr, clen); + } else { + lexer->bytesReadForToken += clen; + goto escape; + } + + /* Fall through */ + case NMChar: + nmchar: + lexer->substate = NMChar; + error = consumeNMChars(lexer); + if (error != CSS_OK) + return error; + break; + + case Escape: + escape: + lexer->substate = Escape; + error = consumeEscape(lexer, false); + if (error != CSS_OK) { + if (error == CSS_EOF || error == CSS_INVALID) { + /* Rewind the '\\' */ + lexer->bytesReadForToken -= 1; + + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + return error; + } + + goto nmchar; + } + + return emitToken(lexer, CSS_TOKEN_ATKEYWORD, token); +} + +css_error CDCOrIdentOrFunction(css_lexer *lexer, const css_token **token) +{ + css_token *t = &lexer->token; + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + enum { Initial = 0, Escape = 1, Gt = 2 }; + + /* CDC = "-->" + * IDENT = [-]? nmstart nmchar* + * FUNCTION = [-]? nmstart nmchar* '(' + * + * The first dash has been consumed. Thus, we must consume the next + * character in the stream. If it's a dash, then we're dealing with + * CDC. Otherwise, we're dealing with IDENT/FUNCTION. + */ + + switch (lexer->substate) { + case Initial: + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* We can only match char with what we've read so far */ + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + c = *((uint8_t *) cptr); + + if (c != '-' && !startNMStart(c)) { + /* Can only be CHAR */ + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + + if (c != '\\') { + APPEND(lexer, cptr, clen); + } + + if (c != '-') { + if (c == '\\') { + lexer->bytesReadForToken += clen; + goto escape; + } + + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); + } + + /* Fall through */ + case Gt: + lexer->substate = Gt; + + /* Ok, so we're dealing with CDC. Expect a '>' */ + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* CHAR is the only match here */ + /* Remove the '-' we read above */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + c = *((uint8_t *) cptr); + + if (c == '>') { + APPEND(lexer, cptr, clen); + + t->type = CSS_TOKEN_CDC; + } else { + /* Remove the '-' we read above */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + t->type = CSS_TOKEN_CHAR; + } + break; + + case Escape: + escape: + lexer->substate = Escape; + error = consumeEscape(lexer, false); + if (error != CSS_OK) { + if (error == CSS_EOF || error == CSS_INVALID) { + /* Rewind the '\\' */ + lexer->bytesReadForToken -= 1; + + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + return error; + } + + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); + } + + return emitToken(lexer, t->type, token); +} + +css_error CDO(css_lexer *lexer, const css_token **token) +{ + css_token *t = &lexer->token; + uintptr_t cptr; + uint8_t c; + size_t clen; + enum { Initial = 0, Dash1 = 1, Dash2 = 2 }; + + /* CDO = "<!--" + * + * The '<' has been consumed + */ + + switch (lexer->substate) { + case Initial: + /* Expect '!' */ + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* CHAR is the only match here */ + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + c = *((uint8_t *) cptr); + + if (c == '!') { + APPEND(lexer, cptr, clen); + } else { + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + /* Fall Through */ + case Dash1: + lexer->substate = Dash1; + + /* Expect '-' */ + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* CHAR is the only match here */ + /* Remove the '!' we read above */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + c = *((uint8_t *) cptr); + + if (c == '-') { + APPEND(lexer, cptr, clen); + } else { + /* Remove the '!' we read above */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + /* Fall through */ + case Dash2: + lexer->substate = Dash2; + + /* Expect '-' */ + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* CHAR is the only match here */ + /* Remove the '-' and the '!' we read above */ + lexer->bytesReadForToken -= 2; + t->data.len -= 2; + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + c = *((uint8_t *) cptr); + + if (c == '-') { + APPEND(lexer, cptr, clen); + } else { + /* Remove the '-' and the '!' we read above */ + lexer->bytesReadForToken -= 2; + t->data.len -= 2; + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + } + + return emitToken(lexer, CSS_TOKEN_CDO, token); +} + +css_error Comment(css_lexer *lexer, const css_token **token) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + enum { Initial = 0, InComment = 1 }; + + /* COMMENT = '/' '*' [^*]* '*'+ ([^/] [^*]* '*'+)* '/' + * + * The '/' has been consumed. + */ + switch (lexer->substate) { + case Initial: + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + c = *((uint8_t *) cptr); + + if (c != '*') + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + APPEND(lexer, cptr, clen); + + /* Fall through */ + case InComment: + lexer->substate = InComment; + + while (1) { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* As per unterminated strings, + * we ignore unterminated comments. */ + return emitToken(lexer, CSS_TOKEN_EOF, token); + } + + c = *((uint8_t *) cptr); + + APPEND(lexer, cptr, clen); + + if (lexer->context.lastWasStar && c == '/') + break; + + lexer->context.lastWasStar = (c == '*'); + + if (c == '\n' || c == '\f') { + lexer->currentCol = 1; + lexer->currentLine++; + } + + if (lexer->context.lastWasCR && c != '\n') { + lexer->currentCol = 1; + lexer->currentLine++; + } + lexer->context.lastWasCR = (c == '\r'); + } + } + + return emitToken(lexer, CSS_TOKEN_COMMENT, token); +} + +css_error EscapedIdentOrFunction(css_lexer *lexer, const css_token **token) +{ + css_error error; + + /* IDENT = ident = [-]? nmstart nmchar* + * FUNCTION = ident '(' = [-]? nmstart nmchar* '(' + * + * In this case, nmstart is an escape sequence and no '-' is present. + * + * The '\\' has been consumed. + */ + + error = consumeEscape(lexer, false); + if (error != CSS_OK) { + if (error == CSS_EOF || error == CSS_INVALID) { + /* The '\\' is a token of its own */ + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } + + return error; + } + + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); +} + +css_error Hash(css_lexer *lexer, const css_token **token) +{ + css_error error; + + /* HASH = '#' name = '#' nmchar+ + * + * The '#' has been consumed. + */ + + error = consumeNMChars(lexer); + if (error != CSS_OK) + return error; + + /* Require at least one NMChar otherwise, we're just a raw '#' */ + if (lexer->bytesReadForToken - lexer->context.origBytes > 0) + return emitToken(lexer, CSS_TOKEN_HASH, token); + + return emitToken(lexer, CSS_TOKEN_CHAR, token); +} + +css_error IdentOrFunction(css_lexer *lexer, const css_token **token) +{ + css_token *t = &lexer->token; + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + enum { Initial = 0, Bracket = 1 }; + + /* IDENT = ident = [-]? nmstart nmchar* + * FUNCTION = ident '(' = [-]? nmstart nmchar* '(' + * + * The optional dash and nmstart are already consumed + */ + + switch (lexer->substate) { + case Initial: + /* Consume all subsequent nmchars (if any exist) */ + error = consumeNMChars(lexer); + if (error != CSS_OK) + return error; + + /* Fall through */ + case Bracket: + lexer->substate = Bracket; + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* IDENT, rather than CHAR */ + return emitToken(lexer, CSS_TOKEN_IDENT, token); + } + + c = *((uint8_t *) cptr); + + if (c == '(') { + APPEND(lexer, cptr, clen); + + t->type = CSS_TOKEN_FUNCTION; + } else { + t->type = CSS_TOKEN_IDENT; + } + } + + return emitToken(lexer, t->type, token); +} + +css_error Match(css_lexer *lexer, const css_token **token) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + css_token_type type = CSS_TOKEN_EOF; /* GCC's braindead */ + + /* INCLUDES = "~=" + * DASHMATCH = "|=" + * PREFIXMATCH = "^=" + * SUFFIXMATCH = "$=" + * SUBSTRINGMATCH = "*=" + * + * The first character has been consumed. + */ + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + c = *((uint8_t *) cptr); + + if (c != '=') + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + APPEND(lexer, cptr, clen); + + switch (lexer->context.first) { + case '~': + type = CSS_TOKEN_INCLUDES; + break; + case '|': + type = CSS_TOKEN_DASHMATCH; + break; + case '^': + type = CSS_TOKEN_PREFIXMATCH; + break; + case '$': + type = CSS_TOKEN_SUFFIXMATCH; + break; + case '*': + type = CSS_TOKEN_SUBSTRINGMATCH; + break; + default: + assert(0); + } + + return emitToken(lexer, type, token); +} + +css_error NumberOrPercentageOrDimension(css_lexer *lexer, + const css_token **token) +{ + css_token *t = &lexer->token; + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + enum { Initial = 0, Dot = 1, MoreDigits = 2, + Suffix = 3, NMChars = 4, Escape = 5 }; + + /* NUMBER = num = [0-9]+ | [0-9]* '.' [0-9]+ + * PERCENTAGE = num '%' + * DIMENSION = num ident + * + * The first digit, or '.' has been consumed. + */ + + switch (lexer->substate) { + case Initial: + error = consumeDigits(lexer); + if (error != CSS_OK) + return error; + + /* Fall through */ + case Dot: + lexer->substate = Dot; + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + if (t->data.len == 1 && lexer->context.first == '.') + return emitToken(lexer, CSS_TOKEN_CHAR, token); + else + return emitToken(lexer, CSS_TOKEN_NUMBER, + token); + } + + c = *((uint8_t *) cptr); + + /* Bail if we've not got a '.' or we've seen one already */ + if (c != '.' || lexer->context.first == '.') + goto suffix; + + /* Save the token length up to the end of the digits */ + lexer->context.origBytes = lexer->bytesReadForToken; + + /* Append the '.' to the token */ + APPEND(lexer, cptr, clen); + + /* Fall through */ + case MoreDigits: + lexer->substate = MoreDigits; + + error = consumeDigits(lexer); + if (error != CSS_OK) + return error; + + if (lexer->bytesReadForToken - lexer->context.origBytes == 1) { + /* No digits after dot => dot isn't part of number */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + } + + /* Fall through */ + case Suffix: + suffix: + lexer->substate = Suffix; + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + if (t->data.len == 1 && lexer->context.first == '.') + return emitToken(lexer, CSS_TOKEN_CHAR, token); + else + return emitToken(lexer, CSS_TOKEN_NUMBER, + token); + } + + c = *((uint8_t *) cptr); + + /* A solitary '.' is a CHAR, not numeric */ + if (t->data.len == 1 && lexer->context.first == '.') + return emitToken(lexer, CSS_TOKEN_CHAR, token); + + if (c == '%') { + APPEND(lexer, cptr, clen); + + return emitToken(lexer, CSS_TOKEN_PERCENTAGE, token); + } else if (!startNMStart(c)) { + return emitToken(lexer, CSS_TOKEN_NUMBER, token); + } + + if (c != '\\') { + APPEND(lexer, cptr, clen); + } else { + lexer->bytesReadForToken += clen; + goto escape; + } + + /* Fall through */ + case NMChars: + nmchars: + lexer->substate = NMChars; + + error = consumeNMChars(lexer); + if (error != CSS_OK) + return error; + + break; + case Escape: + escape: + lexer->substate = Escape; + + error = consumeEscape(lexer, false); + if (error != CSS_OK) { + if (error == CSS_EOF || error == CSS_INVALID) { + /* Rewind the '\\' */ + lexer->bytesReadForToken -= 1; + + /* This can only be a number */ + return emitToken(lexer, + CSS_TOKEN_NUMBER, token); + } + + return error; + } + + goto nmchars; + } + + return emitToken(lexer, CSS_TOKEN_DIMENSION, token); +} + +css_error S(css_lexer *lexer, const css_token **token) +{ + css_error error; + + /* S = wc* + * + * The first whitespace character has been consumed. + */ + + error = consumeWChars(lexer); + if (error != CSS_OK) + return error; + + return emitToken(lexer, CSS_TOKEN_S, token); +} + +css_error Start(css_lexer *lexer, const css_token **token) +{ + css_token *t = &lexer->token; + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + +start: + + /* Advance past the input read for the previous token */ + if (lexer->bytesReadForToken > 0) { + parserutils_inputstream_advance( + lexer->input, lexer->bytesReadForToken); + lexer->bytesReadForToken = 0; + } + + /* Reset in preparation for the next token */ + t->type = CSS_TOKEN_EOF; + t->data.ptr = NULL; + t->data.len = 0; + t->col = lexer->currentCol; + t->line = lexer->currentLine; + lexer->escapeSeen = false; + if (lexer->unescapedTokenData != NULL) + lexer->unescapedTokenData->length = 0; + + cptr = parserutils_inputstream_peek(lexer->input, 0, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return emitToken(lexer, CSS_TOKEN_EOF, token); + + APPEND(lexer, cptr, clen); + + c = *((uint8_t *) cptr); + + if (clen > 1 || c >= 0x80) { + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); + } + + switch (c) { + case '@': + lexer->state = sATKEYWORD; + lexer->substate = 0; + return AtKeyword(lexer, token); + case '"': case '\'': + lexer->state = sSTRING; + lexer->substate = 0; + lexer->context.first = c; + return String(lexer, token); + case '#': + lexer->state = sHASH; + lexer->substate = 0; + lexer->context.origBytes = lexer->bytesReadForToken; + return Hash(lexer, token); + case '0': case '1': case '2': case '3': case '4': + case '5': case '6': case '7': case '8': case '9': + case '.': + lexer->state = sNUMBER; + lexer->substate = 0; + lexer->context.first = c; + return NumberOrPercentageOrDimension(lexer, token); + case '<': + lexer->state = sCDO; + lexer->substate = 0; + return CDO(lexer, token); + case '-': + lexer->state = sCDC; + lexer->substate = 0; + return CDCOrIdentOrFunction(lexer, token); + case ' ': case '\t': case '\r': case '\n': case '\f': + lexer->state = sS; + lexer->substate = 0; + if (c == '\n' || c == '\f') { + lexer->currentCol = 1; + lexer->currentLine++; + } + lexer->context.lastWasCR = (c == '\r'); + return S(lexer, token); + case '/': + lexer->state = sCOMMENT; + lexer->substate = 0; + lexer->context.lastWasStar = false; + lexer->context.lastWasCR = false; + error = Comment(lexer, token); + if (!lexer->emit_comments && error == CSS_OK) + goto start; + return error; + case '~': case '|': case '^': case '$': case '*': + lexer->state = sMATCH; + lexer->substate = 0; + lexer->context.first = c; + return Match(lexer, token); + case 'u': case 'U': + lexer->state = sURI; + lexer->substate = 0; + return URIOrUnicodeRangeOrIdentOrFunction(lexer, token); + case 'a': case 'b': case 'c': case 'd': case 'e': case 'f': + case 'g': case 'h': case 'i': case 'j': case 'k': case 'l': + case 'm': case 'n': case 'o': case 'p': case 'q': case 'r': + case 's': case 't': /* 'u'*/ case 'v': case 'w': case 'x': + case 'y': case 'z': + case 'A': case 'B': case 'C': case 'D': case 'E': case 'F': + case 'G': case 'H': case 'I': case 'J': case 'K': case 'L': + case 'M': case 'N': case 'O': case 'P': case 'Q': case 'R': + case 'S': case 'T': /* 'U'*/ case 'V': case 'W': case 'X': + case 'Y': case 'Z': + case '_': + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); + case '\\': + lexer->state = sESCAPEDIDENT; + lexer->substate = 0; + return EscapedIdentOrFunction(lexer, token); + default: + return emitToken(lexer, CSS_TOKEN_CHAR, token); + } +} + +css_error String(css_lexer *lexer, const css_token **token) +{ + css_error error; + + /* STRING = string + * + * The open quote has been consumed. + */ + + error = consumeString(lexer); + if (error != CSS_OK && error != CSS_EOF) + return error; + + return emitToken(lexer, + error == CSS_EOF ? CSS_TOKEN_EOF : CSS_TOKEN_STRING, + token); +} + +css_error URIOrUnicodeRangeOrIdentOrFunction(css_lexer *lexer, + const css_token **token) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + + /* URI = "url(" w (string | urlchar*) w ')' + * UNICODE-RANGE = [Uu] '+' [0-9a-fA-F?]{1,6}(-[0-9a-fA-F]{1,6})? + * IDENT = ident = [-]? nmstart nmchar* + * FUNCTION = ident '(' = [-]? nmstart nmchar* '(' + * + * The 'u' (or 'U') has been consumed. + */ + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* IDENT, rather than CHAR */ + return emitToken(lexer, CSS_TOKEN_IDENT, token); + } + + c = *((uint8_t *) cptr); + + if (c == 'r' || c == 'R') { + APPEND(lexer, cptr, clen); + + lexer->state = sURL; + lexer->substate = 0; + return URI(lexer, token); + } else if (c == '+') { + APPEND(lexer, cptr, clen); + + lexer->state = sUCR; + lexer->substate = 0; + lexer->context.hexCount = 0; + return UnicodeRange(lexer, token); + } + + /* Can only be IDENT or FUNCTION. Reprocess current character */ + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); +} + +css_error URI(css_lexer *lexer, const css_token **token) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + enum { Initial = 0, LParen = 1, W1 = 2, Quote = 3, + URL = 4, W2 = 5, RParen = 6, String = 7 }; + + /* URI = "url(" w (string | urlchar*) w ')' + * + * 'u' and 'r' have been consumed. + */ + + switch (lexer->substate) { + case Initial: + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* IDENT */ + return emitToken(lexer, CSS_TOKEN_IDENT, token); + } + + c = *((uint8_t *) cptr); + + if (c == 'l' || c == 'L') { + APPEND(lexer, cptr, clen); + } else { + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); + } + + /* Fall through */ + case LParen: + lexer->substate = LParen; + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return emitToken(lexer, CSS_TOKEN_IDENT, token); + + c = *((uint8_t *) cptr); + + if (c == '(') { + APPEND(lexer, cptr, clen); + } else { + lexer->state = sIDENT; + lexer->substate = 0; + return IdentOrFunction(lexer, token); + } + + /* Save the number of input bytes read for "url(" */ + lexer->context.bytesForURL = lexer->bytesReadForToken; + /* And the length of the token data at the same point */ + lexer->context.dataLenForURL = lexer->token.data.len; + + lexer->context.lastWasCR = false; + + /* Fall through */ + case W1: + lexer->substate = W1; + + error = consumeWChars(lexer); + if (error != CSS_OK) + return error; + + /* Fall through */ + case Quote: + lexer->substate = Quote; + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* Rewind to "url(" */ + lexer->bytesReadForToken = lexer->context.bytesForURL; + lexer->token.data.len = lexer->context.dataLenForURL; + return emitToken(lexer, CSS_TOKEN_FUNCTION, token); + } + + c = *((uint8_t *) cptr); + + if (c == '"' || c == '\'') { + APPEND(lexer, cptr, clen); + + lexer->context.first = c; + + goto string; + } + + /* Potential minor optimisation: If string is more common, + * then fall through to that state and branch for the URL + * state. Need to investigate a reasonably large corpus of + * real-world data to determine if this is worthwhile. */ + + /* Fall through */ + case URL: + lexer->substate = URL; + + error = consumeURLChars(lexer); + if (error != CSS_OK) + return error; + + lexer->context.lastWasCR = false; + + /* Fall through */ + case W2: + w2: + lexer->substate = W2; + + error = consumeWChars(lexer); + if (error != CSS_OK) + return error; + + /* Fall through */ + case RParen: + lexer->substate = RParen; + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + /* Rewind to "url(" */ + lexer->bytesReadForToken = lexer->context.bytesForURL; + lexer->token.data.len = lexer->context.dataLenForURL; + return emitToken(lexer, CSS_TOKEN_FUNCTION, token); + } + + c = *((uint8_t *) cptr); + + if (c != ')') { + /* Rewind to "url(" */ + lexer->bytesReadForToken = lexer->context.bytesForURL; + lexer->token.data.len = lexer->context.dataLenForURL; + return emitToken(lexer, CSS_TOKEN_FUNCTION, token); + } + + APPEND(lexer, cptr, clen); + break; + case String: + string: + lexer->substate = String; + + error = consumeString(lexer); + if (error != CSS_OK && error != CSS_EOF) + return error; + + /* EOF gets handled in RParen */ + + lexer->context.lastWasCR = false; + + goto w2; + } + + return emitToken(lexer, CSS_TOKEN_URI, token); +} + +css_error UnicodeRange(css_lexer *lexer, const css_token **token) +{ + css_token *t = &lexer->token; + uintptr_t cptr = PARSERUTILS_INPUTSTREAM_OOD; /* GCC: shush */ + uint8_t c = 0; /* GCC: shush */ + size_t clen; + enum { Initial = 0, MoreDigits = 1 }; + + /* UNICODE-RANGE = [Uu] '+' [0-9a-fA-F?]{1,6}(-[0-9a-fA-F]{1,6})? + * + * "U+" has been consumed. + */ + + switch (lexer->substate) { + case Initial: + /* Attempt to consume 6 hex digits (or question marks) */ + for (; lexer->context.hexCount < 6; lexer->context.hexCount++) { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + if (lexer->context.hexCount == 0) { + /* Remove '+' */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + /* u == IDENT */ + return emitToken(lexer, + CSS_TOKEN_IDENT, token); + } else { + return emitToken(lexer, + CSS_TOKEN_UNICODE_RANGE, token); + } + } + + c = *((uint8_t *) cptr); + + if (isHex(c) || c == '?') { + APPEND(lexer, cptr, clen); + } else { + break; + } + } + + if (lexer->context.hexCount == 0) { + /* We didn't consume any valid Unicode Range digits */ + /* Remove the '+' */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + /* 'u' == IDENT */ + return emitToken(lexer, CSS_TOKEN_IDENT, token); + } + + if (lexer->context.hexCount == 6) { + /* Consumed 6 valid characters. Look for '-' */ + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return emitToken(lexer, + CSS_TOKEN_UNICODE_RANGE, token); + + c = *((uint8_t *) cptr); + } + + /* If we've got a '-', then we may have a + * second range component */ + if (c != '-') { + /* Reached the end of the range */ + return emitToken(lexer, CSS_TOKEN_UNICODE_RANGE, token); + } + + APPEND(lexer, cptr, clen); + + /* Reset count for next set of digits */ + lexer->context.hexCount = 0; + + /* Fall through */ + case MoreDigits: + lexer->substate = MoreDigits; + + /* Consume up to 6 hex digits */ + for (; lexer->context.hexCount < 6; lexer->context.hexCount++) { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + if (lexer->context.hexCount == 0) { + /* Remove '-' */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + } + + return emitToken(lexer, + CSS_TOKEN_UNICODE_RANGE, token); + } + + c = *((uint8_t *) cptr); + + if (isHex(c)) { + APPEND(lexer, cptr, clen); + } else { + break; + } + } + + if (lexer->context.hexCount == 0) { + /* No hex digits consumed. Remove '-' */ + lexer->bytesReadForToken -= 1; + t->data.len -= 1; + } + } + + return emitToken(lexer, CSS_TOKEN_UNICODE_RANGE, token); +} + +/****************************************************************************** + * Input consumers * + ******************************************************************************/ + +css_error consumeDigits(css_lexer *lexer) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + + /* digit = [0-9] */ + + /* Consume all digits */ + do { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_OK; + + c = *((uint8_t *) cptr); + + if (isDigit(c)) { + APPEND(lexer, cptr, clen); + } + } while (isDigit(c)); + + return CSS_OK; +} + +css_error consumeEscape(css_lexer *lexer, bool nl) +{ + uintptr_t cptr, sptr; + uint8_t c; + size_t clen, slen; + css_error error; + + /* escape = unicode | '\' [^\n\r\f0-9a-fA-F] + * + * The '\' has been consumed. + */ + + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_EOF; + + c = *((uint8_t *) cptr); + + if (!nl && (c == '\n' || c == '\r' || c == '\f')) { + /* These are not permitted */ + return CSS_INVALID; + } + + /* Create unescaped buffer, if it doesn't already exist */ + if (lexer->unescapedTokenData == NULL) { + lexer->unescapedTokenData = + parserutils_buffer_create(lexer->alloc, lexer->pw); + if (lexer->unescapedTokenData == NULL) + return CSS_NOMEM; + } + + /* If this is the first escaped character we've seen for this token, + * we must copy the characters we've read to the unescaped buffer */ + if (!lexer->escapeSeen) { + if (lexer->bytesReadForToken > 1) { + sptr = parserutils_inputstream_peek( + lexer->input, 0, &slen); + + assert(sptr != PARSERUTILS_INPUTSTREAM_EOF && + sptr != PARSERUTILS_INPUTSTREAM_OOD); + + /* -1 to skip '\\' */ + error = css_error_from_parserutils_error( + parserutils_buffer_append( + lexer->unescapedTokenData, + (const uint8_t *) sptr, + lexer->bytesReadForToken - 1)); + if (error != CSS_OK) + return error; + } + + lexer->token.data.len = lexer->bytesReadForToken - 1; + lexer->escapeSeen = true; + } + + if (isHex(c)) { + lexer->bytesReadForToken += clen; + + error = consumeUnicode(lexer, charToHex(c)); + if (error != CSS_OK) { + /* Rewind for next time */ + lexer->bytesReadForToken -= clen; + } + + return error; + } + + /* If we're handling escaped newlines, convert CR(LF)? to LF */ + if (nl && c == '\r') { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken + clen, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) { + c = '\n'; + APPEND(lexer, &c, 1); + + lexer->currentCol = 1; + lexer->currentLine++; + + return CSS_OK; + } + + c = *((uint8_t *) cptr); + + if (c == '\n') { + APPEND(lexer, &c, 1); + /* And skip the '\r' in the input */ + lexer->bytesReadForToken += clen; + + lexer->currentCol = 1; + lexer->currentLine++; + + return CSS_OK; + } + } else if (nl && (c == '\n' || c == '\f')) { + /* APPEND will increment this appropriately */ + lexer->currentCol = 0; + lexer->currentLine++; + } else if (c != '\n' && c != '\r' && c != '\f') { + lexer->currentCol++; + } + + /* Append the unescaped character */ + APPEND(lexer, cptr, clen); + + return CSS_OK; +} + +css_error consumeNMChars(css_lexer *lexer) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + + /* nmchar = [a-zA-Z] | '-' | '_' | nonascii | escape */ + + do { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_OK; + + c = *((uint8_t *) cptr); + + if (startNMChar(c) && c != '\\') { + APPEND(lexer, cptr, clen); + } + + if (c == '\\') { + lexer->bytesReadForToken += clen; + + error = consumeEscape(lexer, false); + if (error != CSS_OK) { + /* Rewind '\\', so we do the + * right thing next time */ + lexer->bytesReadForToken -= clen; + + /* Convert either EOF or INVALID into OK. + * This will cause the caller to believe that + * all NMChars in the sequence have been + * processed (and thus proceed to the next + * state). Eventually, the '\\' will be output + * as a CHAR. */ + if (error == CSS_EOF || error == CSS_INVALID) + return CSS_OK; + + return error; + } + } + } while (startNMChar(c)); + + return CSS_OK; +} + +css_error consumeString(css_lexer *lexer) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + uint8_t quote = lexer->context.first; + uint8_t permittedquote = (quote == '"') ? '\'' : '"'; + css_error error; + + /* string = '"' (stringchar | "'")* '"' | "'" (stringchar | '"')* "'" + * + * The open quote has been consumed. + */ + + do { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_EOF; + + c = *((uint8_t *) cptr); + + if (c == permittedquote) { + APPEND(lexer, cptr, clen); + } else if (startStringChar(c)) { + error = consumeStringChars(lexer); + if (error != CSS_OK) + return error; + } else if (c != quote) { + /* Invalid character in string -- skip */ + lexer->bytesReadForToken += clen; + } + } while(c != quote); + + /* Append closing quote to token data */ + APPEND(lexer, cptr, clen); + + return CSS_OK; +} + +css_error consumeStringChars(css_lexer *lexer) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + + /* stringchar = urlchar | ' ' | ')' | '\' nl */ + + do { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_OK; + + c = *((uint8_t *) cptr); + + if (startStringChar(c) && c != '\\') { + APPEND(lexer, cptr, clen); + } + + if (c == '\\') { + lexer->bytesReadForToken += clen; + + error = consumeEscape(lexer, true); + if (error != CSS_OK) { + /* Rewind '\\', so we do the + * right thing next time. */ + lexer->bytesReadForToken -= clen; + + /* Convert EOF to OK. This causes the caller + * to believe that all StringChars have been + * processed. Eventually, the '\\' will be + * output as a CHAR. */ + if (error == CSS_EOF) + return CSS_OK; + + return error; + } + } + } while (startStringChar(c)); + + return CSS_OK; + +} + +css_error consumeUnicode(css_lexer *lexer, uint32_t ucs) +{ + uintptr_t cptr = PARSERUTILS_INPUTSTREAM_OOD; /* GCC: shush */ + uint8_t c = 0; + size_t clen; + uint8_t utf8[6]; + uint8_t *utf8ptr = utf8; + size_t utf8len = sizeof(utf8); + size_t bytesReadInit = lexer->bytesReadForToken; + int count; + parserutils_error error; + + /* unicode = '\' [0-9a-fA-F]{1,6} wc? + * + * The '\' and the first digit have been consumed. + */ + + /* Attempt to consume a further five hex digits */ + for (count = 0; count < 5; count++) { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) { + /* Rewind what we've read */ + lexer->bytesReadForToken = bytesReadInit; + return CSS_NEEDDATA; + } + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + break; + + c = *((uint8_t *) cptr); + + if (isHex(c)) { + lexer->bytesReadForToken += clen; + + ucs = (ucs << 4) | charToHex(c); + } else { + break; + } + } + + /* Convert our UCS4 character to UTF-8 */ + error = parserutils_charset_utf8_from_ucs4(ucs, &utf8ptr, &utf8len); + assert(error == PARSERUTILS_OK); + + /* Append it to the token data (unescaped buffer already set up) */ + /* We can't use the APPEND() macro here as we want to rewind correctly + * on error. Additionally, lexer->bytesReadForToken has already been + * advanced */ + error = appendToTokenData(lexer, (const uint8_t *) utf8, + sizeof(utf8) - utf8len); + if (error != CSS_OK) { + /* Rewind what we've read */ + lexer->bytesReadForToken = bytesReadInit; + return error; + } + + /* Finally, attempt to skip a whitespace character */ + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_OK; + + if (isSpace(c)) { + lexer->bytesReadForToken += clen; + } + + /* +2 for '\' and first digit */ + lexer->currentCol += lexer->bytesReadForToken - bytesReadInit + 2; + + return CSS_OK; +} + +css_error consumeURLChars(css_lexer *lexer) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + css_error error; + + /* urlchar = [\t!#-&(*-~] | nonascii | escape */ + + do { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_OK; + + c = *((uint8_t *) cptr); + + if (startURLChar(c) && c != '\\') { + APPEND(lexer, cptr, clen); + } + + if (c == '\\') { + lexer->bytesReadForToken += clen; + + error = consumeEscape(lexer, false); + if (error != CSS_OK) { + /* Rewind '\\', so we do the + * right thing next time */ + lexer->bytesReadForToken -= clen; + + /* Convert either EOF or INVALID into OK. + * This will cause the caller to believe that + * all URLChars in the sequence have been + * processed (and thus proceed to the next + * state). Eventually, the '\\' will be output + * as a CHAR. */ + if (error == CSS_EOF || error == CSS_INVALID) + return CSS_OK; + + return error; + } + } + } while (startURLChar(c)); + + return CSS_OK; +} + +css_error consumeWChars(css_lexer *lexer) +{ + uintptr_t cptr; + uint8_t c; + size_t clen; + + do { + cptr = parserutils_inputstream_peek(lexer->input, + lexer->bytesReadForToken, &clen); + if (cptr == PARSERUTILS_INPUTSTREAM_OOD) + return CSS_NEEDDATA; + + if (cptr == PARSERUTILS_INPUTSTREAM_EOF) + return CSS_OK; + + c = *((uint8_t *) cptr); + + if (isSpace(c)) { + APPEND(lexer, cptr, clen); + } + + if (c == '\n' || c == '\f') { + lexer->currentCol = 1; + lexer->currentLine++; + } + + if (lexer->context.lastWasCR && c != '\n') { + lexer->currentCol = 1; + lexer->currentLine++; + } + lexer->context.lastWasCR = (c == '\r'); + } while (isSpace(c)); + + if (lexer->context.lastWasCR) { + lexer->currentCol = 1; + lexer->currentLine++; + } + + return CSS_OK; +} + +/****************************************************************************** + * More utility routines * + ******************************************************************************/ + +uint32_t charToHex(uint8_t c) +{ + switch (c) { + case 'a': case 'A': + return 0xa; + case 'b': case 'B': + return 0xb; + case 'c': case 'C': + return 0xc; + case 'd': case 'D': + return 0xd; + case 'e': case 'E': + return 0xe; + case 'f': case 'F': + return 0xf; + case '0': + return 0x0; + case '1': + return 0x1; + case '2': + return 0x2; + case '3': + return 0x3; + case '4': + return 0x4; + case '5': + return 0x5; + case '6': + return 0x6; + case '7': + return 0x7; + case '8': + return 0x8; + case '9': + return 0x9; + } + + return 0; +} + +bool startNMChar(uint8_t c) +{ + return c == '_' || ('a' <= c && c <= 'z') || ('A' <= c && c <= 'Z') || + ('0' <= c && c <= '9') || c == '-' || c >= 0x80 || c == '\\'; +} + +bool startNMStart(uint8_t c) +{ + return c == '_' || ('a' <= c && c <= 'z') || ('A' <= c && c <= 'Z') || + c >= 0x80 || c == '\\'; +} + +bool startStringChar(uint8_t c) +{ + return startURLChar(c) || c == ' ' || c == ')'; +} + +bool startURLChar(uint8_t c) +{ + return c == '\t' || c == '!' || ('#' <= c && c <= '&') || c == '(' || + ('*' <= c && c <= '~') || c >= 0x80 || c == '\\'; +} + +bool isDigit(uint8_t c) +{ + return '0' <= c && c <= '9'; +} + +bool isHex(uint8_t c) +{ + return isDigit(c) || ('a' <= c && c <= 'f') || ('A' <= c && c <= 'F'); +} + +bool isSpace(uint8_t c) +{ + return c == ' ' || c == '\r' || c == '\n' || c == '\f' || c == '\t'; +} + diff --git a/src/lex/lex.h b/src/lex/lex.h new file mode 100644 index 0000000..150823e --- /dev/null +++ b/src/lex/lex.h @@ -0,0 +1,67 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2008 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_lex_lex_h_ +#define css_lex_lex_h_ + +#include <libcss/functypes.h> +#include <libcss/types.h> + +#include <parserutils/input/inputstream.h> + +typedef struct css_lexer css_lexer; + +/** + * Lexer option types + */ +typedef enum css_lexer_opttype { + CSS_LEXER_EMIT_COMMENTS, +} css_lexer_opttype; + +/** + * Lexer option parameters + */ +typedef union css_lexer_optparams { + bool emit_comments; +} css_lexer_optparams; + +/** + * Token type + */ +typedef enum css_token_type{ + CSS_TOKEN_IDENT, CSS_TOKEN_ATKEYWORD, CSS_TOKEN_STRING, + CSS_TOKEN_HASH, CSS_TOKEN_NUMBER, CSS_TOKEN_PERCENTAGE, + CSS_TOKEN_DIMENSION, CSS_TOKEN_URI, CSS_TOKEN_UNICODE_RANGE, + CSS_TOKEN_CDO, CSS_TOKEN_CDC, CSS_TOKEN_S, CSS_TOKEN_COMMENT, + CSS_TOKEN_FUNCTION, CSS_TOKEN_INCLUDES, CSS_TOKEN_DASHMATCH, + CSS_TOKEN_PREFIXMATCH, CSS_TOKEN_SUFFIXMATCH, CSS_TOKEN_SUBSTRINGMATCH, + CSS_TOKEN_CHAR, CSS_TOKEN_EOF +} css_token_type; + +/** + * Token object + */ +typedef struct css_token { + css_token_type type; + + css_string data; + + uint32_t col; + uint32_t line; +} css_token; + +css_lexer *css_lexer_create(parserutils_inputstream *input, + css_alloc alloc, void *pw); +void css_lexer_destroy(css_lexer *lexer); + +css_error css_lexer_setopt(css_lexer *lexer, css_lexer_opttype type, + css_lexer_optparams *params); + +css_error css_lexer_get_token(css_lexer *lexer, const css_token **token); + +#endif + diff --git a/src/libcss.c b/src/libcss.c new file mode 100644 index 0000000..b5b99c9 --- /dev/null +++ b/src/libcss.c @@ -0,0 +1,50 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#include <parserutils/parserutils.h> + +#include <libcss/libcss.h> + +#include "utils/parserutilserror.h" + +/** + * Initialise the CSS library for use. + * + * This _must_ be called before using any LibCSS functions + * + * \param aliases_file Pointer to name of file containing encoding alias data + * \param alloc Pointer to (de)allocation function + * \param pw Pointer to client-specific private data (may be NULL) + * \return CSS_OK on success, applicable error otherwise. + */ +css_error css_initialise(const char *aliases_file, + css_alloc alloc, void *pw) +{ + if (aliases_file == NULL || alloc == NULL) + return CSS_BADPARM; + + return css_error_from_parserutils_error( + parserutils_initialise(aliases_file, alloc, pw)); +} + +/** + * Clean up after LibCSS + * + * \param alloc Pointer to (de)allocation function + * \param pw Pointer to client-specific private data (may be NULL) + * \return CSS_OK on success, applicable error otherwise. + */ +css_error css_finalise(css_alloc alloc, void *pw) +{ + if (alloc == NULL) + return CSS_BADPARM; + + return css_error_from_parserutils_error( + parserutils_finalise(alloc, pw)); +} + + diff --git a/src/utils/Makefile b/src/utils/Makefile new file mode 100644 index 0000000..912590c --- /dev/null +++ b/src/utils/Makefile @@ -0,0 +1,46 @@ +# Child makefile fragment +# +# Toolchain is provided by top-level makefile +# +# Variables provided by top-level makefile +# +# COMPONENT The name of the component +# EXPORT The location of the export directory +# TOP The location of the source tree root +# RELEASEDIR The place to put release objects +# DEBUGDIR The place to put debug objects +# +# do_include Canned command sequence to include a child makefile +# +# Variables provided by parent makefile: +# +# DIR The name of the directory we're in, relative to $(TOP) +# +# Variables we can manipulate: +# +# ITEMS_CLEAN The list of items to remove for "make clean" +# ITEMS_DISTCLEAN The list of items to remove for "make distclean" +# TARGET_TESTS The list of target names to run for "make test" +# +# SOURCES The list of sources to build for $(COMPONENT) +# +# Plus anything from the toolchain + +# Push parent directory onto the directory stack +sp := $(sp).x +dirstack_$(sp) := $(d) +d := $(DIR) + +# Sources +SRCS_$(d) := errors.c + +# Append to sources for component +SOURCES += $(addprefix $(d), $(SRCS_$(d))) + +# Now include any children we may have +MAKE_INCLUDES := $(wildcard $(d)*/Makefile) +$(eval $(foreach INC, $(MAKE_INCLUDES), $(call do_include,$(INC)))) + +# Finally, pop off the directory stack +d := $(dirstack_$(sp)) +sp := $(basename $(sp)) diff --git a/src/utils/errors.c b/src/utils/errors.c new file mode 100644 index 0000000..ac7dd42 --- /dev/null +++ b/src/utils/errors.c @@ -0,0 +1,80 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#include <string.h> + +#include <libcss/errors.h> + +/** + * Convert a LibCSS error code to a string + * + * \param error The error code to convert + * \return Pointer to string representation of error, or NULL if unknown. + */ +const char *css_error_to_string(css_error error) +{ + const char *result = NULL; + + switch (error) { + case CSS_OK: + result = "No error"; + break; + case CSS_NOMEM: + result = "Insufficient memory"; + break; + case CSS_BADPARM: + result = "Bad parameter"; + break; + case CSS_INVALID: + result = "Invalid input"; + break; + case CSS_FILENOTFOUND: + result = "File not found"; + break; + case CSS_NEEDDATA: + result = "Insufficient data"; + break; + case CSS_BADCHARSET: + result = "BOM and @charset mismatch"; + break; + case CSS_EOF: + result = "EOF encountered"; + break; + } + + return result; +} + +/** + * Convert a string representation of an error name to a LibCSS error code + * + * \param str String containing error name + * \param len Length of string (bytes) + * \return LibCSS error code, or CSS_OK if unknown + */ +css_error css_error_from_string(const char *str, size_t len) +{ + if (strncmp(str, "CSS_OK", len) == 0) { + return CSS_OK; + } else if (strncmp(str, "CSS_NOMEM", len) == 0) { + return CSS_NOMEM; + } else if (strncmp(str, "CSS_BADPARM", len) == 0) { + return CSS_BADPARM; + } else if (strncmp(str, "CSS_INVALID", len) == 0) { + return CSS_INVALID; + } else if (strncmp(str, "CSS_FILENOTFOUND", len) == 0) { + return CSS_FILENOTFOUND; + } else if (strncmp(str, "CSS_NEEDDATA", len) == 0) { + return CSS_NEEDDATA; + } else if (strncmp(str, "CSS_BADCHARSET", len) == 0) { + return CSS_BADCHARSET; + } else if (strncmp(str, "CSS_EOF", len) == 0) { + return CSS_EOF; + } + + return CSS_OK; +} diff --git a/src/utils/parserutilserror.h b/src/utils/parserutilserror.h new file mode 100644 index 0000000..d2cffb6 --- /dev/null +++ b/src/utils/parserutilserror.h @@ -0,0 +1,29 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_utils_parserutilserror_h_ +#define css_utils_parserutilserror_h_ + +#include <parserutils/errors.h> + +#include <libcss/errors.h> + +/** + * Convert a ParserUtils error into a LibCSS error + * + * \param error The ParserUtils error to convert + * \return The corresponding LibCSS error + */ +static inline css_error css_error_from_parserutils_error( + parserutils_error error) +{ + /* Currently, there's a 1:1 mapping, so we've nothing to do */ + return (css_error) error; +} + +#endif + diff --git a/src/utils/utils.h b/src/utils/utils.h new file mode 100644 index 0000000..ac19e59 --- /dev/null +++ b/src/utils/utils.h @@ -0,0 +1,28 @@ +/* + * This file is part of LibCSS. + * Licensed under the MIT License, + * http://www.opensource.org/licenses/mit-license.php + * Copyright 2007 John-Mark Bell <jmb@netsurf-browser.org> + */ + +#ifndef css_utils_h_ +#define css_utils_h_ + +#ifndef max +#define max(a,b) ((a)>(b)?(a):(b)) +#endif + +#ifndef min +#define min(a,b) ((a)<(b)?(a):(b)) +#endif + +#ifndef SLEN +/* Calculate length of a string constant */ +#define SLEN(s) (sizeof((s)) - 1) /* -1 for '\0' */ +#endif + +#ifndef UNUSED +#define UNUSED(x) ((x)=(x)) +#endif + +#endif diff --git a/test/INDEX b/test/INDEX new file mode 100644 index 0000000..e1896ef --- /dev/null +++ b/test/INDEX @@ -0,0 +1,10 @@ +# Index of testcases +# +# Test Description DataDir + +libcss Library initialisation/finalisation +csdetect Character set detection csdetect +lex Lexing css + +# Regression tests + diff --git a/test/Makefile b/test/Makefile new file mode 100644 index 0000000..e904397 --- /dev/null +++ b/test/Makefile @@ -0,0 +1,79 @@ +# Child makefile fragment +# +# Toolchain is provided by top-level makefile +# +# Variables provided by top-level makefile +# +# COMPONENT The name of the component +# EXPORT The location of the export directory +# TOP The location of the source tree root +# RELEASEDIR The place to put release objects +# DEBUGDIR The place to put debug objects +# +# do_include Canned command sequence to include a child makefile +# +# Variables provided by parent makefile: +# +# DIR The name of the directory we're in, relative to $(TOP) +# +# Variables we can manipulate: +# +# ITEMS_CLEAN The list of items to remove for "make clean" +# ITEMS_DISTCLEAN The list of items to remove for "make distclean" +# TARGET_TESTS The list of target names to run for "make test" +# +# SOURCES The list of sources to build for $(COMPONENT) +# +# Plus anything from the toolchain + +# Push parent directory onto the directory stack +sp := $(sp).x +dirstack_$(sp) := $(d) +d := $(DIR) + +# Extend toolchain settings +CFLAGS := $(CFLAGS) -I$(TOP)/src/ -I$(d) + +# Tests +TESTS_$(d) := csdetect lex libcss +TESTS_$(d) := $(TESTS_$(d)) + +# Items for top-level makefile to use +ITEMS_CLEAN := $(ITEMS_CLEAN) \ + $(addprefix $(d), $(addsuffix $(EXEEXT), $(TESTS_$(d)))) \ + $(addprefix $(d), $(addsuffix .gcda, $(TESTS_$(d)))) \ + $(addprefix $(d), $(addsuffix .gcno, $(TESTS_$(d)))) +ITEMS_DISTCLEAN := $(ITEMS_DISTCLEAN) $(d)log + +# Targets for top-level makefile to run +TARGET_TESTS := $(TARGET_TESTS) test_$(d) + +# Now we get to hack around so that we know what directory we're in. +# $(d) no longer exists when running the commands for a target, so we can't +# simply use it verbatim. Assigning to a variable doesn't really help, as +# there's no guarantee that someone else hasn't overridden that variable. +# So, what we do is make the target depend on $(d), then pick it out of the +# dependency list when running commands. This isn't pretty, but is effective. +test_$(d): $(d) $(addprefix $(d), $(TESTS_$(d))) + @$(PERL) $(TOP)/$<testrunner.pl $(TOP)/$< $(EXEEXT) + +# Build rules for each test binary -- they all depend on the debug library +define compile_test +$(2): $$(TOP)/$$(COMPONENT)-debug.a $(1) + @$$(ECHO) $$(ECHOFLAGS) "==> $(1)" + @$$(CC) -c -g $$(DEBUGCFLAGS) -o $$@.o $(1) + @$$(LD) -g -o $$@ $$@.o -lcss-debug $$(LDFLAGS) + @$$(RM) $$(RMFLAGS) $$@.o + +endef + +$(eval $(foreach TEST,$(addprefix $(d), $(TESTS_$(d))), \ + $(call compile_test,$(addsuffix .c, $(TEST)),$(TEST)))) + +# Now include any children we may have +MAKE_INCLUDES := $(wildcard $(d)*/Makefile) +$(eval $(foreach INC, $(MAKE_INCLUDES), $(call do_include,$(INC)))) + +# Finally, pop off the directory stack +d := $(dirstack_$(sp)) +sp := $(basename $(sp)) diff --git a/test/README b/test/README new file mode 100644 index 0000000..f408e72 --- /dev/null +++ b/test/README @@ -0,0 +1,84 @@ +LibCSS testcases +=============== + +Testcases for LibCSS are self-contained binaries which test various parts +of the CSS library. These may make use of external data files to drive +the testing. + +Testcase command lines +---------------------- + +Testcase command lines are in a unified format, thus: + + <aliases_file> [ <data_file> ] + +The aliases file parameter will always be specified (as it is required for +the library to work at all). + +The data file parameter is optional and may be provided on a test-by-test +basis. + +Testcase output +--------------- + +Testcases may output anything at all to stdout. The final line of the +output must begin with either PASS or FAIL (case sensitive), indicating +the success status of the test. + +Test Index +---------- + +In the test sources directory, is a file, named INDEX, which provides an +index of all available test binaries. Any new test applications should be +added to this index as they are created. + +The test index file format is as follows: + + file = *line + + line = ( entry / comment / blank ) LF + + entry = testname 1*HTAB description [ 1*HTAB datadir ] + comment = "#" *non-newline + blank = 0<OCTET> + + testname = 1*non-reserved + description = 1*non-reserved + datadir = 1*non-reserved + + non-newline = VCHAR / WSP + non-reserved = VCHAR / SP + +Each entry contains a mandatory binary name and description followed by +an optional data directory specifier. The data directory specifier is +used to state the name of the directory containing data files for the +test name. This directory will be searched for within the "data" +directory in the source tree. + +If a data directory is specified, the test binary will be invoked for +each data file listed within the data directory INDEX, passing the +filename as the second parameter (<data_file>, above). + +Data Index +---------- + +Each test data directory contains a file, named INDEX, which provides an +index of all available test data files. + +The data index file format is as follows: + + file = *line + + line = ( entry / comment / blank ) LF + + entry = dataname 1*HTAB description + comment = "#" *non-newline + blank = 0<OCTET> + + dataname = 1*non-reserved + description = 1*non-reserved + + non-newline = VCHAR / WSP + non-reserved = VCHAR / SP + +Each entry contains a mandatory data file name and description. diff --git a/test/csdetect.c b/test/csdetect.c new file mode 100644 index 0000000..c452b5b --- /dev/null +++ b/test/csdetect.c @@ -0,0 +1,133 @@ +#include <inttypes.h> +#include <stdbool.h> +#include <stdio.h> +#include <stdlib.h> +#include <string.h> + +#include <parserutils/charset/mibenum.h> + +#include <libcss/libcss.h> + +#include "charset/detect.h" +#include "utils/utils.h" + +#include "testutils.h" + +typedef struct line_ctx { + size_t buflen; + size_t bufused; + uint8_t *buf; + char enc[64]; + bool indata; + bool inenc; +} line_ctx; + +static bool handle_line(const char *data, size_t datalen, void *pw); +static void run_test(const uint8_t *data, size_t len, char *expected); + +static void *myrealloc(void *ptr, size_t len, void *pw) +{ + UNUSED(pw); + + return realloc(ptr, len); +} + +int main(int argc, char **argv) +{ + line_ctx ctx; + + if (argc != 3) { + printf("Usage: %s <aliases_file> <filename>\n", argv[0]); + return 1; + } + + assert(css_initialise(argv[1], myrealloc, NULL) == CSS_OK); + + ctx.buflen = parse_filesize(argv[2]); + if (ctx.buflen == 0) + return 1; + + ctx.buf = malloc(ctx.buflen); + if (ctx.buf == NULL) { + printf("Failed allocating %u bytes\n", + (unsigned int) ctx.buflen); + return 1; + } + + ctx.buf[0] = '\0'; + ctx.enc[0] = '\0'; + ctx.bufused = 0; + ctx.indata = false; + ctx.inenc = false; + + assert(parse_testfile(argv[2], handle_line, &ctx) == true); + + /* and run final test */ + if (ctx.bufused > 0 && ctx.buf[ctx.bufused - 1] == '\n') + ctx.bufused -= 1; + + run_test(ctx.buf, ctx.bufused, ctx.enc); + + free(ctx.buf); + + assert(css_finalise(myrealloc, NULL) == CSS_OK); + + printf("PASS\n"); + + return 0; +} + +bool handle_line(const char *data, size_t datalen, void *pw) +{ + line_ctx *ctx = (line_ctx *) pw; + + if (data[0] == '#') { + if (ctx->inenc) { + /* This marks end of testcase, so run it */ + + if (ctx->buf[ctx->bufused - 1] == '\n') + ctx->bufused -= 1; + + run_test(ctx->buf, ctx->bufused, ctx->enc); + + ctx->buf[0] = '\0'; + ctx->enc[0] = '\0'; + ctx->bufused = 0; + } + + ctx->indata = (strncasecmp(data+1, "data", 4) == 0); + ctx->inenc = (strncasecmp(data+1, "encoding", 8) == 0); + } else { + if (ctx->indata) { + memcpy(ctx->buf + ctx->bufused, data, datalen); + ctx->bufused += datalen; + } + if (ctx->inenc) { + strcpy(ctx->enc, data); + if (ctx->enc[strlen(ctx->enc) - 1] == '\n') + ctx->enc[strlen(ctx->enc) - 1] = '\0'; + } + } + + return true; +} + +void run_test(const uint8_t *data, size_t len, char *expected) +{ + uint16_t mibenum = 0; + css_charset_source source = CSS_CHARSET_DEFAULT; + static int testnum; + + assert(css_charset_extract(data, len, &mibenum, &source) == CSS_OK); + + assert(mibenum != 0); + + printf("%d: Detected charset %s (%d) Source %d Expected %s (%d)\n", + ++testnum, parserutils_charset_mibenum_to_name(mibenum), + mibenum, source, expected, + parserutils_charset_mibenum_from_name( + expected, strlen(expected))); + + assert(mibenum == parserutils_charset_mibenum_from_name( + expected, strlen(expected))); +} diff --git a/test/data/Aliases b/test/data/Aliases new file mode 100644 index 0000000..db61ff1 --- /dev/null +++ b/test/data/Aliases @@ -0,0 +1,302 @@ +# > Unicode:Files.Aliases +# Mapping of character set encoding names to their canonical form +# +# Lines starting with a '#' are comments, blank lines are ignored. +# +# Based on http://www.iana.org/assignments/character-sets and +# http://www.iana.org/assignments/ianacharset-mib +# +# Canonical Form MIBenum Aliases... +# +US-ASCII 3 iso-ir-6 ANSI_X3.4-1986 ISO_646.irv:1991 ASCII ISO646-US ANSI_X3.4-1968 us IBM367 cp367 csASCII +ISO-10646-UTF-1 27 csISO10646UTF1 +ISO_646.basic:1983 28 ref csISO646basic1983 +INVARIANT 29 csINVARIANT +ISO_646.irv:1983 30 iso-ir-2 irv csISO2IntlRefVersion +BS_4730 20 iso-ir-4 ISO646-GB gb uk csISO4UnitedKingdom +NATS-SEFI 31 iso-ir-8-1 csNATSSEFI +NATS-SEFI-ADD 32 iso-ir-8-2 csNATSSEFIADD +NATS-DANO 33 iso-ir-9-1 csNATSDANO +NATS-DANO-ADD 34 iso-ir-9-2 csNATSDANOADD +SEN_850200_B 35 iso-ir-10 FI ISO646-FI ISO646-SE se csISO10Swedish +SEN_850200_C 21 iso-ir-11 ISO646-SE2 se2 csISO11SwedishForNames +KS_C_5601-1987 36 iso-ir-149 KS_C_5601-1989 KSC_5601 korean csKSC56011987 +ISO-2022-KR 37 csISO2022KR +EUC-KR 38 csEUCKR EUCKR +ISO-2022-JP 39 csISO2022JP +ISO-2022-JP-2 40 csISO2022JP2 +ISO-2022-CN 104 +ISO-2022-CN-EXT 105 +JIS_C6220-1969-jp 41 JIS_C6220-1969 iso-ir-13 katakana x0201-7 csISO13JISC6220jp +JIS_C6220-1969-ro 42 iso-ir-14 jp ISO646-JP csISO14JISC6220ro +IT 22 iso-ir-15 ISO646-IT csISO15Italian +PT 43 iso-ir-16 ISO646-PT csISO16Portuguese +ES 23 iso-ir-17 ISO646-ES csISO17Spanish +greek7-old 44 iso-ir-18 csISO18Greek7Old +latin-greek 45 iso-ir-19 csISO19LatinGreek +DIN_66003 24 iso-ir-21 de ISO646-DE csISO21German +NF_Z_62-010_(1973) 46 iso-ir-25 ISO646-FR1 csISO25French +Latin-greek-1 47 iso-ir-27 csISO27LatinGreek1 +ISO_5427 48 iso-ir-37 csISO5427Cyrillic +JIS_C6226-1978 49 iso-ir-42 csISO42JISC62261978 +BS_viewdata 50 iso-ir-47 csISO47BSViewdata +INIS 51 iso-ir-49 csISO49INIS +INIS-8 52 iso-ir-50 csISO50INIS8 +INIS-cyrillic 53 iso-ir-51 csISO51INISCyrillic +ISO_5427:1981 54 iso-ir-54 ISO5427Cyrillic1981 +ISO_5428:1980 55 iso-ir-55 csISO5428Greek +GB_1988-80 56 iso-ir-57 cn ISO646-CN csISO57GB1988 +GB_2312-80 57 iso-ir-58 chinese csISO58GB231280 +NS_4551-1 25 iso-ir-60 ISO646-NO no csISO60DanishNorwegian csISO60Norwegian1 +NS_4551-2 58 ISO646-NO2 iso-ir-61 no2 csISO61Norwegian2 +NF_Z_62-010 26 iso-ir-69 ISO646-FR fr csISO69French +videotex-suppl 59 iso-ir-70 csISO70VideotexSupp1 +PT2 60 iso-ir-84 ISO646-PT2 csISO84Portuguese2 +ES2 61 iso-ir-85 ISO646-ES2 csISO85Spanish2 +MSZ_7795.3 62 iso-ir-86 ISO646-HU hu csISO86Hungarian +JIS_C6226-1983 63 iso-ir-87 x0208 JIS_X0208-1983 csISO87JISX0208 +greek7 64 iso-ir-88 csISO88Greek7 +ASMO_449 65 ISO_9036 arabic7 iso-ir-89 csISO89ASMO449 +iso-ir-90 66 csISO90 +JIS_C6229-1984-a 67 iso-ir-91 jp-ocr-a csISO91JISC62291984a +JIS_C6229-1984-b 68 iso-ir-92 ISO646-JP-OCR-B jp-ocr-b csISO92JISC62991984b +JIS_C6229-1984-b-add 69 iso-ir-93 jp-ocr-b-add csISO93JIS62291984badd +JIS_C6229-1984-hand 70 iso-ir-94 jp-ocr-hand csISO94JIS62291984hand +JIS_C6229-1984-hand-add 71 iso-ir-95 jp-ocr-hand-add csISO95JIS62291984handadd +JIS_C6229-1984-kana 72 iso-ir-96 csISO96JISC62291984kana +ISO_2033-1983 73 iso-ir-98 e13b csISO2033 +ANSI_X3.110-1983 74 iso-ir-99 CSA_T500-1983 NAPLPS csISO99NAPLPS +ISO-8859-1 4 iso-ir-100 ISO_8859-1 ISO_8859-1:1987 latin1 l1 IBM819 CP819 csISOLatin1 8859_1 ISO8859-1 +ISO-8859-2 5 iso-ir-101 ISO_8859-2 ISO_8859-2:1987 latin2 l2 csISOLatin2 8859_2 ISO8859-2 +T.61-7bit 75 iso-ir-102 csISO102T617bit +T.61-8bit 76 T.61 iso-ir-103 csISO103T618bit +ISO-8859-3 6 iso-ir-109 ISO_8859-3 ISO_8859-3:1988 latin3 l3 csISOLatin3 8859_3 ISO8859-3 +ISO-8859-4 7 iso-ir-110 ISO_8859-4 ISO_8859-4:1988 latin4 l4 csISOLatin4 8859_4 ISO8859-4 +ECMA-cyrillic 77 iso-ir-111 KOI8-E csISO111ECMACyrillic +CSA_Z243.4-1985-1 78 iso-ir-121 ISO646-CA csa7-1 ca csISO121Canadian1 +CSA_Z243.4-1985-2 79 iso-ir-122 ISO646-CA2 csa7-2 csISO122Canadian2 +CSA_Z243.4-1985-gr 80 iso-ir-123 csISO123CSAZ24341985gr +ISO-8859-6 9 iso-ir-127 ISO_8859-6 ISO_8859-6:1987 ECMA-114 ASMO-708 arabic csISOLatinArabic +ISO-8859-6-E 81 csISO88596E ISO_8859-6-E +ISO-8859-6-I 82 csISO88596I ISO_8859-6-I +ISO-8859-7 10 iso-ir-126 ISO_8859-7 ISO_8859-7:1987 ELOT_928 ECMA-118 greek greek8 csISOLatinGreek 8859_7 ISO8859-7 +T.101-G2 83 iso-ir-128 csISO128T101G2 +ISO-8859-8 11 iso-ir-138 ISO_8859-8 ISO_8859-8:1988 hebrew csISOLatinHebrew 8859_8 ISO8859-8 +ISO-8859-8-E 84 csISO88598E ISO_8859-8-E +ISO-8859-8-I 85 csISO88598I ISO_8859-8-I +CSN_369103 86 iso-ir-139 csISO139CSN369103 +JUS_I.B1.002 87 iso-ir-141 ISO646-YU js yu csISO141JUSIB1002 +ISO_6937-2-add 14 iso-ir-142 csISOTextComm +IEC_P27-1 88 iso-ir-143 csISO143IECP271 +ISO-8859-5 8 iso-ir-144 ISO_8859-5 ISO_8859-5:1988 cyrillic csISOLatinCyrillic 8859_5 ISO8859-5 +JUS_I.B1.003-serb 89 iso-ir-146 serbian csISO146Serbian +JUS_I.B1.003-mac 90 macedonian iso-ir-147 csISO147Macedonian +ISO-8859-9 12 iso-ir-148 ISO_8859-9 ISO_8859-9:1989 latin5 l5 csISOLatin5 8859_9 ISO8859-9 +greek-ccitt 91 iso-ir-150 csISO150 csISO150GreekCCITT +NC_NC00-10:81 92 cuba iso-ir-151 ISO646-CU csISO151Cuba +ISO_6937-2-25 93 iso-ir-152 csISO6937Add +GOST_19768-74 94 ST_SEV_358-88 iso-ir-153 csISO153GOST1976874 +ISO_8859-supp 95 iso-ir-154 latin1-2-5 csISO8859Supp +ISO_10367-box 96 iso-ir-155 csISO10367Box +ISO-8859-10 13 iso-ir-157 l6 ISO_8859-10:1992 csISOLatin6 latin6 8859_10 ISO8859-10 +latin-lap 97 lap iso-ir-158 csISO158Lap +JIS_X0212-1990 98 x0212 iso-ir-159 csISO159JISX02121990 +DS_2089 99 DS2089 ISO646-DK dk csISO646Danish +us-dk 100 csUSDK +dk-us 101 csDKUS +JIS_X0201 15 X0201 csHalfWidthKatakana +KSC5636 102 ISO646-KR csKSC5636 +ISO-10646-UCS-2 1000 csUnicode UCS-2 UCS2 +ISO-10646-UCS-4 1001 csUCS4 UCS-4 UCS4 +DEC-MCS 2008 dec csDECMCS +hp-roman8 2004 roman8 r8 csHPRoman8 +macintosh 2027 mac csMacintosh MACROMAN MAC-ROMAN X-MAC-ROMAN +IBM037 2028 cp037 ebcdic-cp-us ebcdic-cp-ca ebcdic-cp-wt ebcdic-cp-nl csIBM037 +IBM038 2029 EBCDIC-INT cp038 csIBM038 +IBM273 2030 CP273 csIBM273 +IBM274 2031 EBCDIC-BE CP274 csIBM274 +IBM275 2032 EBCDIC-BR cp275 csIBM275 +IBM277 2033 EBCDIC-CP-DK EBCDIC-CP-NO csIBM277 +IBM278 2034 CP278 ebcdic-cp-fi ebcdic-cp-se csIBM278 +IBM280 2035 CP280 ebcdic-cp-it csIBM280 +IBM281 2036 EBCDIC-JP-E cp281 csIBM281 +IBM284 2037 CP284 ebcdic-cp-es csIBM284 +IBM285 2038 CP285 ebcdic-cp-gb csIBM285 +IBM290 2039 cp290 EBCDIC-JP-kana csIBM290 +IBM297 2040 cp297 ebcdic-cp-fr csIBM297 +IBM420 2041 cp420 ebcdic-cp-ar1 csIBM420 +IBM423 2042 cp423 ebcdic-cp-gr csIBM423 +IBM424 2043 cp424 ebcdic-cp-he csIBM424 +IBM437 2011 cp437 437 csPC8CodePage437 +IBM500 2044 CP500 ebcdic-cp-be ebcdic-cp-ch csIBM500 +IBM775 2087 cp775 csPC775Baltic +IBM850 2009 cp850 850 csPC850Multilingual +IBM851 2045 cp851 851 csIBM851 +IBM852 2010 cp852 852 csPCp852 +IBM855 2046 cp855 855 csIBM855 +IBM857 2047 cp857 857 csIBM857 +IBM860 2048 cp860 860 csIBM860 +IBM861 2049 cp861 861 cp-is csIBM861 +IBM862 2013 cp862 862 csPC862LatinHebrew +IBM863 2050 cp863 863 csIBM863 +IBM864 2051 cp864 csIBM864 +IBM865 2052 cp865 865 csIBM865 +IBM866 2086 cp866 866 csIBM866 +IBM868 2053 CP868 cp-ar csIBM868 +IBM869 2054 cp869 869 cp-gr csIBM869 +IBM870 2055 CP870 ebcdic-cp-roece ebcdic-cp-yu csIBM870 +IBM871 2056 CP871 ebcdic-cp-is csIBM871 +IBM880 2057 cp880 EBCDIC-Cyrillic csIBM880 +IBM891 2058 cp891 csIBM891 +IBM903 2059 cp903 csIBM903 +IBM904 2060 cp904 904 csIBBM904 +IBM905 2061 CP905 ebcdic-cp-tr csIBM905 +IBM918 2062 CP918 ebcdic-cp-ar2 csIBM918 +IBM1026 2063 CP1026 csIBM1026 +EBCDIC-AT-DE 2064 csIBMEBCDICATDE +EBCDIC-AT-DE-A 2065 csEBCDICATDEA +EBCDIC-CA-FR 2066 csEBCDICCAFR +EBCDIC-DK-NO 2067 csEBCDICDKNO +EBCDIC-DK-NO-A 2068 csEBCDICDKNOA +EBCDIC-FI-SE 2069 csEBCDICFISE +EBCDIC-FI-SE-A 2070 csEBCDICFISEA +EBCDIC-FR 2071 csEBCDICFR +EBCDIC-IT 2072 csEBCDICIT +EBCDIC-PT 2073 csEBCDICPT +EBCDIC-ES 2074 csEBCDICES +EBCDIC-ES-A 2075 csEBCDICESA +EBCDIC-ES-S 2076 csEBCDICESS +EBCDIC-UK 2077 csEBCDICUK +EBCDIC-US 2078 csEBCDICUS +UNKNOWN-8BIT 2079 csUnknown8BiT +MNEMONIC 2080 csMnemonic +MNEM 2081 csMnem +VISCII 2082 csVISCII +VIQR 2083 csVIQR +KOI8-R 2084 csKOI8R +KOI8-U 2088 +IBM00858 2089 CCSID00858 CP00858 PC-Multilingual-850+euro +IBM00924 2090 CCSID00924 CP00924 ebcdic-Latin9--euro +IBM01140 2091 CCSID01140 CP01140 ebcdic-us-37+euro +IBM01141 2092 CCSID01141 CP01141 ebcdic-de-273+euro +IBM01142 2093 CCSID01142 CP01142 ebcdic-dk-277+euro ebcdic-no-277+euro +IBM01143 2094 CCSID01143 CP01143 ebcdic-fi-278+euro ebcdic-se-278+euro +IBM01144 2095 CCSID01144 CP01144 ebcdic-it-280+euro +IBM01145 2096 CCSID01145 CP01145 ebcdic-es-284+euro +IBM01146 2097 CCSID01146 CP01146 ebcdic-gb-285+euro +IBM01147 2098 CCSID01147 CP01147 ebcdic-fr-297+euro +IBM01148 2099 CCSID01148 CP01148 ebcdic-international-500+euro +IBM01149 2100 CCSID01149 CP01149 ebcdic-is-871+euro +Big5-HKSCS 2101 +IBM1047 2102 IBM-1047 +PTCP154 2103 csPTCP154 PT154 CP154 Cyrillic-Asian +Amiga-1251 2104 Ami1251 Amiga1251 Ami-1251 +KOI7-switched 2105 +UNICODE-1-1 1010 csUnicode11 +SCSU 1011 +UTF-7 1012 +UTF-16BE 1013 +UTF-16LE 1014 +UTF-16 1015 +CESU-8 1016 csCESU-8 +UTF-32 1017 +UTF-32BE 1018 +UTF-32LE 1019 +BOCU-1 1020 csBOCU-1 +UNICODE-1-1-UTF-7 103 csUnicode11UTF7 +UTF-8 106 UNICODE-1-1-UTF-8 UNICODE-2-0-UTF-8 utf8 +ISO-8859-13 109 8859_13 ISO8859-13 +ISO-8859-14 110 iso-ir-199 ISO_8859-14:1998 ISO_8859-14 latin8 iso-celtic l8 8859_14 ISO8859-14 +ISO-8859-15 111 ISO_8859-15 Latin-9 8859_15 ISO8859-15 +ISO-8859-16 112 iso-ir-226 ISO_8859-16:2001 ISO_8859-16 latin10 l10 +GBK 113 CP936 MS936 windows-936 +GB18030 114 +OSD_EBCDIC_DF04_15 115 +OSD_EBCDIC_DF03_IRV 116 +OSD_EBCDIC_DF04_1 117 +JIS_Encoding 16 csJISEncoding +Shift_JIS 17 MS_Kanji csShiftJIS X-SJIS Shift-JIS +EUC-JP 18 csEUCPkdFmtJapanese Extended_UNIX_Code_Packed_Format_for_Japanese EUCJP +Extended_UNIX_Code_Fixed_Width_for_Japanese 19 csEUCFixWidJapanese +ISO-10646-UCS-Basic 1002 csUnicodeASCII +ISO-10646-Unicode-Latin1 1003 csUnicodeLatin1 ISO-10646 +ISO-Unicode-IBM-1261 1005 csUnicodeIBM1261 +ISO-Unicode-IBM-1268 1006 csUnicodeIBM1268 +ISO-Unicode-IBM-1276 1007 csUnicodeIBM1276 +ISO-Unicode-IBM-1264 1008 csUnicodeIBM1264 +ISO-Unicode-IBM-1265 1009 csUnicodeIBM1265 +ISO-8859-1-Windows-3.0-Latin-1 2000 csWindows30Latin1 +ISO-8859-1-Windows-3.1-Latin-1 2001 csWindows31Latin1 +ISO-8859-2-Windows-Latin-2 2002 csWindows31Latin2 +ISO-8859-9-Windows-Latin-5 2003 csWindows31Latin5 +Adobe-Standard-Encoding 2005 csAdobeStandardEncoding +Ventura-US 2006 csVenturaUS +Ventura-International 2007 csVenturaInternational +PC8-Danish-Norwegian 2012 csPC8DanishNorwegian +PC8-Turkish 2014 csPC8Turkish +IBM-Symbols 2015 csIBMSymbols +IBM-Thai 2016 csIBMThai +HP-Legal 2017 csHPLegal +HP-Pi-font 2018 csHPPiFont +HP-Math8 2019 csHPMath8 +Adobe-Symbol-Encoding 2020 csHPPSMath +HP-DeskTop 2021 csHPDesktop +Ventura-Math 2022 csVenturaMath +Microsoft-Publishing 2023 csMicrosoftPublishing +Windows-31J 2024 csWindows31J +GB2312 2025 csGB2312 EUC-CN EUCCN CN-GB +Big5 2026 csBig5 BIG-FIVE BIG-5 CN-BIG5 BIG_FIVE +windows-1250 2250 CP1250 MS-EE +windows-1251 2251 CP1251 MS-CYRL +windows-1252 2252 CP1252 MS-ANSI +windows-1253 2253 CP1253 MS-GREEK +windows-1254 2254 CP1254 MS-TURK +windows-1255 2255 +windows-1256 2256 CP1256 MS-ARAB +windows-1257 2257 CP1257 WINBALTRIM +windows-1258 2258 +TIS-620 2259 +HZ-GB-2312 2085 + +# Additional encodings not defined by IANA + +# Arbitrary allocations +#CP737 3001 +#CP853 3002 +#CP856 3003 +CP874 3004 WINDOWS-874 +#CP922 3005 +#CP1046 3006 +#CP1124 3007 +#CP1125 3008 WINDOWS-1125 +#CP1129 3009 +#CP1133 3010 IBM-CP1133 +#CP1161 3011 IBM-1161 IBM1161 CSIBM1161 +#CP1162 3012 IBM-1162 IBM1162 CSIBM1162 +#CP1163 3013 IBM-1163 IBM1163 CSIBM1163 +#GEORGIAN-ACADEMY 3014 +#GEORGIAN-PS 3015 +#KOI8-RU 3016 +#KOI8-T 3017 +#MACARABIC 3018 X-MAC-ARABIC MAC-ARABIC +#MACCROATIAN 3019 X-MAC-CROATIAN MAC-CROATIAN +#MACGREEK 3020 X-MAC-GREEK MAC-GREEK +#MACHEBREW 3021 X-MAC-HEBREW MAC-HEBREW +#MACICELAND 3022 X-MAC-ICELAND MAC-ICELAND +#MACROMANIA 3023 X-MAC-ROMANIA MAC-ROMANIA +#MACTHAI 3024 X-MAC-THAI MAC-THAI +#MACTURKISH 3025 X-MAC-TURKISH MAC-TURKISH +#MULELAO-1 3026 + +# From Unicode Lib +ISO-IR-182 4000 +ISO-IR-197 4002 +ISO-2022-JP-1 4008 +MACCYRILLIC 4009 X-MAC-CYRILLIC MAC-CYRILLIC +MACUKRAINE 4010 X-MAC-UKRAINIAN MAC-UKRAINIAN +MACCENTRALEUROPE 4011 X-MAC-CENTRALEURROMAN MAC-CENTRALEURROMAN +JOHAB 4012 +ISO-8859-11 4014 iso-ir-166 ISO_8859-11 ISO8859-11 8859_11 +X-CURRENT 4999 X-SYSTEM +X-ACORN-LATIN1 5001 +X-ACORN-FUZZY 5002 diff --git a/test/data/csdetect/INDEX b/test/data/csdetect/INDEX new file mode 100644 index 0000000..fba6328 --- /dev/null +++ b/test/data/csdetect/INDEX @@ -0,0 +1,6 @@ +# Index file for charset detection tests +# +# Test Description + +bom.dat UTF Byte Order Mark detection tests +bom-charset.dat BOM + @charset tests diff --git a/test/data/csdetect/bom-charset.dat b/test/data/csdetect/bom-charset.dat new file mode 100644 index 0000000..b6eb9f7 --- /dev/null +++ b/test/data/csdetect/bom-charset.dat @@ -0,0 +1,21 @@ +#data +@charset "UTF-8";html{color:green} +/* starts with utf-8 bom */ +#encoding +utf-8 + +#data +@charset "ISO-8859-1";html{color:green} +/* starts with utf-8 bom, so @charset is ignored */ +#encoding +utf-8 + +#data +@charset "ISO-8859-2";html{color:green} +#encoding +iso-8859-2 + +#data +@charset "IMadeThisUp";html{color:green} +#encoding +utf-8 diff --git a/test/data/csdetect/bom.dat b/test/data/csdetect/bom.dat Binary files differnew file mode 100644 index 0000000..f8c3070 --- /dev/null +++ b/test/data/csdetect/bom.dat diff --git a/test/data/css/INDEX b/test/data/css/INDEX new file mode 100644 index 0000000..531d4a5 --- /dev/null +++ b/test/data/css/INDEX @@ -0,0 +1,6 @@ +# Index file for generic CSS content +# +# Test Description + +simple.css Reasonably simple CSS file (semantically invalid) +allzengarden.css All CSS Zen Garden stylesheets concatenated diff --git a/test/data/css/allzengarden.css b/test/data/css/allzengarden.css new file mode 100644 index 0000000..37a8d5a --- /dev/null +++ b/test/data/css/allzengarden.css @@ -0,0 +1,52816 @@ +/* css Zen Garden default style - 'Tranquille' by Dave Shea - http://www.mezzoblue.com/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea */
+/* Added: May 7th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the
+ designer's written permission. However, feel free to study the CSS and use
+ techniques you learn from it elsewhere. */
+
+
+/* The Zen Garden default was the first I put together, and almost didn't make the cut. I briefly flirted with using
+ 'Salmon Cream Cheese' as the main style for the Garden, but switched back to this one before launch.
+
+ All graphics in this design were illustrated by me in Photoshop. Google Image Search provided inspiration for
+ some of the elements. I did a bit of research on Kanji to come up with the characters on the top left. Anyone who
+ can read that will most likely tell you it makes no sense, but the best I could do was putting together the
+ characters for 'beginning' 'complete' and 'skill' to roughly say something like 'we're breaking fresh ground.'
+
+ It's a stretch. */
+
+
+/* basic elements */
+html {
+ margin: 0;
+ padding: 0;
+ }
+body {
+ font: 75% georgia, sans-serif;
+ line-height: 1.88889;
+ color: #555753;
+ background: #fff url(/001/blossoms.jpg) no-repeat bottom right;
+ margin: 0;
+ padding: 0;
+ }
+p {
+ margin-top: 0;
+ text-align: justify;
+ }
+h3 {
+ font: italic normal 1.4em georgia, sans-serif;
+ letter-spacing: 1px;
+ margin-bottom: 0;
+ color: #7D775C;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #B7A5DF;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #D4CDDC;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #9685BA;
+ }
+acronym {
+ border-bottom: none;
+ }
+
+
+/* specific divs */
+#container {
+ background: url(/001/zen-bg.jpg) no-repeat top left;
+ padding: 0 175px 0 110px;
+ margin: 0;
+ position: relative;
+ }
+
+#intro {
+ min-width: 470px;
+ width: 100%;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ background: transparent url(/001/h1.gif) no-repeat top left;
+ margin-top: 10px;
+ display: block;
+ width: 219px;
+ height: 87px;
+ float: left;
+ }
+#pageHeader h1 span {
+ display:none
+ }
+#pageHeader h2 {
+ background: transparent url(/001/h2.gif) no-repeat top left;
+ margin-top: 58px;
+ margin-bottom: 40px;
+ width: 200px;
+ height: 18px;
+ float: right;
+ }
+#pageHeader h2 span {
+ display:none
+ }
+#pageHeader {
+ padding-top: 20px;
+ height: 87px;
+}
+
+#quickSummary {
+ clear: both;
+ margin: 20px 20px 20px 10px;
+ width: 160px;
+ float: left;
+ }
+#quickSummary p {
+ font: italic 1.1em/2.2 georgia;
+ text-align: center;
+ }
+
+#preamble {
+ clear: right;
+ padding: 0px 10px 0 10px;
+ }
+#supportingText {
+ padding-left: 10px;
+ margin-bottom: 40px;
+ }
+
+#footer {
+ text-align: center;
+ }
+#footer a:link, #footer a:visited {
+ margin-right: 20px;
+ }
+
+#linkList {
+ margin-left: 600px;
+ position: absolute;
+ top: 0;
+ right: 0;
+ }
+#linkList2 {
+ font: 10px verdana, sans-serif;
+ background: transparent url(/001/paper-bg.jpg) top left repeat-y;
+ padding: 10px;
+ margin-top: 150px;
+ width: 130px;
+ }
+#linkList h3.select {
+ background: transparent url(/001/h3.gif) no-repeat top left;
+ margin: 10px 0 5px 0;
+ width: 97px;
+ height: 16px;
+ }
+#linkList h3.select span {
+ display:none
+ }
+#linkList h3.favorites {
+ background: transparent url(/001/h4.gif) no-repeat top left;
+ margin: 25px 0 5px 0;
+ width: 60px;
+ height: 18px;
+ }
+#linkList h3.favorites span {
+ display:none
+ }
+#linkList h3.archives {
+ background: transparent url(/001/h5.gif) no-repeat top left;
+ margin: 25px 0 5px 0;
+ width:57px;
+ height: 14px;
+ }
+#linkList h3.archives span {
+ display:none
+ }
+#linkList h3.resources {
+ background: transparent url(/001/h6.gif) no-repeat top left;
+ margin: 25px 0 5px 0;
+ width:63px;
+ height: 10px;
+ }
+#linkList h3.resources span {
+ display:none
+ }
+
+
+#linkList ul {
+ margin: 0;
+ padding: 0;
+ }
+#linkList li {
+ line-height: 1.3em;
+ background: transparent url(/001/cr1.gif) no-repeat top center;
+ display: block;
+ padding-top: 5px;
+ margin-bottom: 5px;
+ list-style-type: none;
+ }
+#linkList li a:link {
+ color: #988F5E;
+ }
+#linkList li a:visited {
+ color: #B3AE94;
+ }
+
+
+#extraDiv1 {
+ background: transparent url(/001/cr2.gif) top left no-repeat;
+ position: absolute;
+ top: 40px;
+ right: 0;
+ width: 148px;
+ height: 110px;
+ }
+.accesskey {
+ text-decoration: underline;
+ }/* css Zen Garden submission 002 - 'Salmon Cream Cheese' by Dave Shea - http://www.mezzoblue.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea */
+/* Added: May 7th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* If you're familiar with the life cycle of salmon, you'll know that at the end of their lives they fight their way upstream to
+ the rivers where they were born, to spawn and then die. Growing up close to one of these so-called 'salmon runs', I
+ once had a class field trip to the river for the afternoon to learn about the process. The funny thing about a bunch of
+ dead salmon is that they stink. Quite bad. The second worst memory of that day was the smell of the fish.
+
+ The worst memory of the day was opening my lunch to find my considerate mother had packed bagels. With, as you
+ have guessed by now, salmon cream cheese. I rarely hear the word 'salmon' anymore without the 'cream cheese'
+ playing in my head as an afterthought. Hence, this style is Salmon Cream Cheese. */
+
+
+/* basic elements */
+body {
+ font: 11px/14px verdana, sans-serif;
+ color: #AD7C77;
+ background: #FFD7C4 url(/002/bg1.gif) top left repeat-x;
+ padding: 65px 0px 0px 224px;
+ margin: 0px;
+ }
+p {
+ font: 11px/14px verdana, sans-serif;
+ text-align: justify;
+ margin-top: 0px;
+ }
+h3 {
+ font: bold 16px 'arial narrow', sans-serif;
+ text-transform: lowercase;
+ margin-bottom: 0px;
+ }
+acronym {
+ border-bottom: dotted 1px #B27F66;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #E98376;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #AD7C77;
+ }
+a:active, a:hover {
+ text-decoration: underline;
+ }
+
+
+/* specific divs */
+
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ width: 770px;
+ }
+#pageHeader h1 {
+ background: transparent url(/002/h1.gif) no-repeat top left;
+ width: 258px;
+ height: 61px;
+ float: left;
+ margin: 1px 0px 0px 3px;
+ }
+#pageHeader h1 span {
+ display: none;
+ }
+#pageHeader h2 {
+ background: transparent url(/002/h2.gif) no-repeat top left;
+ width: 206px;
+ height: 28px;
+ float: right;
+ margin: 22px 15px 0px 0px;
+ }
+#pageHeader h2 span {
+ display: none;
+ }
+
+/* sets up our floating area on the right. Kind of a hack, since there's a physical separation between
+ two divs, filled in by tricky margins and compensated for with tricky padding, but it seems to hold up okay. */
+#intro {
+ background: #FFC5A9 url(/002/bg2.gif) top left repeat-x;
+ }
+#preamble {
+ padding: 0px 40px 0px 40px;
+ }
+#preamble .p3 {
+ margin-bottom: 0px;
+ }
+#supportingText {
+ background-color: #FFC5A9;
+ margin: 0px;
+ padding: 0px 40px 0px 40px;
+ }
+#supportingText #explanation h3 {
+ margin-top: 0px;
+ padding-top: 20px;
+ }
+
+#quickSummary {
+ padding-top: 47px;
+ }
+
+#quickSummary .p1 {
+ width: 430px;
+ height: 195px;
+ background: transparent url(/002/splash.jpg) top left no-repeat;
+ padding: 182px 0px 0px 10px;
+ position: absolute;
+ top: 93px;
+ left: 244px;
+ }
+#quickSummary .p1 span {
+ display: none;
+ }
+#quickSummary .p2 {
+ font-size: 9px;
+ line-height: 22px;
+ text-align: left;
+ color: #B27F66;
+ background-color: #FFD7C4;
+ display: block;
+ border: solid 1px #FFBEA1;
+ padding: 40px 15px 0px 419px;
+ margin: 0px 10px 0px 40px;
+ height: 140px;
+ }
+#quickSummary .p2 a:link {
+ color: #B27F66;
+ }
+
+#footer {
+ text-align: right;
+ border-top: solid 1px #FFCDB5;
+ padding-top: 10px;
+ }
+#footer a:link, #footer a:visited {
+ padding: 2px 6px 2px 6px;
+ }
+#footer a:hover {
+ background-color: #FFD7BF;
+ text-decoration: none;
+ }
+
+
+#linkList {
+ background: transparent url(/002/cr1.gif) bottom right no-repeat;
+ padding-bottom: 76px;
+ position: absolute;
+ top: 65px;
+ left: 0px;
+ }
+#linkList2 {
+ padding: 40px 0px 10px 0px;
+ width: 200px;
+ }
+#linkList2 h3 span {
+ display: none;
+ }
+#linkList2 h3.select {
+ background: transparent url(/002/h3.gif) no-repeat top left;
+ width: 195px;
+ height: 21px;
+ }
+#linkList2 h3.favorites{
+ background: transparent url(/002/h4.gif) no-repeat top left;
+ width: 195px;
+ height: 21px;
+ }
+#linkList2 h3.archives{
+ background: transparent url(/002/h5.gif) no-repeat top left;
+ width: 195px;
+ height: 21px;
+ }
+#linkList2 h3.resources{
+ background: transparent url(/002/h6.gif) no-repeat top left;
+ width: 195px;
+ height: 21px;
+ }
+#linkList .iL, #linkList li {
+ font-size: 10px;
+ line-height: 2.5ex;
+ display: block;
+ padding: 2px 0px 0px 25px;
+ margin-bottom: 5px;
+ }
+#linkList #lresources li {
+ margin-bottom: 0px;
+ }
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#linkList li {
+ list-style-type: none;
+ }
+/* css Zen Garden submission 003 - 'Stormweather' by Dave Shea - http://www.mezzoblue.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea */
+/* Added: May 7th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* Credit to Phillipe Wittenbergh at http://www.l-c-n.com/ for Mac testing */
+
+/* The photos in this design come from my digital library. All were taken in Vancouver, BC. The car is on the
+ Granville St. Bridge, the leaves are West 6th Ave, and the snow/tree is West 10th Ave. Guess which
+ part of town I live in...
+
+ I'm still rather fond of this design. I'm glad Phillipe was able to iron out the various CSS bugs */
+
+
+/* basic elements */
+body {
+ font: 11px/15px georgia, serif;
+ text-align: center;
+ color: #fff;
+ background: #748A9B url(bg2.gif) 0 0 repeat-y;
+ margin: 0px;
+ }
+p {
+ /*font: 11px/15px georgia, serif;*/
+ text-align: justify;
+ margin-top: 0;
+ }
+h3 {
+ font: bold 14px georgia, serif;
+ text-transform: lowercase;
+ margin-bottom: 0;
+ }
+acronym {
+ border-bottom: dotted 1px #fff;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: underline;
+ color: #A7D3F6;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: underline;
+ color: #D1E9FC;
+ }
+a:active, a:hover {
+ text-decoration: underline;
+ color: #fff;
+ }
+
+
+/* specific divs */
+
+#container {
+ background: #849AA9 url(bg1.gif) top left repeat-y;
+ text-align: left;
+ width: 750px; margin: 0px auto;
+ position: relative;
+ }
+#supportingText {
+ /*position: relative; top: -120px;*/
+ padding: 0px 40px 0px 0;
+ /*clear:right;*/
+ float:right;
+ width:430px;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ background: transparent url(h1.jpg) no-repeat top left;
+ width: 750px;
+ height: 152px;
+ margin: 0px;
+ }
+#pageHeader h1 span {
+ display: none;
+ }
+#pageHeader h2 span {
+ display: none;
+ }
+
+#quickSummary {
+ width: 685px;
+ margin: 0px auto;
+ position: relative;
+ top: -50px;
+ }
+html>body #quickSummary {
+ margin-top:-50px;
+ top: 0;
+ }
+#quickSummary .p1 {
+ font-size: 1px;
+ color: white;
+ background: transparent url(panel1-2.jpg) no-repeat top left;
+ width: 449px;
+ padding: 10px 0px 0px 5px; float: left;
+ height: 268px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height: 258px;
+ }
+#quickSummary .p1 span {
+ display: none;
+ }
+#quickSummary .p2 {
+ color: #7593A7;
+ background: transparent url(panel3.jpg) no-repeat 0 0;
+ padding: 90px 45px 0px 45px;
+ float: right;
+ width: 214px;
+ height: 338px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 124px;
+ height: 178px;
+ }
+#quickSummary .p2 span {
+ letter-spacing: -1px;
+ line-height: 26px;
+ display: block;
+ }
+#quickSummary .p2 a:link, #quickSummary .p2 a:visited {
+ color: #7593A7;
+ }
+#quickSummary .p2 a:hover {
+ color: #85ABC5;
+ }
+
+#preamble {
+ /*position: relative; top: -120px; */
+ padding: 0px 0px 70px 33px;
+ margin: 0px 0 20px 0px;
+ width: 210px;
+ float: left;
+ background: transparent url(tag.gif) 50% 100% no-repeat;
+ }
+#preamble h2 {
+ font: bold 14px georgia, serif;
+ margin-top: 0px;
+ padding: 0px;
+ }
+#preamble p {
+ font: italic 12px/20px georgia, serif;
+ }
+
+#footer {
+ text-align: right;
+ clear: both;
+ }
+#footer a {
+ font-weight: normal;
+ text-decoration: none;
+ margin-right: 10px;
+ border: solid 1px #859BAA;
+ padding: 6px;
+ }
+#footer a:hover {
+ color: #7E868D;
+ background-color: #fff;
+ border-right: solid 1px #6F818D;
+ border-bottom: solid 1px #6F818D;
+ }
+
+#lselect {
+ position: absolute;
+ top: 15px;
+ left: 0px;
+ padding-left: 350px;
+ margin: 0px auto;
+ width: 730px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 380px;
+ }
+#linkList h3 {
+ display: inline;
+ margin-right: 5px;
+ }
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+#linkList li {
+ font-size: 10px;
+ margin-right: 5px;
+ list-style-type: none;
+ display: inline;
+ }
+#linkList li a {
+ font-weight: normal;
+ }
+
+#lselect h3 {
+ font: bold 11px georgia;
+ letter-spacing: -1px;
+ }
+#lselect li {
+ font: 11px/12px georgia;
+ letter-spacing: -1px;
+ color: #758C9B;
+ }
+#lselect li a:link, #lselect li a:visited {
+ font-weight: normal;
+ color: #fff;
+ text-decoration: none;
+ }
+#lselect li a:hover {
+ color: #D1E9FC;
+ text-decoration: underline;
+ }
+
+#lresources, #larchives, #lfavorites {
+ padding: 0px 40px 0px 266px;
+ clear: both;
+ /*position: relative; top: -20px;*/
+ }/* css Zen Garden submission 004 - 'arch4.20' by Dave Shea - http://www.mezzoblue.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea */
+/* Added: May 7th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* The photo was taken inside the Vancouver Public Library. It has been mentioned the colours have a vaguely
+ MetaFilter-like feel. I suppose they do... Unintentional. */
+
+
+/* basic elements */
+body {
+ font: 11px tahoma, verdana, sans-serif;
+ color: #fff;
+ background: #005D87 url(bg1.gif) top left repeat-x;
+ margin: 0px;
+ }
+p {
+ font: 11px/14px verdana, sans-serif;
+ text-align: justify;
+ margin-top: 0px;
+ }
+h3 {
+ font: bold 13px verdana, sans-serif;
+ margin-bottom: 0px;
+ }
+acronym {
+ border-bottom: dotted 1px #fff;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #8AF44F;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #55AB26;
+ }
+a:active, a:hover {
+ color: #8AF44F;
+ text-decoration: underline;
+ }
+
+/* specific divs */
+#preamble {
+ padding: 0px 180px 0px 25px;
+ }
+#supportingText {
+ padding: 0px 180px 0px 25px;
+ }
+
+#pageHeader {
+ width: 100%;
+ height: 217px;
+ background: #fff url(cr1.jpg) top left no-repeat;
+ margin-top: 47px;
+ }
+#pageHeader h1 {
+ background: transparent url(h1.gif) no-repeat top left;
+ width: 296px;
+ height: 46px;
+ position: absolute;
+ top: 185px;
+ right: 10px;
+ }
+#pageHeader h1 span {
+ display: none;
+ }
+#pageHeader h2 {
+ background: transparent url(h2.gif) no-repeat top left;
+ width: 229px;
+ height: 16px;
+ position: absolute;
+ top: 230px;
+ right: 12px;
+ }
+#pageHeader h2 span {
+ display: none;
+ }
+
+#quickSummary .p1 {
+ font: 11px tahoma, verdana, sans-serif;
+ line-height: 18px;
+ color: #7799AC;
+ background-color: #fff;
+ padding: 2px;
+ position: absolute;
+ top: 65px;
+ right: 10px;
+ width: 150px;
+ }
+#quickSummary .p2 {
+ font: 10px tahoma, verdana, sans-serif;
+ color: #7799AC;
+ position: absolute;
+ top: 32px;
+ right: 5px;
+ }
+#quickSummary .p2 a:link, #quickSummary .p2 a:visited {
+ color: #7799AC;
+ text-decoration: underline;
+ }
+#quickSummary .p2 a:active, #quickSummary .p2 a:hover {
+ color: #8AF44F;
+ }
+
+#linkList{
+ font: 11px tahoma, verdana, sans-serif;
+ line-height: 18px;
+ color: #7799AC;
+ position: absolute;
+ top: 285px;
+ right: 0px;
+ width: 150px;
+ }
+#linkList2 h3 span {
+ display: none;
+ }
+#linkList2 h3.select {
+ background: transparent url(h3.gif) no-repeat top left;
+ width: 157px;
+ height: 14px;
+ }
+#linkList2 h3.favorites{
+ background: transparent url(h5.gif) no-repeat top left;
+ width: 157px;
+ height: 14px;
+ }
+#linkList2 h3.archives{
+ background: transparent url(h6.gif) no-repeat top left;
+ width: 157px;
+ height: 14px;
+ }
+#linkList2 h3.resources{
+ background: transparent url(h4.gif) no-repeat top left;
+ width: 157px;
+ height: 14px;
+ }
+#linkList li {
+ font-size: 10px;
+ line-height: 2.5ex;
+ display: block;
+ padding: 2px 10px 0px 0px;
+ margin-bottom: 5px;
+ }
+#linkList #lresources li {
+ margin-bottom: 0px;
+ }
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#linkList li {
+ list-style-type: none;
+ }
+
+
+#footer {
+ text-align: right; border-top: solid 1px #1E5E82;
+ padding-top: 10px;
+ }
+#footer a:link, #footer a:visited {
+ padding: 2px 6px 2px 6px;
+ }
+#footer a:hover {
+ background: transparent url(bg2.gif) top left repeat-x;
+ text-decoration: none;
+ }/* css Zen Garden submission 005 - 'Blood Lust' by Dave Shea - http://www.mezzoblue.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea */
+/* Added: May 7th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* love it or hate it. This one is one of my favourites because I don't generally design this way. It reaches into the past
+ for a vaguely Futurist style, complete with duotone for that screenprint feel, combined with modern GIF
+ patterned-dithering to really mess with tradition.
+
+ You may find it challenging, silly, visually stimulating, or a mess. I didn't do it for you, I did it for me. */
+
+
+/* basic elements */
+body {
+ font: 12px/13px courier, monospace;
+ color: #000;
+ background-color: #fff;
+ margin: 0px;
+ }
+p {
+ font: 12px/13px courier, monospace;
+ text-align: justify;
+ }
+h3 {
+ font:bold 14px courier, monospace;
+ letter-spacing: 1px;
+ margin-bottom: 0px;
+ color: #000;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: underline;
+ color: #FF4F3E;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: underline;
+ color: #FF4F3E;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #000;
+ }
+acronym {
+ border-bottom: none;
+ }
+
+
+/* specific divs */
+#container {
+ background: #fff url(bloodlust.gif) no-repeat top left;
+ margin: 50px 0px 0px 0px;
+ padding: 150px 0px 0px 200px;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ background: transparent url(h1.gif) no-repeat top left;
+ margin-top: 10px;
+ width: 461px;
+ height: 116px;
+ position: absolute;
+ top: 20px;
+ left: 305px;
+ }
+#pageHeader h1 span {
+ display: none;
+ }
+#pageHeader h2 {
+ background: transparent url(h2.gif) no-repeat top left;
+ width: 253px;
+ height: 34px;
+ position: absolute;
+ top: 150px;
+ left: 216px;
+ }
+#pageHeader h2 span {
+ display: none;
+ }
+
+
+#quickSummary .p1 {
+ font: 400 18px/16px 'arial black', sans-serif;
+ text-align: right;
+ width: 340px;
+ float: left;
+ margin: 40px 20px 20px 0px;
+ }
+#quickSummary .p2 {
+ font: 9px verdana, sans-serif;
+ text-align: left;
+ line-height: 24px;
+ width: 295px;
+ position: absolute;
+ top: 20px;
+ left: 25px;
+ }
+#preamble {
+ width: 170px;
+ float: right;
+ margin-top: 50px;
+ clear: left;
+ position: relative;
+ top: -270px;
+ }
+#preamble h3 {
+ font: bold 12pt/10pt 'trebuchet ms', sans-serif;
+ text-align: right;
+ }
+#preamble p {
+ font: bold 10pt/11pt arial, sans-serif;
+ text-align: right;
+ }
+#supportingText {
+ clear: left;
+ }
+#explanation h3 {
+ font: bold 18px courier, monospace;
+ }
+#explanation .p1 {
+ font: 18px courier, monospace;
+ line-height: 5ex;
+ }
+#explanation .p2 {
+ font: 11px/16px courier, monospace;
+ width: 220px;
+ float: left;
+ margin-right: 10px;
+ }
+#explanation .p3 {
+ font: 14px/14px courier, monospace;
+ margin-top: 30px;
+ }
+
+#participation h3 {
+ background: transparent url(h3.gif) no-repeat top left;
+ width: 174px;
+ height: 66px;
+ margin: 0px;
+ float: left;
+ }
+#participation h3 span {
+ display: none;
+ }
+#participation .p1:first-line {
+ font: 16px 'arial black', sans-serif;
+ }
+#participation .p2 {
+ line-height: 16px;
+ text-align: right;
+ float: left;
+ width: 200px;
+ margin: 0px 5px 15px 0px;
+ }
+#participation .p3 {
+ font-family: arial, sans-serif;
+ }
+
+#benefits h3 {
+ background: transparent url(h4.gif) no-repeat top left;
+ width: 107px;
+ height: 26px;
+ margin: 0px;
+ float: left;
+ }
+#benefits h3 span {
+ display: none;
+ }
+
+
+#requirements h3 {
+ font: bold 18px 'arial black', sans-serif;
+ clear: left;
+ float: right;
+ }
+#requirements .p1 {
+ font: bold 11px/16px trebuchet ms, sans-serif;
+ float: left;
+ width: 300px;
+ margin-right: 10px;
+ }
+#requirements .p3 {
+ font: 12px/11px arial, sans-serif;
+ }
+
+#linkList {
+ position: absolute;
+ top: 0px;
+ left: 20px;
+ }
+#linkList2 {
+ font: 12px courier, monospace;
+ padding: 10px;
+ margin-top: 115px;
+ width: 130px;
+ }
+
+#linkList li {
+ line-height: 2.5ex;
+ display: block;
+ padding-top: 5px;
+ margin-bottom: 5px;
+ list-style-type: none;
+ }
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }/* css Zen Garden submission 006 - 'Wicked Grove' by D. Keith Robinson, http://www.7nights.com/asterisk/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, D. Keith Robinson */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+body {
+ font: 10pt/14pt "Trebuchet MS", sans-serif;
+ color: #000033;
+ background: #69f;
+ margin: 0px;
+ }
+p {
+ font: 10pt/16pt "Trebuchet MS", sans-serif;
+ margin-top: 0px;
+ text-align: justify;
+ }
+h3 {
+ font: bold normal 12pt "Trebuchet MS", sans-serif;
+ letter-spacing: 3px;
+ margin-bottom: 2px;
+ color: #333333;
+ text-align: left;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #FF6600;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #CC0000;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #FF6600;
+ }
+
+
+/* specific divs */
+#container {
+ background: #9cf url(trees.jpg) no-repeat left top;
+ padding: 200px 0px 0px 0px;
+ margin: 0px auto;
+ width:800px;
+ border-left: 2px dashed #fff;
+ border-right: 2px dashed #fff;
+ }
+
+#pageHeader {
+ margin-bottom: 10px;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+background: transparent;
+ margin-top: -180px;
+ width: 500px;
+ height: 87px;
+ float: left;
+ color:#fff;
+ }
+#pageHeader h1 span {
+ display:none;
+ }
+#pageHeader h2 {
+ background: transparent url(tag.gif) no-repeat top left;
+ width: 300px;
+ margin-top:-60px;
+ margin-left:-190px;
+ height: 100px;
+ float: right;
+ }
+#pageHeader h2 span {
+ display:none;
+ }
+
+#quickSummary {
+ width: 130px;
+ float: left;
+ padding:5px;
+ margin-right:15px;
+ background:#0099FF;
+
+ }
+#quickSummary p {
+ font: bold 8pt/12pt verdana, sans-serif;
+ text-align:right;
+ color:#fff;
+ }
+
+#quickSummary a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #003;
+ }
+#quickSummary a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #006;
+ }
+#quickSummary a:hover, #quickSummary a:active {
+ text-decoration: underline;
+ color: #FF6600;
+ }
+
+#preamble, #supporting text, #explanation, #participation, #benefits, #requirements {
+ padding: 0px 170px 0px 30px;
+}
+
+#footer {
+ text-align: center;
+ }
+#footer a:link, #footer a:visited {
+ margin-right: 20px;
+ }
+
+#linkList {
+ background: transparent url(menu.gif) top left no-repeat;
+ position: absolute;
+ top: 0px;
+ padding: 15px;
+ margin-top: 200px;
+ margin-left: 650px;
+ width: 130px;
+ }
+
+#linkList2 {
+ font: 10px verdana, sans-serif;
+ padding-top:35px;
+ }
+#linkList h3.select {
+ background: transparent url(select.gif) top left no-repeat;
+ width: 130px;
+ height: 25px;
+ margin-left:-8px;
+ }
+#linkList h3.select span {
+ display:none
+ }
+#linkList h3.favorites {
+ background: transparent url(favorites.gif) top left no-repeat;
+ width: 130px;
+ height: 25px;
+ margin-left:-8px;
+ }
+#linkList h3.favorites span {
+ display:none
+ }
+#linkList h3.archives {
+ background: transparent url(archives.gif) top left no-repeat;
+ width: 130px;
+ height: 25px;
+ margin-left:-8px;
+ }
+#linkList h3.archives span {
+ display:none
+ }
+#linkList h3.resources {
+ background: transparent url(resources.gif) top left no-repeat;
+ width: 130px;
+ height: 25px;
+ margin-left:-8px;
+ }
+#linkList h3.resources span {
+ display:none
+ }
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+#linkList li {
+ line-height: 2.5ex;
+ background: transparent;
+ display: block;
+ padding-top: 5px;
+ margin-bottom: 5px;
+ list-style-type: none;
+ }
+#linkList li a:link {
+ color: #FF3300;
+ }
+#linkList li a:visited {
+ color: #FF0000;
+ }
+
+#extraDiv1 {
+ background: transparent;
+ position: absolute;
+ top: 40px;
+ right: 0px;
+ width: 148px;
+ height: 110px;
+ }
+/* css Zen Garden submission 007 - 'deep thought' by Jason Estes, http://www.bewb.org/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Jason Estes */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+body#css-zen-garden {
+ background-color:#424242;
+ font-size:75%;
+ font-family:arial, verdana, sans-serif;
+ margin:0;
+ padding:0;
+ color:#fff;
+ background-image:url(background.jpg);
+ background-repeat:no-repeat;
+ background-position:150px 50px;
+ }
+
+a:link {
+ color:#FF9638;
+ background-color:transparent;
+ }
+a:visited {
+ color:#FF9638;
+ background-color:transparent;
+ }
+a:hover, a:active {
+ color:#FF9638;
+ background-color:transparent;
+ }
+/* specific divs */
+
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ margin:10px 15px;
+ background-image:url(logo.gif);
+ height:83px;
+ background-color:transparent;
+ width:480px;
+ background-repeat:no-repeat;
+ background-position:top right;
+ color:#000;
+ }
+#pageHeader h1 span {
+ display:none
+ }
+#pageHeader h2 {
+ display:none;
+ }
+#pageHeader h2 span {
+ display:none;
+ }
+#quickSummary {
+ display:block;
+ }
+#quickSummary .p1 {
+display:none;
+ }
+#quickSummary .p2 {
+ position:absolute;
+ top:0px;
+ left:300px;
+ padding:0;margin:0;
+ }
+#preamble {
+ border-top:1px solid #fff;
+ background-image:url(halfscreen-gray.gif);
+ width:250px;
+ margin-left:30px;
+ position:absolute;
+ top:18px;
+ right:10px;
+ }
+#preamble p{
+ margin:10px;
+ }
+#preamble h3{
+ font-style:oblique;
+ margin:10px;
+ }
+#supportingText {
+ margin:350px auto 0 auto;
+ width:90%;
+ }
+#supportingText div {
+ /*background-image:url(halfscreen-gray.gif);*/
+ border-top:1px solid #fff;
+ clear:both;
+ }
+
+#supportingText h3 span{
+ display:none;
+ }
+#supportingText p {
+ padding:5px 10px;
+ line-height:150%;
+ }
+#explanation h3{
+ Float:left;
+ background-image:url(about.gif);
+ width:46px;
+ height:234px;
+ padding:0;
+ margin:0 10px 0px 0px;
+ border-right:1px solid white;
+ }
+#explanation p{
+ margin:0px 0px 0px 43px;
+ }
+#supportingText div#explanation {
+ margin:20px 10px 0 200px;
+ background:url(about_background.gif) no-repeat 100% 100%;
+ min-height:234px;
+ height:234px;
+ clear:none;
+ }
+#supportingText #explanation[id] {
+ height:auto;
+ }
+#participation h3{
+ Float:right;
+ background-image:url(participation.gif);
+ width:46px;
+ height:234px;
+ padding:0;
+ margin:0 0px 0px 10px;
+ border-left:1px solid white;
+ }
+#supportingText #participation {
+ margin:20px 200px 0 10px;
+ min-height:234px;
+ height:234px;
+ background:url(participation_back.gif) no-repeat 0 100%;
+ }
+#participation p{
+ margin:0px 43px 0px 0px;
+ }
+#supportingText #participation[id] {
+ height:auto;
+ }
+#benefits h3{
+ Float:left;
+ background-image:url(benefits.gif);
+ width:46px;
+ height:133px;
+ padding:0;
+ margin:0 10px 0px 0px;
+ border-right:1px solid white;
+ }
+#benefits p{
+ margin:0px 0px 0px 43px;
+ }
+#supportingText #benefits {
+margin:20px 10px 0 200px;
+ min-height:133px;
+ height:133px;
+ background:url(benefits_back.gif) no-repeat 100% 100%;
+ }
+#supportingText #benefits[id] {
+ height:auto;
+ }
+#requirements h3{
+ Float:right;
+ background-image:url(Requirements.gif);
+ width:46px;
+ height:234px;
+ padding:0;
+ margin:0 0px 0px 10px;
+ border-left:1px solid white;
+ }
+#requirements p{
+ margin:0px 43px 0px 0px;
+ }
+#supportingText #requirements {
+ margin:20px 200px 30px 10px;
+ min-height:234px;
+ height:234px ;
+ background:url(requirements_back.gif) no-repeat 0 100%;
+ }
+#supportingText #requirements[id] {
+ height:auto;
+ }
+#supportingText #footer {
+ text-align:center;
+ padding-top:3px;
+ }
+#footer a:link, #footer a:visited {
+ font-weight:bold;
+ text-decoration:none;
+ }
+#linkList {
+ position:absolute;
+ top:98px;
+ left:30px;
+ width:198px;
+ }
+
+#linkList h3.select {
+ height:53px;
+ background-image:url(select.gif);
+ margin:0px;
+ padding:0px;
+ }
+#linkList h3.select span {
+ display:none
+ }
+#linkList h3.favorites {
+ height:53px;
+ background-image:url(favorites.gif);
+ margin:0px;
+ padding:0px;
+ }
+#linkList h3.favorites span {
+ display:none
+ }
+#linkList h3.archives {
+ height:53px;
+ background-image:url(archives.gif);
+ margin:0px;
+ padding:0px;
+ }
+#linkList h3.archives span {
+ display:none
+ }
+#linkList h3.resources {
+ height:53px;
+ background-image:url(resources.gif);
+ margin:0px;
+ padding:0px;
+ }
+#linkList h3.resources span {
+ display:none
+ }
+
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+#linkList li {
+ display:block;
+ background-image:url(halfscreen-gray.gif);
+ padding:3px;
+ margin:1px 0;
+ list-style-type: none;
+ }
+#linkList li a:link, #linkList li a:visited {
+ color:#fff;
+ background-color:transparent;
+ }
+
+#extraDiv1 {
+ clear:both;
+ }
+acronym {
+ color:#FF9638;
+ background-color:transparent;
+ border:0;
+ cursor:help;
+ }/* css Zen Garden submission 008 - 'RPM' by Bruno Cunha, http://www.kaosboy.net/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* Main image from http://www.karborn.com/FinalV6Old/Series/RPM/RPMImages.htm */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body { + background-image:url(bg.jpg); + background-color:#fff; + font-family:arial, sans serif; + font-size:11px; + line-height:15px; + color:#fff; + margin:0px; + } + +#container { + margin-left:0px; + margin-top:0px; + padding:0px; + width:684px; + z-index:1; + } + +#intro { + width:275px; + position:absolute; + left:88px; + top:902px; + z-index:2; + } + +#supportingText { + width:450px; + position:absolute; + left:411px; + top:535px; + z-index:2; + } +#explanation, #participation, #requirements, #benefits, #footer, #quickSummary, #preamble, #lselect, #lfavorites, #lresources, #larchives { + padding:7px; + margin:5px; + border-left:1px solid #aaa; + border-top:1px solid #aaa; + border-right:1px solid #333; + border-bottom:1px solid #333; + background-image:url(transparent.gif); + } + +#linkList2 { + width:275px; + position:absolute; + left:88px; + top:1244px; + z-index:2; + } + +#extraDiv1 { + background-image:url(tunami2.jpg); + position:absolute; + left:0px; + top:0px; + width:684px; + height:1515px; + z-index:1; + } +#pageHeader { + display:none; + } +h3 { + font-family:arial, sans serif; + color:#fff; + font-size:11px; + font-weight:bold; + margin-top:3px; + margin-bottom:0px; + } +p { + margin:6px; + } + +a { + color:#e2e2e2; + text-decoration:underline; + } +a:link { + color:#e2e2e2; + text-decoration:underline; + } +a:hover { + color:#fff; + font-weight:bold; + text-decoration:underline; + } +a:visited { + color:#e2e2e2; + text-decoration:underline; + } + +
#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#linkList li {
+ list-style-type: none;
+ display: inline;
+ }
+/* css Zen Garden submission 009 - 'Dead or Alive' by Michael Pick, http://www.mikepick.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Michael Pick */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+body {
+ color: #000;
+ background: #fff url(body-bg.png);
+ margin: 0px auto;
+ }
+
+p {
+ font: 12px/15px georgia, serif;
+ text-align: justify;
+ margin-top: 0;
+ }
+
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #000;
+ }
+
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #333;
+ }
+
+a:hover, a:active {
+ text-decoration: underline;
+ }
+
+/* specific divs */
+
+#container {
+ background: url(frill-bg.png) repeat-x;
+ border-right: 1px solid #333;
+ width: 800px;
+ margin: 0px;
+ }
+
+#intro {
+ min-width: 470px;
+ }
+
+#pageHeader {
+ width: 280px;
+ float: left;
+ margin-top: 40px;
+ }
+
+ #pageHeader h1 {
+ background: transparent url(pageheader-bg.png) no-repeat;
+ margin-left: 40px;
+ width: 240px;
+ height: 220px;
+ }
+
+ #pageHeader h1 span {
+ display:none
+ }
+
+ #pageHeader h2 span {
+ display:none;
+ }
+
+#quickSummary {
+ clear:both;
+ width: 280px;
+ float: left;
+ margin-bottom: 20px;
+ }
+
+ #quickSummary p {
+ font-family: georgia, times, serif;
+ font-size: 10px;
+ text-transform: uppercase;
+ text-align:center;
+ padding-left: 60px;
+ padding-right: 20px;
+ }
+
+#preamble {
+ margin-left: 280px;
+ width: 460px;
+ padding-top: 90px;
+ }
+
+ #preamble h3 {
+ background: transparent url(preamble.png) no-repeat;
+ width: 460px;
+ height: 70px;
+ }
+
+ #preamble h3 span {
+ display: none;
+ }
+
+ #preamble a:link {
+ color: #600;
+ }
+
+ #preamble p {
+ line-height: 150%;
+ }
+
+#supportingText {
+ margin-left: 0px;
+ }
+
+ #supportingText a:link {
+ color: #600;
+ }
+
+#explanation {
+ margin-left: 280px;
+ width: 460px;
+ }
+
+ #explanation h3 {
+ background: transparent url(sowhat.png) no-repeat;
+ width: 460px;
+ height: 50px;
+ margin-bottom: 20px;
+ }
+
+ #explanation h3 span {
+ display: none;
+ }
+
+ #explanation p {
+ line-height: 150%;
+ }
+
+#participation {
+ width: 460px;
+ }
+
+ #participation h3 {
+ background: transparent url(participation.png) no-repeat;
+ width: 460px;
+ height: 50px;
+ margin-bottom: 20px;
+ }
+
+ #participation h3 span {
+ display: none;
+ }
+
+ #participation p {
+ line-height: 150%;
+ }
+
+#benefits {
+ width: 460px;
+ }
+
+ #benefits h3 {
+ background: transparent url(benefits.png) no-repeat;
+ width: 460px;
+ height: 50px;
+ margin-bottom: 20px;
+ }
+
+ #benefits h3 span {
+ display: none;
+ }
+
+ #benefits p {
+ line-height: 140%;
+ }
+
+#requirements {
+ width: 460px;
+ }
+
+ #requirements h3 {
+ background: transparent url(requirements.png) no-repeat;
+ width: 460px;
+ height: 50px;
+ margin-bottom: 20px;
+ }
+
+ #requirements h3 span {
+ display: none;
+ }
+
+ #requirements p {
+ line-height: 140%;
+ }
+
+#footer {
+ margin-top: 40px;
+ background: transparent url(footer.png) repeat-x;
+ height: 58px;
+ width: 800px;
+ text-align: center;
+ margin-left: -280px;
+ }
+
+#linkList {
+ position: absolute;
+ top: 28em;
+ left: 40px;
+ width: 240px;
+ }
+
+#linkList2 {
+ font: 10px georgia, times, serif;
+ text-transform: uppercase;
+ }
+
+ #linkList h3.select {
+ background: transparent url(select.png) no-repeat top left;
+ margin: 10px 0px 5px 0px;
+ width: 240px;
+ height: 50px;
+ margin-bottom: 10px;
+ }
+
+ #lselect {
+ padding-bottom: 20px;
+ }
+
+ #linkList h3.select span {
+ display:none
+ }
+
+ #linkList h3.favorites {
+ background: transparent url(favorites.png) no-repeat top left;
+ width: 240px;
+ height: 50px;
+ margin-bottom: 10px;
+ }
+
+ #linkList h3.favorites span {
+ display:none
+ }
+
+ #linkList h3.archives {
+ background: transparent url(archives.png) no-repeat top left;
+ width: 240px;
+ height: 50px;
+ margin-bottom: 10px;
+ }
+
+ #linkList h3.archives span {
+ display:none
+ }
+
+ #linkList h3.resources {
+ background: transparent url(resources.png) no-repeat top left;
+ width: 250px;
+ height: 50px;
+ margin-bottom: 10px;
+ }
+
+ #linkList h3.resources span {
+ display:none
+ }
+
+
+ #linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+ #linkList li {
+ line-height: 2.5ex;
+ display: block;
+ text-align: center;
+ padding-top: 5px;
+ padding-left: 20px;
+ padding-right: 20px;
+ margin-bottom: 5px;
+ list-style-type: none;
+ }
+
+ #linkList li a:link {
+ color: #000;
+ }
+
+ #linkList li a:visited {
+ color: #333;
+ }
+
+#extraDiv1 {
+ background: transparent url(certified.png) top left no-repeat;
+ position: absolute;
+ top: 160px;
+ left: 0px;
+ width: 100px;
+ height: 110px;
+ z-index: 0;
+ }
+
+/* hidden from IE 5 mac */
+
+@media all {
+ #explanation {
+ margin-left: 280px;
+ }
+
+ #participation {
+ margin-left: 280px;
+ }
+
+ #benefits {
+ margin-left: 280px;
+ }
+
+ #requirements {
+ margin-left: 280px;
+ }
+
+ #footer {
+ margin-left: 0px;
+ }
+}/* css Zen Garden submission 010 - 'A Garden Apart' by Dan Cederholm, http://www.simplebits.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Dan Cederholm */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body
+ {
+ font-family: trebuchet ms, verdana, sans-serif;
+ font-size: 12px;
+ line-height: 1.5em;
+ color: #333;
+ background: #cccc99;
+ margin: 0;
+ padding: 0;
+ text-align: center;
+ }
+
+p
+ {
+ margin-top: 0px;
+ }
+
+h3
+ {
+ font: bold 140% trebuchet ms;
+ letter-spacing: -1px;
+ margin-bottom: 0;
+ color: #c96;
+ }
+
+a:link
+ {
+ text-decoration: none;
+ border-bottom: 1px dotted #369;
+ color: #369;
+ }
+
+a:visited
+ {
+ text-decoration: none;
+ border-bottom: 1px dotted #369;
+ color: #369;
+ }
+
+a:hover, a:active
+ {
+ text-decoration: none;
+ border-bottom: 1px solid #036;
+ color: #036;
+ }
+
+/* ---( specific divs )----------------------------- */
+
+#container
+ {
+ position: relative;
+ background: #FFFBDF url(fade.gif) no-repeat 0 92px;
+ margin: 0 auto 10px auto;
+ border-left: 1px solid #000;
+ border-right: 1px solid #000;
+ border-bottom: 1px solid #000;
+ text-align: left;
+ width: 800px;
+ }
+
+#pageHeader
+ {
+ height: 92px;
+ background: url(top.gif) no-repeat top left;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1, #pageHeader h2 span
+ {
+ margin: 0;
+ padding: 0;
+ display: none;
+ }
+
+#pageHeader h2
+ {
+ position: absolute;
+ top: 110px;
+ left: 20px;
+ padding: 0;
+ margin: 0;
+ background: url(tagline.gif) no-repeat top left;
+ width: 528px;
+ height: 74px;
+ }
+
+/* ---( quick summary)---------------------------- */
+
+#quickSummary
+ {
+ position: absolute;
+ top: 92px;
+ right: 0;
+ left: auto;
+ z-index: 2;
+ width: 298px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 300px;
+ }
+
+html>body #quickSummary
+ {
+ width: 300px;
+ }
+
+#quickSummary p
+ {
+ margin: 15px 15px 15px 15px;
+ font-style: italic;
+ font-size: 140%;
+ font-family: "trebuchet ms";
+ font-weight: bold;
+ line-height: 1.5em;
+ color: #444;
+ }
+
+#quickSummary p.p2
+ {
+ font-style: normal;
+ font-weight: normal;
+ font-size: 100%;
+ margin-top: 0;
+ }
+
+#preamble
+ {
+ margin: 104px 340px 0px 20px;
+ }
+
+#supportingText
+ {
+ padding-left: 20px;
+ margin: 0 350px 40px 0;
+ }
+
+#footer
+ {
+ border-top: 1px dotted #CDC4AC;
+ padding-top: 6px;
+ text-align: center;
+ }
+
+#footer a:link, #footer a:visited
+ {
+ margin-right: 6px;
+ }
+
+/* ---( right side nav)----------------------------- */
+
+#linkList
+ {
+ position: absolute;
+ top: 92px;
+ right: 0;
+ left: auto;
+ width: 300px;
+ padding: 0;
+ border-left: 1px solid #CDC4AC;
+ border-bottom: 1px solid #CDC4AC;
+ background: #E5E0D4 url(zen.gif) no-repeat;
+ z-index: 1;
+ }
+
+#linkList2
+ {
+ margin: 190px 15px 15px 15px;
+ }
+
+#linkList h3
+ {
+ color: #635F57;
+ font-family: trebuchet ms;
+ font-size: 120%;
+ margin: 0 0 6px 0;
+ padding: 0;
+ }
+
+#linkList ul
+ {
+ margin: 0px;
+ padding: 0px;
+ }
+#linkList li
+ {
+ display: block;
+ margin-bottom: 2px;
+ padding-left: 14px;
+ background: url(arrow.gif) no-repeat 0 5px;
+ list-style-type: none;
+ }
+
+#linkList li a:link
+ {
+ color: #c96;
+ border-bottom: none;
+ }
+
+#linkList li a:visited
+ {
+ color: #c96;
+ border-bottom: none;
+ }
+
+#linkList li a:hover
+ {
+ color: #963;
+ }
+
+
+
+
+#lselect
+ {
+ padding: 12px 0 12px 0;
+ border-top: 1px dashed #CDC4AC;
+ border-bottom: 1px dashed #CDC4AC;
+ }
+
+#lresources
+ {
+ margin-top: 12px;
+ }/* css Zen Garden submission 011 - 'meliorism' by Brett J. Gilbert - www.paragraphic.co.uk */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* 'tree' graphic adapted from 'Bending Tree' by Robert Priseman, used with permission */
+/* All other graphics copyright 2003, Brett J. Gilbert */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/*----------------------------------------*
+** Global
+**----------------------------------------*/
+
+body {
+ margin: 0;
+ padding: 0;
+ text-align: center;
+ color: #000;
+ background: #f1f8f3 url(gradSky.jpg) repeat-x;
+ }
+div,p,h1,h2,h3,ul,li {
+ margin: 0;
+ padding: 0;
+ }
+h1 span,h2 span,h3 span {
+ display: none;
+ }
+
+/*----------------------------------------*
+** Layout
+**----------------------------------------*/
+
+#container {
+ position: relative;
+ width: 760px;
+ margin: 0 auto;
+ text-align: left;
+ }
+#intro {
+ position: absolute;
+ top: 28px;
+ left: 0;
+ width: 310px;
+ }
+#supportingText {
+ width: 690px;
+ }
+#linkList {
+ position: absolute;
+ top: 40px;
+ left: 585px;
+ width: 235px;
+ }
+
+/*----------------------------------------*
+** Links
+**----------------------------------------*/
+
+a:link,
+a:visited { color: #49f; background-color: transparent; text-decoration: none; }
+a:hover { color: #f00; background-color: transparent; text-decoration: none; }
+
+#quickSummary p.p2 a:link,
+#quickSummary p.p2 a:visited { color: #348633; background-color: transparent; }
+#quickSummary p.p2 a:hover { color: #f00; background-color: transparent; }
+
+#footer a:link,
+#footer a:visited { color: #348633; background-color: transparent; }
+#footer a:hover { color: #f00; background-color: transparent; }
+
+#linkList a.c:link,
+#linkList a.c:visited { color: #fa5; background-color: transparent; }
+#linkList a.c:hover { color: #f00; background-color: transparent; }
+
+/*----------------------------------------*
+** #intro
+**----------------------------------------*/
+
+#intro {
+ font: italic 11px/150% Georgia, Times, "Times New Roman", serif;
+ color: #888;
+ background-color: transparent;
+ }
+#pageHeader h1 {
+ margin-left: 4px;
+ background: transparent url(introGarden.gif) no-repeat 0 0;
+ width: 115px;
+ height: 12px;
+ }
+#pageHeader h2 {
+ margin-top: 80px;
+ background: transparent url(introBeauty.gif) no-repeat 0 0;
+ width: 195px;
+ height: 73px;
+ }
+#quickSummary p.p1 {
+ margin: 5px 0 55px 4px;
+ color: #fa0;
+ background-color: transparent;
+ line-height: 160%;
+ }
+#quickSummary p.p2 {
+ margin: 0 150px 0 4px;
+ padding: 5px 25px 5px 10px;
+ background: transparent url(gradGreen.jpg) repeat-y;
+ border-left: 1px solid #a7d9a8;
+ color: #888;
+ line-height: 130%;
+ }
+#preamble {
+ margin-left: 4px;
+ padding: 20px 0 0 15px;
+ border-left: 1px solid #a7d9a8;
+ }
+#preamble h3 {
+ background: transparent url(introEnlightenment.gif) no-repeat 0 0;
+ width: 138px;
+ height: 37px;
+ }
+#preamble p {
+ margin: 10px 140px 0 0;
+ }
+
+/*----------------------------------------*
+** #supportingText
+**----------------------------------------*/
+
+#supportingText {
+ padding: 430px 0 40px 0;
+ font: 13px/140% Georgia, Times, "Times New Roman", serif;
+ color: #888;
+ background: transparent url(textBack.jpg) no-repeat 0 40px;
+ }
+#supportingText p {
+ margin: 0 125px 10px 221px;
+ }
+#supportingText h3 {
+ margin: 25px 0 6px 220px;
+ width: 206px;
+ height: 21px;
+ }
+#explanation h3 { background: transparent url(textAbout.gif) no-repeat 0 0; margin-top: 0; }
+#participation h3 { background: transparent url(textParticipation.gif) no-repeat 0 0; }
+#benefits h3 { background: transparent url(textBenefits.gif) no-repeat 0 0; }
+
+/*----------------------------------------*
+** #supportingText > #requirements
+**----------------------------------------*/
+
+#requirements {
+ margin: 30px 0 0 221px;
+ padding: 0 0 15px 0;
+ border-left: 1px solid #a7d9a8;
+ font: italic 11px/150% Georgia, Times, "Times New Roman", serif;
+ color: #888;
+ background-color: transparent;
+ }
+#requirements h3 {
+ margin: 0 0 13px 0;
+ background: transparent url(textRequirements.jpg) no-repeat 0 0;
+ width: 175px;
+ height: 25px;
+ }
+#requirements p {
+ margin: 9px 0 0 15px;
+ }
+
+/*----------------------------------------*
+** #supportingText > #footer
+**----------------------------------------*/
+
+#footer {
+ margin: 0 0 0 221px;
+ padding: 4px 0 5px 15px;
+ background: transparent url(gradGreen.jpg) repeat-y;
+ border-left: 1px solid #a7d9a8;
+ font: italic 11px/140% Georgia, Times, "Times New Roman", serif;
+ }
+
+/*----------------------------------------*
+** #linkList
+**----------------------------------------*/
+
+#linkList {
+ border-left: 1px solid #8bf;
+ font: italic 11px/130% Georgia, Times, "Times New Roman", serif;
+ color: #999;
+ background: transparent url(linksBack.jpg) no-repeat;
+ }
+#lselect h3 {
+ background: transparent url(linksSelect.gif) no-repeat 0 0;
+ margin: 240px 0 10px 14px;
+ width: 118px;
+ height: 73px;
+ }
+div#lselect {
+ margin-bottom: 50px;
+ }
+#linkList ul {
+ margin-left: 15px;
+ }
+#linkList li {
+ list-style-type: none;
+ margin-top: 5px;
+ }
+#lresources h3,
+#lfavorites h3,
+#larchives h3 {
+ margin: 25px 0 8px 0;
+ width: 175px;
+ height: 25px;
+ }
+#lresources h3 { background: transparent url(linksResources.jpg) no-repeat 0 0; }
+#lfavorites h3 { background: transparent url(linksFavorites.jpg) no-repeat 0 0; }
+#larchives h3 { background: transparent url(linksArchives.jpg) no-repeat 0 0; }
+/* css Zen Garden submission 012 - 'TechnOhm' by Joshua Ambrutis - http://www.visualcss.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Joshua Ambrutis */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* I've tried to keep the CSS in the sequence which I built it in... just to give another perspective
+of how others tackle this, you'll see in some spots I'll define an elements main box just to get it
+in the right place etc.. then refine it with specifics later in the stylesheet. I'm not saying this is right,
+just the way I usually go about it. There are also comments thrown in here and there to hopefully
+explain some of the strangeness */
+
+body {
+ margin: 0px;
+ padding: 0px;
+ background: url(to_pageback.gif) repeat fixed;
+ color: #CCCCCC;
+ font: 76% Arial, Helvetica, sans-serif;
+ text-align: center;
+}
+
+div, p, ul, li, h1, h2, h3, h4, h5, h6 { margin: 0px; padding: 0px; }
+/* Why do I do that? ...hmm.. since switching from Tables to CSS, I've learned it is easier
+for MY feeble brain to lay out the design first with just colored boxes THEN paint it in photoshop, this just helps me
+to get the layout of the elements first. Then I refine theses values with more specifics through
+IDs and Classes when the graphics call for it, in my case the barebones basic layout comes
+first with designs in my head BEFORE I open PhotoShop... but that's just me */
+
+h1, h2, h3, h4, h5, h6 { color: #FFAE00; }
+#container {
+ margin: 0px auto 60px;
+ width: 760px;
+ border-top: 0px solid #000000;
+ border-right: 2px solid #000000;
+ border-bottom: 2px solid #000000;
+ border-left: 2px solid #000000;
+ padding: 0px 0px 150px;
+ background: #404040 url(bandwidthkiller.jpg) no-repeat center bottom;
+ text-align: left;
+ position: relative;
+}
+#pageHeader h1 {
+ margin-bottom: 12px;
+ background: url(to_header_01.jpg) no-repeat;
+ height: 186px;
+}
+#pageHeader h1 span { display: none; }
+
+/* Above: That's just for dumping the text allowing the backround image in it's containing element to show through*/
+
+#pageHeader h2 {
+ width: 261px;
+ background: url(to_beauty.gif) no-repeat;
+ position: absolute;
+ height: 17px;
+ top: 2px;
+ right: 5px;
+ cursor: text; /* just goofing off */
+}
+#pageHeader h2 span { display: none; }
+#pageHeader { position: relative; }
+#quickSummary {
+ margin: 0px;
+ border: 0px none;
+ padding: 0px;
+ width: 220px;
+ background: url(to_sumarytop_02.jpg) no-repeat;
+ position: absolute;
+ z-index: 1;
+ left: 0px;
+ height: 266px;
+}
+#preamble {
+ margin: 10px 0px 30px 235px;
+ width: 510px;
+ border: 2px solid #000000;
+ padding: 10px 0px;
+ background: #60676F url(zen-image.jpg) repeat center top;
+ text-align: center;
+ position: relative;
+ top: 0px;
+ left: 0px;
+ z-index: 3;
+}
+#preamble p {
+ padding: 0px 0px 1.3em;
+ margin: 0px auto;
+ width: 320px;
+ color: #F2F2F2;
+ font: bold 1.2em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
+ letter-spacing: 0.08em;
+ text-align: left;
+}
+#preamble p.p3 { padding-bottom: 0px; }
+div#preamble h3 {
+ width: 400px;
+ margin: 0px;
+ padding: 0px 0px 0px 34px;
+ background: url(to_h3back_04.gif) no-repeat left top;
+ font-size: 16px;
+ line-height: 24px;
+ text-align: left;
+ position: absolute;
+ top: -24px;
+ z-index: 1;
+ left: -3px;
+ height: 23px;
+}
+#supportingText {
+ margin: 0px 0px 0px 235px;
+ width: 510px;
+ padding: 0px;
+ position: relative;
+}
+#linkList {
+ margin: 7em 10px 0px 12px;
+ padding: 0px;
+ width: 200px;
+ background: url(ani2.gif) no-repeat; /* this is just here as a preloader for the nav mouseover to kill the delay when it's first hit.. it can't be seen in this position because of an overlaying background image*/
+ position: absolute;
+ left: 0px;
+ top: 360px;
+ z-index: 2;
+}
+#supportingText p { padding: 5px 12px 1em; }
+#supportingText div {
+ border: 1px solid #000000;
+ padding: 0px;
+ margin: 22px 0px 40px;
+ width: 510px;
+ background: #61605F;
+ position: relative;
+ z-index: 2;
+}
+#supportingText h3 {
+ width: 400px;
+ margin: 0px;
+ padding: 0px 0px 0px 34px;
+ background: url(to_h3back_04.gif) no-repeat left top;
+ font-size: 16px;
+ line-height: 24px;
+ position: absolute;
+ top: -24px;
+ z-index: 1;
+ height: 23px;
+ left: -2px;
+}
+#intro a {
+ color: #FFCC00;
+ font-weight: bold;
+ text-decoration: none;
+}
+#supportingText a {
+ color: #FFAE00;
+ font-weight: bold;
+ text-decoration: none;
+}
+#supportingText a:hover { border-bottom: 2px dashed #FFAE00; color: #CCCCCC; }
+#supportingText a:active { border-bottom: 2px dashed #333333; background: #5A6269; }
+div#supportingText div#requirements {
+ margin-bottom: 0px;
+ background: #61605F url(bandwidthkiller-alpha.jpg) no-repeat center bottom;
+}
+/* the background image above is what gives the transparency effect,
+it's just a carefully cut out chunk of the #container divs background image
+with a semi-transparent overlay on it. Oh... I can't wait for true PNG surrport*/
+
+div#supportingText div#footer {
+ width: 200px;
+ border-top: 0px none #000000;
+ border-right: 0px none #000000;
+ border-bottom: 1px solid #000000;
+ border-left: 0px none #000000;
+ padding-top: 36px;
+ padding-bottom: 12px;
+ margin: 0px;
+ background: transparent url(to_footerback_07.gif) no-repeat left top;
+ text-align: center;
+ position: relative;
+ left: -220px;
+ top: -64px;
+}
+#quickSummary p {
+ margin: 0px 20px 10px 25px;
+ color: #A3A3A3;
+ font: bolder small-caps 1.1em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
+}
+#quickSummary p.p1 {
+ margin-top: 20px;
+ border: 1px solid #23282C;
+ padding: 10px;
+ color: #FFAE00;
+}
+#quickSummary p.p2 {
+ color: #999999;
+ font-weight: normal;
+ text-align: center;
+}
+#quickSummary p a {
+ color: #CCCCCC;
+ font-weight: normal;
+ text-decoration: none;
+}
+#lselect, #lfavorites, #larchives, #lresources {
+ border: 1px solid #000000;
+ padding: 0px;
+ margin: 0px 0px 60px;
+ background: #60676F;
+ font-size: .9em;
+ position: relative;
+}
+#linkList h3 {
+ width: 200px;
+ border-top: 0px #000000;
+ border-right: 1px solid #000000;
+ border-bottom: 0px #000000;
+ border-left: 0px #000000;
+ margin: 0px;
+ padding: 0px;
+ background: url(to_h3back_04.gif) no-repeat left top;
+ font-size: 16px;
+ line-height: 24px;
+ position: absolute;
+ top: -24px;
+ z-index: 1;
+ left: -2px;
+ height: 23px;
+}
+#linkList h3 span { margin: 0px; padding: 0px 0px 0px 34px; }
+/*#linkList span { margin: 0px; padding: 0px; display: block; }*/
+
+div#lselect a.c {
+ margin: 0px 0px -15px; /* seemed to have to do that because of the extra in each li item */
+ padding: 0px 15px 0px 0px;
+ display: inline;
+ background-image: none;
+ color: #FFCC00;
+ font-weight: normal;
+ font-variant: normal;
+ font-size: 1em;
+ text-decoration: none;
+ text-transform: capitalize;
+ text-align: center;
+}
+/* The following 4 divs all use the same background file...
+ it's larger than it needs to be to allow the text to resize PLUS you can
+ use the background-position to offset it in different divs for the illusion
+ of more than one file without the bandwith loss*/
+
+div#lselect {
+ background: url(to_leftcol_02.jpg) repeat-y -50px -60px;
+ color: #999999;
+}
+div#lresources {
+ background: url(to_leftcol_02.jpg) no-repeat -5px -20px;
+ text-align: left;
+}
+div#larchives {
+ background: url(to_leftcol_02.jpg) no-repeat -40px -220px;
+}
+div#lfavorites {
+ background: url(to_leftcol_02.jpg) no-repeat -60px -20px;
+}
+/* Bahaaa! Somebody switched the menus to an unordered list structure,
+good bye spans! I have to jump back a few
+steps here and do the lists, I'll try to reorder the css later to make incremental sense */
+#linkList ul { list-style: none; text-align: center; }
+#linkList li { margin: 0px; padding: 6px 0px; }
+#linkList a {
+ padding-left: 32px;
+ margin-left: 6px;
+ display: block;
+ background: url(ani1.gif) no-repeat left center;
+ color: #BBBBBB;
+ font-weight: bold;
+ font-size: 1.1em;
+ text-transform: uppercase;
+ text-decoration: none;
+ text-align: left;
+}
+#linkList a:hover {
+ background: url(ani2.gif) no-repeat left center;
+ color: #EBEBEB;
+}
+div#lselect a.c:hover {
+ background: none;
+ color: #CCCCCC;
+ font-style: italic;
+ text-decoration: none;
+}
+div#linkList div#lresources a {
+ margin: 0px 0px -10px;
+ padding: 0px;
+ display: inline;
+ background: url(none);
+ text-transform: capitalize;
+}
+div#linkList div#lresources ul { margin: 0px; padding-left: 15px; text-align: left; }
+/* Stupid IE5, almost made it without a hack, but don't have time figure
+out how to get rid of extra pixels from the border or even if I can without
+resorting to a hack. By the way, this is called the SBMH short for Simple
+Box Model Hack, just Google it for more info if you need*/
+#linkList h3 { \left: -1px; lef\t: -2px; \width: 201px; w\idth: 200px; }
+
+/* css Zen Garden submission 013 - 'Coastal Breeze' by Dave Shea, http://www.mezzoblue.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea*/
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* These illustrations were done by hand in Photoshop. No photos harmed in the
+ making of this design. They were put together about two years ago for a former
+ portfolio site, and luckily I still had the .PSD on hand. It felt like a good
+ idea to convert this into a Zen Garden design.
+
+ It has been said that this particular combination of objects has a west-coast
+ British Columbia feel to it. I'm inclined to agree.
+ */
+
+/* basic elements */
+body {
+ font: 8pt/16pt georgia, serif;
+ text-align: center;
+ color: #464128;
+ background: #fff url(coastal2.jpg) bottom center no-repeat;
+ margin: 0px;
+}
+p {
+ font: 8pt/16pt georgia, serif;
+ color: #464128;
+ background-color: transparent;
+ margin-top: 0px;
+ text-align: right;
+}
+h3 {
+ font: bold 8pt/16pt georgia, serif;
+ text-align: right;
+ margin-bottom: 0px;
+ background: transparent url(futz.gif) center right no-repeat;
+ padding-right: 14px;
+}
+a {
+ color: #464128;
+ background-color: transparent;
+}
+a:visited {
+ color: #000;
+ background-color: transparent;
+}
+a:hover {
+ color: #A29D66;
+ background-color: transparent;
+}
+acronym {
+ border-bottom: none;
+ }
+
+
+/* specific elements */
+#intro {
+ background: transparent url(coastal.jpg) top left no-repeat;
+ width: 700px;
+ margin-left: auto;
+ margin-right: auto;
+}
+#pageHeader {
+ text-align: right;
+ padding: 70px 60px 0px 0px;
+}
+#pageHeader h1 {
+ background: transparent url(papier.jpg) top left no-repeat;
+ width: 192px;
+ height: 70px;
+ margin: 0px 0px 0px 448px;;
+}
+#pageHeader h1 span {
+ display: none;
+}
+#pageHeader h2 {
+ background: transparent url(beauty.gif) top left no-repeat;
+ width: 83px;
+ height: 14px;
+ margin: 0px 90px 0px 477px;
+ position: relative;
+ top: -17px;
+}
+#pageHeader h2 span {
+ display: none;
+}
+
+#preamble {
+ position: relative;
+ top: -80px;
+ padding-right: 250px;
+ padding-left: 140px;
+
+}
+#quickSummary {
+ float: right;
+ text-align: left;
+ padding-right: 70px;
+ width: 230px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 160px;
+}
+/* over-clarified to fix IE5/Win */
+#quickSummary p, #quickSummary .p1, #quickSummary .p2 {
+ font: italic 13pt/18pt garamond, serif;
+ text-align: left;
+ color: #A29D66;
+ background-color: transparent;
+}
+#supportingText {
+ margin-left: auto;
+ margin-right: auto;
+ padding-right: 250px;
+ padding-left: 140px;
+ position: relative;
+ top: -70px;
+ width: 700px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 310px;
+}
+
+
+
+#linkList {
+ font: italic 9pt/14pt garamond, georgia, serif;
+ text-transform: lowercase;
+ text-align: left;
+ color: #A29D66;
+ background-color: transparent;
+ position: absolute;
+ top: 33em; /*380px;*/
+ left: 0px;
+ width: 100%;
+}
+#linkList2 {
+ padding-left: 470px;
+ padding-right: 70px;
+ margin-left: auto;
+ margin-right: auto;
+ width: 700px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 160px;
+}
+#linkList h3 {
+ font: italic 12pt/15pt garamond, georgia, serif;
+ text-transform: capitalize;
+ color: #464128;
+ background-color: transparent;
+ text-align: left;
+ background-image: none;
+}
+#linkList a {
+ font: italic 11pt/14pt garamond, georgia, serif;
+ color: #A29D66;
+ background-color: transparent;
+ text-decoration: none;
+}
+#linkList a:hover {
+ color: #464128;
+ background-color: transparent;
+ text-decoration: underline;
+}
+
+#linkList a.c {
+ font: italic 9pt/14pt garamond, georgia, serif;
+}
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+}
+#linkList li {
+ text-align: left;
+ list-style-type: none;
+}
+
+#linkList h3 {
+ margin-right: auto;
+ margin-left: 0px;
+ margin-top: 25px;
+}
+#linkList h3 span {
+ display: none;
+}
+#linkList h3.select {
+ width: 113px;
+ height: 19px;
+ background: transparent url(h-select.gif) top left no-repeat;
+}
+#linkList h3.archives {
+ width: 134px;
+ height: 17px;
+ background: transparent url(h-archives.gif) top left no-repeat;
+}
+#linkList h3.favorites {
+ width: 76px;
+ height: 23px;
+ background: transparent url(h-favorites.gif) top left no-repeat;
+ position: relative;
+ left: -10px;
+}
+#linkList h3.resources {
+ width: 125px;
+ height: 13px;
+ background: transparent url(h-resources.gif) top left no-repeat;
+ position: relative;
+ left: -10px;
+}
+
+#footer a {
+ font: italic 11pt/14pt garamond, georgia, serif;
+ color: #A29D66;
+ background-color: transparent;
+ text-decoration: none;
+ padding-left: 15px;
+}
+#footer a:hover {
+ color: #464128;
+ background: transparent url(fleurdelis.gif) center left no-repeat;
+ text-decoration: none;
+ border-bottom: dotted 1px #464128;
+}
+
+.accesskey {
+ font-weight: bold;
+ text-decoration: underline;
+ }
+
+
+/* extra bits on the last paragraph in each text block */
+#preamble .p3, #explanation .p2, #participation .p3, #benefits .p1, #requirements .p4 {
+ background: transparent url(filler.gif) bottom center no-repeat;
+ padding-bottom: 25px;
+}
+
+#extraDiv1 {
+ text-align: center;
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ width: 100%;
+}
+#extraDiv1 span {
+ display: block;
+ width: 600px;
+ height: 82px;
+ margin-left: auto;
+ margin-right: auto;
+ background: transparent url(fleur.gif) top right no-repeat;
+}/* css Zen Garden submission 014 - 'Samuraai' by Minz Meyer, http://www.minzweb.de/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Minz Meyer */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+ background-image: url(background_body.jpg);
+ background-color: #000;
+ color: #D8E0BC;
+ margin-top: 10px;
+ margin-left: 50px;
+ margin-right: 50px;
+ margin-bottom: 10px;
+ padding: 0;
+ font: 12px/1.5 Verdana, sans-serif;
+}
+
+/* Basic styles */
+
+h3 {
+ background-color: #B1AD72;
+ color: inherit;
+ margin-top: 0;
+ border-right: 4px solid #818343;
+ border-bottom: 1px solid #818343;
+ height: 25px;
+}
+
+h3 span {
+ display: none;
+}
+
+div#preamble p.p3 {
+ padding-bottom: 15px;
+}
+
+/* Main div styling */
+div#container {
+ background-color: #2F2F13;
+ color: inherit;
+ background-image: url(container_background.jpg);
+ background-position: right;
+ background-repeat: repeat-y;
+ border-left: 1px solid #8F8C4E;
+ border-bottom: 1px solid #8F8C4E;
+}
+
+div#intro {
+ position: relative;
+ overflow: hidden;
+}
+
+div#pageHeader {
+ background-color: #000;
+ color: inherit;
+ background-image: url(umbrella.jpg);
+ background-repeat: no-repeat;
+ border-top: 1px solid #8F8C4E;
+ border-bottom: 1px solid #8F8C4E;
+ border-right: 1px solid #8F8C4E;
+ height: 50px;
+ margin-bottom: 15px;
+ overflow: hidden;
+}
+
+div#pageHeader h1 {
+ margin-top: 0px;
+ margin-bottom: 0px;
+ width: 500px;
+ height: 46px;
+ float: left;
+}
+
+div#pageHeader h1 span {
+ visibility: hidden;
+}
+
+div#pageHeader h2 {
+ background-image: url(beauty_background.gif);
+ background-repeat: no-repeat;
+ margin-top: 5px;
+ margin-left: 0px;
+ width: 348px;
+ height: 39px;
+ float: right;
+}
+
+div#pageHeader h2 span {
+ display: none;
+}
+
+div#quickSummary {
+ position: relative;
+ float:left;
+ width: 150px;
+ margin-top: -10px;
+ padding: 8px;
+ background-color: transparent;
+ color: inherit;
+}
+
+div#quickSummary p {
+ margin-top: 0px;
+ font: italic 14px Verdana, sans-serif;
+ text-align: center;
+}
+
+div#quickSummary p.p2 {
+ font: italic 11px Verdana, sans-serif;
+}
+
+div#preamble {
+ border-bottom: 1px solid #8F8C4E;
+ margin-top: -16px;
+ margin-right: 222px;
+ background-image: url(background-preamble.jpg);
+ background-repeat: no-repeat;
+ background-color: #000;
+ color: inherit;
+
+}
+div#preamble h3 {
+ background-image: url(preamble_h3_background.jpg);
+ background-repeat: no-repeat;
+ margin-top: 0px;
+ margin-left: 170px;
+}
+
+div#preamble p {
+ padding-right: 30px;
+ margin-left: 200px;
+ color: inherit;
+ background-color: transparent;
+ font: 14px/1.6 Verdana, sans-serif;
+ text-align: justify;
+ width: auto;
+}
+
+div#supportingText {
+ margin-top: 0px;
+}
+
+div#explanation, div#participation, div#benefits, div#requirements {
+ margin-right: 222px;
+ margin-bottom: 30px;
+}
+
+
+div#supportingText p {
+ padding-left: 30px;
+ padding-right: 30px;
+}
+
+div#explanation h3 {
+ background-image: url(explanation_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+div#participation h3 {
+ background-image: url(participation_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+div#benefits h3 {
+ background-image: url(benefits_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+div#requirements h3 {
+ background-image: url(requirements_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+
+div#linkList {
+ position: absolute;
+ top: 62px;
+ right: 50px;
+ width: 220px;
+ background-color: transparent;
+ color: inherit;
+ font: 10px/1.5 Verdana, sans-serif;
+}
+
+div#linkList h3.select {
+ background-color: #2F2F13;
+ background-image: url(select_h3_background.jpg);
+ background-repeat: no-repeat;
+ color: inherit;
+ margin-top: 0;
+ border-right: 4px solid #818343;
+ border-bottom: 1px solid #818343;
+ height: 25px;
+
+}
+
+div#linkList h3.resources {
+ background-image: url(resource_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+div#linkList h3.archives {
+ background-image: url(archives_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+div#linkList h3.favorites {
+ background-image: url(favorites_h3_background.jpg);
+ background-repeat: no-repeat;
+}
+
+div#linkList h3 {
+ background-color: #2F2F13;
+ color: inherit;
+ margin-top: 20px;
+ border-right: 4px solid #818343;
+ border-bottom: 1px solid #818343;
+ height: 25px;
+
+}
+
+span.iL {
+ display: block;
+ padding-left: 20px;
+ padding-right: 20px;
+ margin-bottom: 10px;
+ line-height: 2;
+}
+
+div#linkList ul {
+ list-style: none;
+}
+
+div#linkList li {
+ margin-left: -15px;
+ margin-bottom: 10px;
+ line-height: 1.5;
+}
+
+a:link {
+ color: #9BB574;
+ background-color: transparent;
+ text-decoration: none;
+ font-weight: bold;
+ padding: 2px;
+ border-bottom: 1px solid;
+ line-height: 1.5;
+}
+
+a:visited {
+ color: #C6D2B3;
+ background-color: transparent;
+ text-decoration: line-through;
+ font-weight: bold;
+ padding: 2px;
+ border-bottom: 1px solid;
+ line-height: 1.5;
+}
+
+a:hover, a:focus {
+ color: #D8E2C7;
+ background-color: #828330;
+ text-decoration: none;
+ font-weight: bold;
+ padding: 2px;
+ border-bottom: 1px solid;
+ line-height: 1.5;
+}
+
+div#footer {
+ clear: both;
+ background-color: #000;
+ color: inherit;
+ background-image: url(umbrella2.jpg);
+ background-repeat: no-repeat;
+ background-position: right;
+ border-top: 1px solid #8F8C4E;
+ border-right: 1px solid #8F8C4E;
+ height: 50px;
+ padding-left: 30px;
+ vertical-align: bottom;
+ overflow: hidden;
+}
+
+div#supportingText div#footer a {
+ line-height: 40px;
+}
+
+acronym {
+ border-bottom: none;
+ cursor: help;
+}/* css Zen Garden submission 015 - 'boddhidarma' by Michael Angeles - http://studioid.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Michael Angeles */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* body and type */ + +html { + background: rgb(93, 105, 40) url(bg_boddhidarma2.gif) no-repeat top left; +} +/* basic elements */ +body { + font: 9pt/16pt verdana, helvetica, sans-serif; + color: #ffc; + margin: 0 0 30px 0; + } +p { + font: 9pt/16pt verdana, helvetica, sans-serif; + padding-bottom: 5px; + } +h3 { + font-size: 16pt; + letter-spacing: 1px; + margin: 0; + padding: 0; + color: #cc9; + } +a:link { + font-weight: bold; + text-decoration: none; + color: #fe9201; + } +a:visited { + font-weight: bold; + text-decoration: none; + color: #fe9201; + border: none; + } +a:hover, a:active { + color: #fe9201; + } + + +/* layout */ + +#container { + text-align: left; + background: url(sig.gif) no-repeat bottom right; +} + +#intro { + min-width: 400px; + } + +/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */ +#pageHeader h1 { + margin: 10px 0 0 410px; + padding: 0 0 0 0; + width: 257px; + height: 18px; + background: transparent url(hd_zengarden.gif) no-repeat 0 0; + } +#pageHeader h1 span { + display:none + } +#pageHeader h2 { + padding: 0; + margin: 210px 0 0 410px; + width: 289px; + height: 70px; + background: transparent url(hd_beauty.gif) no-repeat 0 0; + } +#pageHeader h2 span { + display:none; + } + +#quickSummary p.p1 { + position: absolute; + top: 30px; + left: 410px; + margin: 0; + padding: 0 50px 0 0; + font: 14pt/18pt verdana, helvetica, sans-serif; + text-transform: lowercase; + color: #869152; +} +#quickSummary p.p2 { + position: absolute; + top: 850px; + left: 0; + width: 320px; + margin: 0; + padding: 15px 20px 15px 20px; + text-align: left; + font-size: 1.1em; + font-weight: bold; + background: #677235; +} + +#preamble { + margin: 10px 50px 40px 410px; + padding: 20px 0 40px 0; + border-top: 1px dotted #869152; + background: url(koi.gif) no-repeat bottom center; + } +#preamble h3 { + background: url(hd_enlighten.gif) no-repeat 0 0; + width: 301px; + height: 23px; +} +#preamble h3 span { + display:none; +} + +#supportingText { + margin: 0 50px 0 410px; + } +#explanation { + padding-bottom: 40px; + background: url(koi.gif) no-repeat bottom center; +} +#explanation h3 { + background: url(hd_about.gif) no-repeat 0 0; + width: 302px; + height: 19px; +} +#explanation h3 span { + display:none; +} +#participation { + margin-top: 20px; + padding-bottom: 40px; + background: url(koi.gif) no-repeat bottom center; +} +#participation h3 { + background: transparent url(hd_participation.gif) no-repeat 0 0; + width: 140px; + height: 23px; +} +#participation h3 span { + display:none; +} +#benefits { + margin-top: 20px; + padding-bottom: 40px; + background: url(koi.gif) no-repeat bottom center; +} +#benefits h3 { + background: transparent url(hd_benefits.gif) no-repeat 0 0; + width: 106px; + height: 24px; +} +#benefits h3 span { + display:none; +} +#requirements { + margin-top: 20px; + padding-bottom: 40px; +} +#requirements h3 { + background: transparent url(hd_requirements.gif) no-repeat 0 0; + width: 155px; + height: 23px; +} +#requirements h3 span { + display:none; +} + +#footer { + margin-top: 20px; +} +#footer a:link, #footer a:visited { + margin-right: 20px; + } + +/* navigation / links */ + +#linkList { + position: absolute; + top: 940px; + left: 0; + width: 360px; + text-align: left; + padding: 0; + margin: 0; + font-size: .9em; +} + +/* linklist WITHOUT favorites */ +/* NOTE: keep this linklist CSS if favorites remains hidden */ +#lselect { + clear: none; + float: left; + width: 180px; + padding: 0 19px 0 20px; + margin: 0 0 30px 0; + border-right: 1px solid #677235; + voice-family: "\"}\""; + voice-family: inherit; + width: 140px; + } +html>body #lselect { + width: 140px; + } +#larchives { + float: right; + width: 180px; + padding: 0 0 0 20px; + margin: 0 0 30px 0; + voice-family: "\"}\""; + voice-family: inherit; + width: 160px; + } +html>body #larchives { + width: 160px; + } +#lresources { + float: left; + width: 170px; + padding: 0 0 0 20px; + margin: 0 0 30px 0; + voice-family: "\"}\""; + voice-family: inherit; + width: 160px; + } +html>body #lresources { + width: 160px; + } +/* /end linklist WITHOUT favorites */ + +/* linklist WITH #lfavorites */ +/* NOTE: in case you decide to uncomment #lfavorites div, comment the above link list CSS and uncomment the below +#lselect { + float: left; + width: 150px; + padding: 0 19px 0 20px; + margin: 0 0 30px 0; + border-right: 1px solid #677235; +} +#lfavorites { + float: left; + width: 150px; + padding: 0 0 0 20px; + margin: 0 0 30px 0; +} +#larchives { + float: left; + width: 150px; + padding: 0 19px 0 20px; + margin: 0 0 30px 0; + border-right: 1px solid #677235; +} +#lresources { + float: left; + width: 150px; + padding: 0 0 0 20px; + margin: 0 0 30px 0; +} +end linklist WITH #lfavorites */ + +#linkList h3.select { + background: url(hd_select.gif); + margin: 0; + width: 96px; + height: 12px; + border: 0; +} +#linkList h3.select span { + display:none +} +#linkList h3.favorites { + background: url(hd_favorites.gif); + margin: 0; + width: 58px; + height: 10px; + border: 0; +} +#linkList h3.favorites span { + display:none +} +#linkList h3.archives { + background: url(hd_archives.gif); + margin: 0; + width: 53px; + height: 10px; + border: 0; +} +#linkList h3.archives span { + display:none +} +#linkList h3.resources { + background: url(hd_resources.gif); + margin: 0; + width: 66px; + border: 0; + height: 10px; +} +#linkList h3.resources span { + display:none +} +#linkList ul { + margin: 0px; + padding: 0px; +} +#linkList li { + list-style-type: none; + display: block; + padding-top: 2px; + margin-bottom: 2px; +} +#linkList li a:link { + text-decoration: none; + border: none; +} +#linkList li a:visited { + text-decoration: none; + border: none; +} + +#linkList li a.c { + text-decoration: none; + border: none; +} + +/* extra divs */ +#extraDiv1 { + margin: 10px 0 0 410px; + background: url(sig.gif) no-repeat bottom right; +} + +/* css Zen Garden submission 016 - 'The Garden Beneath' by Minz Meyer - www.minzweb.de */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Minz Meyer */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+body {
+ background-image: url(deepblue.jpg);
+ background-position: top right;
+ background-color: #172E52;
+ background-repeat: no-repeat;
+ margin-top: 20px;
+ padding: 0px;
+ color: #88A3C9;
+ font: 0.8em/1.6 Tahoma, sans-serif;
+ letter-spacing: 0.1em;
+}
+
+#container {
+ background-color: transparent;
+ background-position: bottom left;
+ background-image: url(manta.jpg);
+ background-repeat: no-repeat;
+ width: 99%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+}
+
+#pageHeader h1 {
+ background-image: url(zengarden.gif);
+ background-repeat: no-repeat;
+ width: 306px;
+ height: 36px;
+ margin: 0;
+}
+
+#pageHeader h1 span {
+ display: none;
+}
+
+#pageHeader h2 {
+ background-image: url(thebeauty.gif);
+ background-repeat: no-repeat;
+ width: 306px;
+ height: 24px;
+ margin: 0px;
+}
+
+#pageHeader h2 span {
+ display: none;
+}
+
+#pageHeader {
+ position: absolute;
+ right: 28px;
+ top: 195px;
+ width: 306px;
+}
+
+#extraDiv3 {
+ position: absolute;
+ right: 30px;
+ top: 280px;
+ background-image: url(preamble.gif);
+ background-repeat: no-repeat;
+ height: 156px;
+ width: 300px;
+ padding-bottom: 20px;
+ overflow: hidden;
+}
+
+#preamble {
+ margin-right: 420px;
+ margin-left: 25px;
+ padding: 5px;
+ border-top: 1px solid;
+ border-right: 1px solid;
+}
+
+#preamble h3 {
+ width: 190px;
+ height: 190px;
+ margin-top: 0;
+ display: inline;
+ float: left;
+ background-image: url(theroad.jpg);
+}
+
+#preamble h3 span {
+ display: none;
+}
+
+#preamble p {
+ margin-left: 25px;
+ margin-right: 15px;
+ font-style: italic;
+ text-align: justify;
+}
+
+#explanation {
+ margin-left: 10px;
+ margin-top: 30px;
+ margin-bottom: 100px;
+ margin-right: 370px;
+ padding: 5px;
+ border-top: 1px solid;
+ border-left: 1px solid;
+}
+
+#explanation h3 {
+ width: 150px;
+ height: 140px;
+ display: inline;
+ float: left;
+ background-image: url(whatabout.jpg);
+}
+
+#explanation h3 span {
+ display: none;
+}
+
+#explanation p {
+ margin-left: 25px;
+ margin-right: 15px;
+ text-align: justify;
+}
+
+#benefits {
+ margin-left: 150px;
+ margin-top: 30px;
+ margin-bottom: 100px;
+ margin-right: 340px;
+ padding: 5px;
+ border-top: 1px solid;
+ border-left: 1px solid;
+}
+
+#benefits h3 {
+ width: 150px;
+ height: 150px;
+ display: inline;
+ float: right;
+ background-image: url(benefits.jpg);
+}
+
+#benefits h3 span {
+ display: none;
+}
+
+#benefits p {
+ margin-left: 15px;
+ margin-right: 25px;
+ text-align: justify;
+}
+
+#participation {
+ margin-top: 30px;
+ margin-bottom: 110px;
+ margin-left: 50px;
+ margin-right: 335px;
+ padding: 5px;
+ border-top: 1px solid;
+ border-right: 1px solid;
+}
+
+#participation h3 {
+ width: 160px;
+ height: 155px;
+ margin-top: 15px;
+ display: inline;
+ float: left;
+ background-image: url(participate.jpg);
+ background-repeat: no-repeat;
+}
+
+#participation h3 span {
+ display: none;
+}
+
+#participation p {
+ margin-left: 25px;
+ margin-right: 15px;
+ text-align: justify;
+}
+
+#requirements {
+ margin-top: 30px;
+ margin-bottom: 100px;
+ margin-left: 130px;
+ margin-right: 150px;
+ padding: 5px;
+ border-top: 1px solid;
+ border-right: 1px solid;
+}
+
+#requirements h3 {
+ margin-top: 15px;
+ width: 160px;
+ height: 160px;
+ display: inline;
+ float: left;
+ background-image: url(requirements.jpg);
+ background-repeat: no-repeat;
+}
+
+#requirements h3 span {
+ display: none;
+}
+
+#requirements p {
+ margin-left: 25px;
+ margin-right: 15px;
+ text-align: justify;
+}
+
+#supportingText {
+ margin-top: 100px;
+
+}
+
+#linkList {
+ position: absolute;
+ color: #425162;
+ background-color: transparent;
+ top: 437px;
+ right: 30px;
+ width: 300px;
+ height: 450px;
+ background-image: url(navigation.gif);
+ background-repeat: no-repeat;
+ background-position: right;
+
+}
+
+#linkList2 {
+ margin-top: 30px;
+ margin-left: 20px;
+ margin-right: 25px;
+ width: 260px;
+ height: 350px;
+ overflow: auto;
+ font: 11px "Courier New", monospace;
+ color: #95A5BB;
+ background-color: transparent;
+}
+
+h3.select {
+ font: bold 12px "Courier New", monospace;
+ border: 1px solid;
+ margin-top: 10px;
+ margin-left: 10px;
+ margin-right: 10px;
+ margin-bottom: 0;
+ padding-left: 5px;
+ padding-right: 5px;
+ color: #1D2139;
+ background-color: #555764;
+}
+
+h3.archives {
+ font: bold 12px "Courier New", monospace;
+ border: 1px solid;
+ margin-top: 10px;
+ margin-left: 10px;
+ margin-right: 10px;
+ margin-bottom: 0;
+ padding-left: 5px;
+ padding-right: 5px;
+ color: #1D2139;
+ background-color: #555764;
+}
+
+h3.resources {
+ font: bold 12px "Courier New", monospace;
+ border: 1px solid;
+ margin-top: 10px;
+ margin-left: 10px;
+ margin-right: 10px;
+ margin-bottom: 0;
+ padding-left: 5px;
+ padding-right: 5px;
+ color: #1D2139;
+ background-color: #555764;
+}
+
+#linkList ul {
+ list-style: none;
+ margin-top: 0;
+}
+
+li {
+ margin-left: -15px;
+ margin-right: 15px;
+ margin-bottom: 0px;
+}
+
+li:hover {
+ margin-left: -15px;
+ margin-right: 15px;
+ background-color: #555764;
+ color: #1D2139;
+}
+
+a:link {
+ color: #C6B768;
+ background-color: transparent;
+ text-decoration: none;
+}
+
+a:visited {
+ color: #867833;
+ background-color: transparent;
+ text-decoration: line-through;
+}
+
+a:hover, a:focus {
+ color: #EBD678;
+ background-color: transparent;
+ text-decoration: underline;
+}
+
+#extraDiv1 {
+ position: absolute;
+ background-image: url(validation.gif);
+ background-repeat: no-repeat;
+ top: 887px;
+ right: 30px;
+ width: 300px;
+ height: 100px;
+ z-index: 1;
+}
+
+* html #footer {
+ width: 260px;
+ w\idth: 228px;
+}
+#footer {
+ font: 11px "Courier New", monospace;
+ position: absolute;
+ top: 922px;
+ right: 50px;
+ z-index: 2;
+ padding: 8px 15px;
+ height: 20px;
+ overflow: auto;
+ width: 228px;
+}
+
+#extraDiv2 {
+ position: absolute;
+ background-image: url(download.gif);
+ background-repeat: no-repeat;
+ top: 987px;
+ right: 30px;
+ width: 300px;
+ height: 100px;
+ z-index: 1;
+}
+* html #quickSummary {
+ width: 260px;
+ w\idth: 228px;
+}
+#quickSummary {
+ width: 228px;
+ position: absolute;
+ top: 1022px;
+ right: 50px;
+ z-index: 2;
+ padding: 0 15px;
+ height: 40px;
+ overflow: auto;
+}
+
+
+#quickSummary p.p1 {
+ display: none;
+}
+
+#quickSummary p.p2 {
+ margin-top: 4px;
+ color: #95A5BB;
+ background-color: transparent;
+ font: 11px "Courier New", monospace;
+}/* css Zen Garden submission 017 - 'Golden Mean' by Douglas Bowman, http://www.stopdesign.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Douglas Bowman*/
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* Design and CSS created by Douglas Bowman */
+/* www.stopdesign.com */
+
+/* structure +--------------------------------- */ +body { + margin:0; + padding:0; + background:#EBE8D0 url("bg_body.gif") repeat-x left top; + color:#333; + text-align:center; + font:x-small Georgia,Serif; + voice-family: "\"}\""; voice-family:inherit; + font-size:small; + } html>body {font-size:small;} +#container { + position:relative; + width:732px; + margin:0 auto; + text-align:left; + } +#intro { + border:1px solid #A79355; + border-width:0 1px; + } + + +/* hidden text +--------------------------------- */ +h1, h2, h3 { + margin:0; + background-repeat:no-repeat; + background-position:left top; + } +h1 span, h2 span, h3 span, #quickSummary p.p1 span {display:none;} + + +/* header and summary +--------------------------------- */ +#pageHeader h1 { + height:71px; + background:url("bg_zengarden.gif") no-repeat 35px 42px; + } +#pageHeader h2 { + height:115px; + background:url("bg_beautyof.jpg") no-repeat left top; + } +#quickSummary p.p1 { + height:76px; + margin:0; + background:url("bg_quicksum.gif") no-repeat 35px 18px; + } +#quickSummary p.p2 { + position:absolute; + top:78px; + right:35px; + width:200px; + margin:0; + font-size:93%; + line-height:1.3em; + text-align:right; + color:#A79355; + background-color:transparent; + } +#quickSummary p.p2 a:link, #quickSummary p.p2 a:visited { + white-space:nowrap; + font:bold 92%/1.3em Verdana,Arial,Sans-serif; + text-transform:uppercase; + } + + +/* preamble +--------------------------------- */ +#preamble { + position:absolute; + top:304px; + right:0; + width:180px; + } +#preamble h3 { + height:44px; + background-image:url("bg_road.gif"); + } +#preamble p { + margin:.5em 0; + font-size:93%; + font-style:italic; + line-height:1.7em; + color:#66472E; + background-color:transparent; + } + + +/* supporting text +--------------------------------- */ +#supportingText { + margin:0 200px; + border:1px solid #A79355; + border-width:0 1px; + padding-bottom:8px; + border-bottom:8px solid #BDAF83; + } +#supportingText p { + margin:.75em 0; + line-height:1.5em; + padding:0 20px; + } +#supportingText h3 { + height:40px; + border:1px solid #A79355; + border-width:1px 0; + margin:1em 0 .5em; + background-color:#D9D98B; + } +#explanation h3 { + height:80px; + background-image:url("bg_what.jpg"); + border-top-width:0; + margin:0 0 10px; + } +#participation h3 {background-image:url("bg_participation.jpg");} +#benefits h3 {background-image:url("bg_benefits.jpg");} +#requirements h3 {background-image:url("bg_requirements.jpg");} + + +/* link list +--------------------------------- */ +#linkList { + position:absolute; + top:306px; + left:0; + width:180px; + } +#linkList h3 {height:23px;} +#lselect h3 { + height:41px; + background-image:url("bg_select.gif"); + } +#larchives h3 {background-image:url("bg_archives.gif");} +#lresources h3 {background-image:url("bg_resources.gif");} +#linkList ul { + margin:1em 0 1.5em; + padding:0; + font-size:93%; + list-style:none; + } +#larchives li, #lresources li {text-transform:lowercase;} +#linkList ul li { + background:url("icon_diamond.gif") no-repeat 2px 50%; + margin:0 0 .5em; + padding:0 0 0 14px; + line-height:1.5em; + } +#linkList li a:link, #linkList li a:visited { + font-family:Verdana,Arial,Sans-serif; + font-weight:bold; + } +#linkList #lselect li { + background:url("icon_pg.gif") no-repeat 0 15%; + color:#A79355; + } +#linkList #lselect a:link, #linkList #lselect a:visited {display:block;} +#linkList #lselect a.c:link, #linkList #lselect a.c:visited { + display:inline; + font-family:Georgia,Serif; + font-weight:normal; + color:#616623; + background-color:transparent; + text-transform:lowercase; + } + + +/* footer +--------------------------------- */ +#footer { + background:#D9D98B url("bg_pattern.gif"); + color:#fff; + margin:1.75em 0 0; + padding:10px 20px; + border:1px solid #A79355; + border-width:1px 0; + font:85% Verdana,Arial,Sans-serif; + text-align:center; + } +#footer a:link, #footer a:visited { + padding:0 5px; + font-weight:normal; + } + + +/* links +--------------------------------- */ +a:link, a:visited { + color:#703F0E; + background-color:transparent; + font-weight:bold; + text-decoration:none; + } +a:hover { + color:#616623; + background-color:transparent; + text-decoration:underline; + } + + +/* misc +--------------------------------- */ +acronym {border-width:0;}/* css Zen Garden submission 018 - 'Wrapped in Burlap' by John Simons, http://www.royalbarrel.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, John Simons*/
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* Top-level stuff
+------------------------------*/
+body {
+ margin:10px 0 0 0;
+ padding:0;
+ font-family:verdana;
+ font-size:85%;
+ background-color:#fff;
+ }
+p {
+ margin-top:0;
+ }
+#container {
+ width:745px;
+ margin-left:30px;
+ position:relative;
+ background-color:#F7F0E9;
+ }
+
+/* Intro section
+------------------------------*/
+#intro {
+ position:relative;
+ background-color:white;
+ }
+#pageHeader {
+ background-image:url("title.gif");
+ background-repeat:no-repeat;
+ height:181px;
+ }
+#pageHeader h1, #pageHeader h2 span {
+ display:none;
+ }
+#pageHeader h2 {
+ width:75px;
+ height:84px;
+ background-image:url("small_tree.gif");
+ background-repeat:no-repeat;
+ position:absolute;
+ top:-10px;
+ left:690px;
+ margin:0;padding:0;
+ }
+
+#quickSummary {
+ text-align:right;
+ position:absolute;
+ top:75px;
+ left:500px;
+ width:245px;
+ font-size:100%;
+ font-style:italic;
+ font-family:times new roman, serif;
+ }
+#quickSummary p {
+ margin-bottom:0px;
+ }
+#quickSummary a {
+ color:#C52E00;
+ }
+
+/* Left-hand column
+------------------------*/
+#supportingText, #preamble {
+ width:505px;
+ background-image:url("burlap.jpg");
+ color:white;
+ line-height:140%;
+ }
+
+#supportingText p, #preamble p {
+ margin:0;
+ padding:4px 10px 10px 10px;
+ }
+#supportingText a, #preamble a {
+ color:#FFAF7F;
+ }
+
+#preamble h3, #supportingText h3 {
+ height:44px;
+ margin:0;
+ padding:0;
+ border-top:1px solid #F7F0E9;
+ border-bottom:1px solid #F7F0E9;
+ border-left:1px solid #735B5A;
+ }
+#preamble h3 { border-top-width:0px; }
+
+#preamble h3 span, #supportingText h3 span { display: none; }
+
+#preamble h3 { background-image:url("enlightenment.gif"); }
+#explanation h3 { background-image:url("whatabout.gif"); }
+#participation h3 { background-image:url("participation.gif"); }
+#benefits h3 { background-image:url("benefits.gif"); }
+#requirements h3 { background-image:url("requirements.gif"); }
+
+/* Footer
+-----------------------------*/
+#footer {
+ text-align:center;
+ background:#F7F0E9 url("footer_bg.jpg");
+ padding:8px 0px;
+ font-size:120%;
+ font-weight:bold;
+ }
+#footer a {
+ color:#583C3B;
+ text-decoration:none;
+ }
+#footer a:hover {
+ color:#D17B00;
+ }
+
+
+/* Link List
+------------------------------------*/
+#linkList {
+ position:absolute;
+ top:181px;
+ left:505px;
+ width:240px;
+ background-image:url("right_bg.jpg");
+ background-repeat:no-repeat;
+ color:#774747;
+ border-top:1px solid #E0D5CA;
+ font-weight:bold;
+ padding-bottom:200px;
+ line-height:140%;
+ }
+#linkList ul {
+ padding-left:30px;
+ margin-left:0px;
+ }
+#linkList li {
+ margin-bottom:15px;
+ }
+#linkList a {
+ color:#686057;
+ text-decoration:none;
+ }
+#linkList a:hover {
+ text-decoration:underline;
+ }
+#linkList a:visited {
+ color:#999189;
+ }
+
+/* To get a linebreak between title and author */
+#linkList #lselect a { display:block; }
+#linkList #lselect a:hover {color:#C52E00; }
+#linkList #lselect a.c { display:inline; }
+#linkList #lselect a.c:hover {color:#686057; }
+
+#linkList h3 {
+ margin:0; padding:0;
+ background-repeat:no-repeat;
+ height:46px;
+ }
+#linkList h3 span { display:none; }
+#linkList h3.select { background-image:url("select.gif"); }
+#linkList h3.archives { background-image:url("archives.gif"); }
+#linkList h3.resources { background-image:url("resources.gif"); }
+
+
+/* css Zen Garden submission 019 - 'What Lies Beneath' v1.01 by Michael Pick, http://www.mikepick.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Mike Pick */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+body {
+ font: 11px/18px verdana;
+ color: #ffffff;
+ background: #000000 url(body-background.jpg) repeat-x;
+ margin: 0px;
+ margin-bottom: 20px;
+ width: 2300px;
+ }
+p {
+ font: 11px/18px verdana;
+ margin-top: 0px;
+ text-align: left;
+ }
+h3 {
+ font: 12pt georgia;
+ margin-top: 0px;
+ margin-bottom: 5px;
+ color: #ffffff;
+ }
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #E8AD62;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #E0922F;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #FFCC00;
+ }
+
+
+/* specific divs */
+
+#pageheader {
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+
+#pageHeader h1 {
+ background: transparent url(title.jpg) no-repeat top left;
+ width: 2300px;
+ height: 85px;
+ margin-top: 70px;
+ }
+
+#pageHeader h1 span {
+ display:none
+ }
+
+#pageHeader h2 span {
+ display:none;
+ }
+
+#quickSummary {
+ position: absolute;
+ left: 55px;
+ top: 170px;
+ width: 250px;
+ z-index: 2;
+ }
+
+#quickSummary p {
+ font: italic 10px/16px georgia;
+ text-align: right;
+ }
+
+#preamble {
+ position: absolute;
+ background: transparent url(femur.jpg) no-repeat bottom left;
+ top: 170px;
+ left: 545px;
+ width: 300px;
+ height: 431px;
+ z-index: 2;
+ }
+
+#preamble h3 {
+ background: transparent url(the_road.jpg) no-repeat top left;
+ width: 300px;
+ height: 25px;
+ }
+
+#preamble h3 span {
+ display: none;
+ }
+
+#supportingText {
+ }
+
+#explanation {
+ position: absolute;
+ top: 170px;
+ left: 865px;
+ width: 300px;
+ z-index: 2;
+ }
+
+#explanation h3 {
+ background: transparent url(so_what.jpg) no-repeat top left;
+ width: 300px;
+ height: 25px;
+ }
+
+#explanation h3 span {
+ display: none;
+ }
+
+#participation {
+ position: absolute;
+ background: transparent url(tin_can.jpg) no-repeat top left;
+ top: 170px;
+ left: 1185px;
+ width: 300px;
+ z-index: 2;
+ padding-bottom: 40px;
+ }
+
+#participation h3 {
+ background: transparent url(participation.jpg) no-repeat top left;
+ width: 300px;
+ height: 25px;
+ }
+
+#participation h3 span {
+ display: none;
+ }
+
+#benefits {
+ background: transparent url(ants.jpg) no-repeat top left;
+ position: absolute;
+ top: 170px;
+ height: 450px;
+ left: 1505px;
+ width: 300px;
+ z-index: 2;
+ }
+
+#benefits h3 {
+ background: transparent url(benefits.jpg) no-repeat top left;
+ width: 300px;
+ height: 25px;
+ }
+
+#benefits h3 span {
+ display: none;
+ }
+
+#requirements {
+ position: absolute;
+ top: 170px;
+ left: 1825px;
+ width: 300px;
+ z-index: 2;
+ padding-bottom: 40px;
+ }
+
+#requirements h3 {
+ background: transparent url(requirements.jpg) no-repeat top left;
+ width: 300px;
+ height: 25px;
+ }
+
+#requirements h3 span {
+ display: none;
+ }
+
+#requirements p {
+ font: 9px/15px verdana;
+ }
+
+#footer {
+ position: absolute;
+ background: transparent url(worm.jpg) no-repeat;
+ text-align: right;
+ top: 170px;
+ left: 2145px;
+ width: 100px;
+ height: 325px;
+ z-index: 2;
+ }
+
+#footer a:link, #footer a:visited {
+ display: block;
+ }
+
+#linkList {
+ position: absolute;
+ left: 325px;
+ top: 170px;
+ width: 200px;
+ z-index: 2;
+ }
+
+#linkList2 {
+ font: 9px verdana, sans-serif;
+ }
+
+#linkList h3.select {
+ background: transparent url(select.jpg) no-repeat top left;
+ width: 200px;
+ height: 25px;
+ }
+
+#linkList h3.select span {
+ display:none
+ }
+#linkList h3.favorites {
+ background: transparent url(favorites.jpg) no-repeat top left;
+ margin-top: 15px;
+ width: 200px;
+ height: 25px;
+ }
+#linkList h3.favorites span {
+ display:none
+ }
+#linkList h3.archives {
+ background: transparent url(archives.jpg) no-repeat top left;
+ margin-top: 15px;
+ width: 200px;
+ height: 25px;
+ }
+#linkList h3.archives span {
+ display:none
+ }
+#linkList h3.resources {
+ background: transparent url(resources.jpg) no-repeat top left;
+ margin-top: 15px;
+ width: 200px;
+ height: 25px;
+ }
+#linkList h3.resources span {
+ display:none
+ }
+
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+#linkList li {
+ line-height: 2.5ex;
+ list-style-type: none;
+ display: block;
+ padding-top: 5px;
+ margin-bottom: 5px;
+ }
+#linkList li a:link {
+ color: #E8AD62;
+ }
+#linkList li a:visited {
+ color: #E0922F;
+ }
+#linklist li a:hover, a:active {
+ color: #00CCFF;
+ }
+
+#extraDiv1 {
+ background: transparent url(mole.jpg) bottom left no-repeat;
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ width: 2300px;
+ height: 630px;
+ z-index: 1;
+ }/* css Zen Garden submission 020 - 'Friendly Beaches' by Sophie G - www.sophie-g.net */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Sophie G */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
body { + background-color: #FFF; + margin: 0px; + padding: 10px; + font-family: Georgia, "Times New Roman", Times, serif; + font-size: 90%; +}
p { + line-height: 180%; + }
+#container { + background-color: #EDEEF0; + border: 1px solid #DAD5D9; + padding: 0px; + margin: 0px; +} +acronym { + border-bottom: 1px #6BA0D2 dashed; +} +#pageHeader { + font-family: Verdana, Arial, Geneva, Helvetica, sans-serif; + background-color: #A4ACB3; +} +#pageHeader h1 { + height: 190px; + margin: 0px; + background-image: url(headerh1.jpg); + background-repeat: no-repeat; +} +#pageHeader h1 span, #pageHeader h2 span { + display: none; +} +#pageHeader h2 { + background-color: #EDEEF0; + margin: 0px; + height: 24px; + padding: 0px 14px 2px 14px; + background-image: url(headerh2.gif); + background-repeat: no-repeat; +} +#pageHeader h2 acronym { + color: #FFF; + border-bottom: 1px #FFF dashed; +} +#quickSummary p.p1 { + position: absolute; + right: 21px; + top: 21px; + width: 12em; + height: 168px; + padding: 0px; + margin: 0px; + border: 1px solid #0C2953; + text-align: center; + font-size: 90%;
font-family: Verdana, Arial, Geneva, Helvetica, sans-serif; + line-height: 110%;
color: #FFF; + background-image: url(summary.jpg); + background-repeat: no-repeat; + background-position: 50% 100%; + background-color: #0C2953; +} +#quickSummary p.p1 span { + display: block; + padding: 3px; +} +#preamble { + padding: 0px 15em 0px 3em; +} +#preamble h3 { + margin: 15px 0px 0px 0px; + padding: 6px 20px 2px 6px; + text-align: left; + font-size: 180%; + font-variant: small-caps; + color: #6BA0D2; + background-image: url(bordDroitPreambleh3.gif); + background-repeat: no-repeat; + background-position: 100% 0px; + background-color: #F6F7F7; +} +#preamble h3 span { + display: block; + padding: 20px 0px 15px 48px; + background-image: url(preambleShell.jpg); + background-repeat: no-repeat; + background-position: 0px 50%; +} +#preamble p { + text-align: justify; +} +#preamble p.p1, #preamble p.p2 { + margin: 0px; + padding: 10px 20px 2px 6px; + background-image: url(bordDroitPreamble.gif); + background-repeat: repeat-y; + background-position: 100% 0px; + background-color: #F6F7F7; +} +#preamble p.p3 { + margin: 0px; + padding: 0px; + background-image: url(bordBasPreamble.gif); + background-repeat: no-repeat; + background-position: 100% 100%; + background-color: #F6F7F7; +} +#preamble p.p1 span, #preamble p.p2 span, #preamble p.p3 span { + display: block; +} +#preamble p.p3 span { + margin: 0px; + padding: 10px 20px 20px 6px; + background-image: url(bordBasPreambleGauche.gif); + background-repeat: no-repeat; + background-position: 0% 100%; +} +#preamble p:first-letter, #preamble p span:first-letter { + color: #6BA0D2; + font-size: 140%; + font-weight: bold; + margin: 0px 2px 0px 0px; +} +#supportingText { + margin: 0px; + padding: 10px 16em 0px 1em; + font-size: 90%; +} +#explanation, #participation, #benefits, #requirements { + border: 2px solid #FFF; + padding: 0px; +} +#explanation { + margin: 0px 0px 10px 0px; +} +#participation { + margin: 0px 0px 10px 0px; + float: left; + width: 30%; +} +#benefits { + margin: 0px 0px 10px 32%; +} +#requirements { + margin: 0px 0px 10px 32%; +} +#supportingText h3 { + margin: 0px; + padding: 5px 30px 1px 2px; + text-align: left; + font-size: 120%; + font-variant: small-caps; + color: #6BA0D2; + border-bottom: 1px solid #6BA0D2; + background-color: #F6F7F7; + background-repeat: no-repeat; + background-position: 100% 50%; +} +#explanation h3 { + background-image: url(explanationShell.jpg); +} +#participation h3 { + background-image: url(participationShell.jpg); +} +#benefits h3 { + background-image: url(benefitsShell.jpg); +} +#requirements h3 { + background-image: url(requirementsRock.jpg); +} +#supportingText p { + text-align: justify; + margin: 10px 0px 0px 0px; + padding: 1px 3px 2px 3px; +} +#supportingText p:first-letter, #supportingText p span:first-letter { + font-weight: bold; +} +#supportingText a:link { + color: #0083FF; + font-weight: bold; +} +#supportingText a:visited { + color: #204160; + font-weight: bold; +} +#supportingText a:hover, #supportingText a:active { + color: #8C0000; + font-weight: bold; + text-decoration: none; +} +#linkList, #quickSummary p.p2 { + font-size: 90%; + font-family: Verdana, Arial, Geneva, Helvetica, sans-serif; + position: absolute; + right: 21px; + width: 12em; + border: 1px solid #0C2953; + padding: 0px; + margin: 0px; + background-color: #A4ACB3; +} +#quickSummary p.p2 { + height: 50px; + text-align: center; + top: 217px; +} + +#quickSummary p.p2 span { + font-size: 90%; + display: block; + padding: 3px; + color: #FFF; +} +#linkList { + top: 266px; +} +#linkList h3 { + background-color: #0C2953; + color: #FFF; + margin: 0px; + padding: 30px 1px 1px 1px; + background-repeat: no-repeat; +} +#linkList h3.select { + background-image: url(selecth3.jpg); + background-position: 50% 0%; +} +#linkList h3.favorites { + border-top: 1px solid #0C2953; + background-image: url(favoritesh3.jpg); + background-position: 40% 100%; +} +#linkList h3.archives { + border-top: 1px solid #0C2953; + background-image: url(archivesh3.jpg); + background-position: 40% 100%; +} +#linkList h3.resources { + border-top: 1px solid #0C2953; + background-image: url(resourcesh3.jpg); + background-position: 50% 30%; +} +#linkList h3:first-letter, #linkList h3 span:first-letter { + color: #FFF; + font-size: 160%; +} +#linkList ul { + list-style-type: none; + font-size: 90%; + color: #FFF; + margin: 0px; + padding: 0px; + background-color: #A4ACB3; +} +#linkList li { + padding: 3px 2px 3px 2px; + margin-bottom: 4px; +} +#linkList li:hover { + padding: 2px 1px 2px 1px; + border: 1px dotted #0C2953; + background-color: #6BA0D2; +} +#quickSummary p.p2 span a:link { + color: #FFF; + font-weight: bold; +} +#quickSummary p.p2 span a:visited { + color: #204160; +} +#quickSummary p.p2 span a:hover, #quickSummary p.p2 span a:active { + color: #FFD800; + font-weight: bold; + text-decoration: none; +} +#linkList a:link, #linkList a:visited { + border-left: 6px solid #FFF; + padding-left: 2px; + font-weight: bold; + color: #FFF; +} +#linkList a:visited { + color: #204160; +} +#linkList a:hover, #linkList a:active { + border-left: 6px solid #FFD800; + padding-left: 2px; + color: #FFD800; + text-decoration: none; + font-weight: bold; +} +#linkList a.c:link, #linkList a.c:visited { + border-left: none; + padding-left: 0px; + font-weight: normal; + color: #FFF; +} +#linkList a.c:hover, #linkList a.c:active { + border-left: none; + padding-left: 0px; + color: #FFD800; + text-decoration: none; +} +#linkList acronym { + border-bottom: 1px #FFF dashed; +} +#footer { + clear: both; + text-align: right; + margin: 0px -16em 0px 0px; + padding: 25px 0px 0px 0px; + background-repeat: no-repeat; + background-image: url(signSoph.gif); + background-position: 0% 95%; +} +#footer a { + font-size: 70%; + font-family: Verdana, Arial, Geneva, Helvetica, sans-serif; +}/* css Zen Garden submission 021 - 'Calm & Smooth' by Cornelia Lange - http://www.clkm.de/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Cornelia Lange */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+ +/* elements */ +body { +color: #000; +background: #F1ECE3 url(topbg.gif) repeat-x; +font: 90% Verdana, Arial, Helvetica, sans-serif; +} +body, html, h1, h2, h3, p, ul, li, div { +margin: 0; +padding: 0; +} +p { +font-size: .82em; +line-height: 140% +} +a { +color: #069; +font-weight: bold; +text-decoration: none; +background: transparent; +} +a:visited { +color: #000; +background: transparent; +} +a:hover { +text-decoration: underline; +color: #900; +background: transparent; +} +ul, li { +display: block; +list-style: none; +} +acronym { +border: 0 none; +} + +/* divs and related classes */ +#pageHeader h1 { +font: bold 3.2em Arial, Helvetica, sans-serif; +color: #8ab; +background: transparent; +position: absolute; +top: 340px; +left: 256px; +z-index: 5; +text-transform: lowercase; +} +#pageHeader h2 { +position: absolute; +left: 20px; +top: 68px; +display: block; +width: 138px; +height: 88px; +font: bold 1em Arial, Helvetica, sans-serif; +color: #449498; +background: transparent url(cssdesign.gif) top left no-repeat; +} +#pageHeader h2 span { +display: none; +} + +#quickSummary { +width: 200px; +margin: 235px 0 20px 15px; +padding: 20px 0 0 0; +font-size: 0.92em; +} +#quickSummary .p2 { +padding-top: 10px; +} + +#preamble { +margin: 0 0 0 13.5em; +color: #000; +background: transparent url(enlightenment.gif) top left no-repeat; +height: 6em; +clear: both; +padding: 5.8em 0 0 4.7em; +} +#preamble h3 span { +display: none; +} +#preamble .p1, #preamble .p2, #preamble .p3 { +display: block; +float: left; +} +#preamble .p1 { +margin: 10px 20px 15px 0; +width: 160px; +} +#preamble .p2 { +margin: 10px 20px 15px 0; +width: 230px; +} +#preamble .p3 { +margin: 10px 15px 15px 0; +width: 270px; +} +#preamble p:first-letter { +font: bold 1.2em Tahoma, 'Trebuchet MS', Arial, Helvetica, sans-serif; +color: #900; +background: transparent; +} + +/* supportingText */ +#supportingText { +margin: 0 0 0 13.5em; +clear: both; +} +#supportingText .p1, #supportingText .p2, #supportingText .p3, #supportingText .p4, #supportingText .p5 { +display: block; +float: left; +} +#supportingText p:first-letter { +font: bold 1.2em Tahoma, 'Trebuchet MS', Arial, Helvetica, sans-serif; +color: #900; +background: transparent; +text-transform: capitalize; +} + +#explanation { +display: block; +color: #000; +background: transparent url(buddha.gif) top left no-repeat; +height: 4em; +clear: both; +padding: 6.5em 0 0 4.7em; +} +#explanation h3 span { +display: none; +} +#explanation .p1 { +width: 320px; +margin: 10px 20px 15px 0; +} +#explanation .p2 { +width: 360px; +margin: 10px 20px 15px 0; +} + +#participation { +display: block; +height: 4em; +color: #000; +background: transparent url(participation.gif) top left no-repeat; +clear: both; +padding: 6em 0 0 4.7em; +} +#participation h3 span, #benefits h3 span { +display: none; +} +#participation .p1 { +width: 390px; +margin: 10px 20px 15px 0; +} +#participation .p2 { +width: 290px; +margin: 10px 20px 15px 0; +} +#participation .p3 { +width: 390px; +margin: 10px 20px 15px 0; +clear: left; +} +#participation .p4 { +width: 290px; +margin: 10px 20px 15px 0; +} + +#benefits { +display: block; +height: 4em; +margin: 30px 0 0 0; +color: #000; +background: transparent url(benefits.gif) top left no-repeat; +clear: both; +padding: 6.2em 0 0 4.7em; +} +#benefits p { +width: 460px; +margin: 10px 20px 15px 0; +} + +#requirements { +display: block; +height: 4em; +margin: 30px 0 0 0; +color: #000; +background: transparent url(requirements.gif) top left no-repeat; +clear: both; +padding: 7.3em 0 0 4.7em; +} +#requirements h3 span { +display: none; +} +#requirements .p1 { +width: 230px; +margin: 10px 20px 15px 0; +} +#requirements .p2 { +width: 450px; +margin: 10px 20px 15px 0; +} +#requirements .p3 { +width: 230px; +margin: 10px 20px 15px 0; +clear: left; +} +#requirements .p4 { +width: 450px; +margin: 10px 20px 15px 0; +} +#requirements .p5 { +width: 450px; +margin: 10px 20px 15px 0; +clear: left; +} + +#footer { +border-top: 1px dashed #999; +padding-top: 5px; +margin: 20px 30px 20px 5em; +clear: both; +font-size: .82em; +padding-left: 0.7em; +} +#footer a { +padding: 0 10px 0 15px; +color: #069; +background: transparent url(link.gif) left no-repeat; +} +#footer a:link, #footer a:visited { +color: #069; +background: transparent url(link.gif) left no-repeat; +} +#footer a:hover, #footer a:active { +color: #900; +background: transparent url(linkhover.gif) left no-repeat; +} + +/* left Menu */ +#linkList { +font-size: .82em; +position: absolute; +top: 33.6em; +left: 15px; +float: left; +width: 18em; +} +#linkList h3 { +color: #900; +background: transparent; +font-size: 1.2em; +padding: 1em 0 0.4em 0; +margin: 10px 0 0 0; +} + +#linkList ul { +margin-top: 0.5em; +} +#lselect li { +display: block; +height: 2.5em; +margin-top: 0.5em; +padding: 0 0 3px 20px; +background: transparent url(css.gif) 0 3px no-repeat; +} +#lselect a { +display: block; +} +#lselect a.c { +display: inline; +font-weight: normal; +} +#lselect a:hover.c { +display: inline; +font-weight: normal; +} + +#larchives li { +padding: 0 0 10px 0; +text-transform: lowercase; +color: #069; +background: transparent url(linkhover.gif) 0 3px no-repeat; /* preload hoverimage */ +} +#larchives a { +padding: 0 0 10px 20px; +} +#larchives a:link { +color: #069; +background: #F1ECE3 url(link.gif) 0 3px no-repeat; +} +#larchives a:visited { +color: #000; +background: #F1ECE3 url(link.gif) 0 3px no-repeat; +} +#larchives a:hover, #larchives a:active { +color: #900; +background: #F1ECE3 url(linkhover.gif) 0 3px no-repeat; +text-decoration: none; +} + +#lresources li { +padding: 0 0 10px 0; +text-transform: lowercase; +color: #069; +background: transparent url(linkhover.gif) 0 3px no-repeat; /* preload hoverimage */ +} +#lresources a { +padding: 0 0 10px 20px; +} +#lresources a:link { +color: #069; +background: #F1ECE3 url(link.gif) 0 3px no-repeat; +} +#lresources a:visited { +color: #000; +background: #F1ECE3 url(link.gif) 0 3px no-repeat; +} +#lresources a:hover, #lresources a:active { +color: #900; +background: #F1ECE3 url(linkhover.gif) 0 3px no-repeat; +text-decoration: none; +} + + +/* images */ + +#extraDiv1 { +position: absolute; +top: 0; +left: 150px; +width: 412px; +height: 218px; +color: #000; +background: transparent url(beauty.gif) top left no-repeat; +z-index: 5; +} +#extraDiv2 { +position: absolute; +top: 218px; +left: 139px; +width: 582px; +height: 17px; +color: #fff; +background: transparent url(streifen.gif) top left no-repeat; +} +#extraDiv3 { +position: absolute; +top: 0; +right: 0; +width: 199px; +height: 218px; +color: #000; +background: transparent url(graeser.gif) top right no-repeat; +z-index: 2; +} +#extraDiv4 { +position: absolute; +top: 235px; +left: 244px; +width: 350px; +height: 175px; +color: #000; +background: transparent url(seerosen.gif) top left no-repeat; +} + + + + +/* css Zen Garden submission 022 - 'viridity' by Laura MacArthur - http://www.tunnel-vision.org/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Laura MacArthur */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+ +
/* based once upon a time on the css Zen Garden default style v1.01 Dave Shea*/ +
/* basic stuff */ +html>body, html>body td, html>body th { + font-size: small; +} +body { + font: 10px/16px Arial, Helvetica, sans-serif; + color: #330033; + background: #669999 url(z_bgrnd.gif) repeat-x 0px 1px; + margin: 0px; + } +/*rinse and repeat*/ +div, p, th, td, li, dd, dl, dt { + font-family: Arial, Helvetica, sans-serif; +} +p { + font: 10px/18px Arial, Helvetica, sans-serif; + margin-right: 15px; + margin-left: 20px; + margin-top: 5px; + margin-bottom: 5px; + padding-right: 15px; + padding-left: 20px; + padding-top: 5px; + padding-bottom: 5px; + letter-spacing: 1px; + text-align: justify; + } +h3 { + color: #336666; + background-color: transparent; + font: bold 14px "Trebuchet MS", Arial, Helvetica, sans-serif; + letter-spacing: 4px; + text-transform: lowercase; + } +a:link { + color: #CCFFFF; + background-color: transparent; + font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; + font-weight: bold; + text-decoration: none; + } +a:visited { + color: #003333; + background-color: #669999; + font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; + font-weight: bold; + text-decoration: none; + } +a:hover, a:active { + color: #006666; + background-color: #CCFFFF; + font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; + font-weight: bold; + text-decoration: none; + } +/* specific divs */ +/*outermost div*/ +#container { + position: absolute; + margin-top: 0px; + top: 0px; + left: 0px; + width: 75%; + height: auto; + z-index: 2; + padding-left: 130px; + } +/* where the logos are */ +#pageHeader { + width: 575px; + height: 65px; + position: absolute; + left: 0px; + top: 0px; + padding-top: 31px; + } +/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */ +/*and this trick totally rocks*/ +#pageHeader h1 { + background: transparent url(zh1_combo.gif) no-repeat 0px 0px; + width: 575px; + height: 65px; + float: left; + top: 0px; + margin-top: 0px; + } +#pageHeader h1 span { + display:none; + } +#pageHeader h2 span { + display:none; + } +#preamble h3 { + background: #CCFFFF url(h3_preamble.gif) no-repeat left top; + color: #003333; + margin-top:0px; + margin-bottom:0px; + height: 25px; + border-bottom-width: 3px; + border-bottom-style: solid; + border-bottom-color: #003333; +} +#preamble h3 span{ + display:none; + } +#explanation h3 { + background: #CCFFFF url(h3_support1.gif) no-repeat left top; + color: #003333; + margin-top:0px; + margin-bottom:0px; + height: 25px; + border-bottom-width: 3px; + border-bottom-style: solid; + border-bottom-color: #003333; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #003333; + } +#explanation h3 span{ + display:none; + } +#participation h3 { + background: #CCFFFF url(h3_support2.gif) no-repeat left top; + color: #003333; + margin-top:0px; + margin-bottom:0px; + height: 25px; + border-bottom-width: 3px; + border-bottom-style: solid; + border-bottom-color: #003333; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #003333; + } +#participation h3 span{ + display:none; + } +#benefits h3 { + background: #CCFFFF url(h3_support3.gif) no-repeat left top; + color: #003333; + margin-top:0px; + margin-bottom:0px; + height: 25px; + border-bottom-width: 3px; + border-bottom-style: solid; + border-bottom-color: #003333; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #003333; + } +#benefits h3 span{ + display:none; + } +#requirements h3 { + background: #CCFFFF url(h3_support4.gif) no-repeat left top; + color: #003333; + margin-top:0px; + margin-bottom:0px; + height: 25px; + border-bottom-width: 3px; + border-bottom-style: solid; + border-bottom-color: #003333; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #003333; + } +#requirements h3 span{ + display:none; + } +/* blurb */ +#quickSummary { + color: #CCCCCC; + background-color: transparent; + width: 75%; + height: auto; + display: block; + padding-top: 125px; + } +#quickSummary p { + font: italic normal 10px/16px "Trebuchet MS", Arial, Helvetica, sans-serif; + text-align:left; + padding-top: 5px; + } +/* written intro - first paragraph */ +#preamble { + color: #333333; + background-color: #99CCCC; + width: 70%; + clear: right; + margin-bottom: 10px; + padding-bottom: 10px; + border: 1px solid #003333; + } +#preamble a:link { + color: #CCFFFF; + background-color: #669999; +} +#preamble a:hover, a:active { + color: #006666; + background-color: #CCFFFF; + } +/* the rest */ +#supportingText { + color: #333333; + background-color: #99CCCC; + width: 70%; + clear: right; + height: auto; + border: 1px solid #003333; + background-image: url(z_twig.gif); + background-repeat: no-repeat; + background-position: right bottom; + } +#supportingText a:link { + color: #CCFFFF; + background-color: #669999; +} +#supportingText a:hover, a:active { + color: #006666; + background-color: #CCFFFF; + } +#footer { + color: #CCCCCC; + background-color: #006666; + text-align: center; + border: 1px solid #003333; + background-image: url(z_trim.png); + background-repeat: repeat-x; + background-position: 0px 0px; + height: 32px; + } +/* link-tastic */ +#linkList { + position: absolute; + top: 114px; + left: 0px; + z-index: auto; + } +#linkList2 { + color: #333333; + background-color: transparent; + font: 10px "Trebuchet MS", Arial, Helvetica, sans-serif; + width: 130px; + height: auto; + padding: 0px 0px 10px; + margin-top: 0px; + text-align: right; + margin-right: 0px; + margin-bottom: 10px; + margin-left: 0px; + border-right-width: 1px; + border-right-style: solid; + border-right-color: #003333; + } +#linkList h3.select { + background: transparent url(zh3_select.gif) no-repeat 0px 0px; + margin: 0px 0px 5px; + width: 130px; + height: 100px; + } +#linkList h3.select span { + display:none; + } +#linkList h3.favorites { + background: transparent url(zh3_favs.gif) no-repeat left top; + margin: 25px 0px 5px; + width: 130px; + height: 50px; + } +#linkList h3.favorites span { + display:none; + } +#linkList h3.archives { + background: transparent url(zh3_arch.gif) no-repeat left top; + margin: 25px 0px 5px; + width:130px; + height: 50px; + } +#linkList h3.archives span { + display:none; + } +#linkList h3.resources { + background: transparent url(zh3_res.gif) no-repeat left top; + margin: 25px 0px 5px; + width:130px; + height: 50px; + } +#linkList h3.resources span { + display:none; + } +#linkList ul { + margin: 0px 5px; + padding: 0px 5px; + } +#linkList li { + line-height: 2.5ex; + list-style-type: none; + display: block; + padding-top: 5px; + margin-bottom: 5px; + } +/* leaf */ +#extraDiv1 { + background-image: url(z_cont.gif); + background-repeat: no-repeat; + position: absolute; + z-index: 1; + left: 315px; + top: 114px; + height: 299px; + width: 330px; +} +/* css Zen Garden submission 023 - 'fleur de l'avant-garde' by Michael Switzer, http://propagandabydesign.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Michael Switzer */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body { + margin: 0; + padding: 0; + border: 0; + text-align: center; + vertical-align: top; + overflow: visible; + background: #fff url(bg.gif) repeat-x; + font: x-small Verdana,sans-serif; + color: #333; + } + + + +p, h3 { + margin: 0; + padding: 0 0px 5px 0; + } + +ul { + margin: 0; + padding: 2px 0 5px 0; + } + +acronym { + border-bottom: 1px dashed #4C83AE; + } + +a acronym { + border-bottom: 0; + } + +a:link { + font-weight: 900; + color: #4C83AE; + text-decoration: none; + } + +a:visited { + font-weight: 900; + color: #999; + text-decoration: none; + } + +a:hover, +a:active { + font-weight: 900; + color: #9B3F17; + } + +#container { + position: relative; + top: 0; + margin: 0 auto; + text-align: left; + border-left: 1px dashed #666; + border-right: 1px dashed #666; + background: #FFF url(mainbg.jpg) no-repeat; + width: 770px; + height: 720px; + padding: 0; + display: block; + } + +/* page intro and subsections */ +#pageHeader { + position: absolute; + top: 30px; + left: 520px; + display: block; + margin: 0; + padding: 0; + width: 245px; + height: 30px; + background: transparent url(logo.gif) no-repeat; + border: 0; + } + +#quickSummary p.p1 { + position: absolute; + top: 293px; + left:640px; + width: 122px; + margin: 0; + padding: 0; + display: block; + text-align: right; + font: italic 14px/12px Garamond, Times, serif; + color: #9B3F17; + line-height: 1.2; + } + +#quickSummary p.p2 { + position: absolute; + top: 72px; + left: 0px; + width:760px; + text-align: right; + font: 9px Verdana, sans-serif; + color: #999999; + z-index: 2; + } + +#preamble { + position: absolute; + top: 97px; + left: 230px; + width: 540px; + height: 173px; + padding: 0; + margin: 0 10 0 0; + display: block; + overflow: auto; + } + +#preamble h3 { + background: transparent url(roadtoenlightenment.gif) no-repeat top left; + width: 257px; + height: 27px; + margin: 5px 0px 0px 5px; + } + +#preamble p { + margin: -2px 88px 7px 18px; + font: 11px/7px Tahoma,sans-serif; + line-height: 1.2; + color: #fff; + } + +/* main text and subsections */ +#supportingText { + position: absolute; + top: 290px; + left: 180px; + width: 440px; + margin: 0; + padding: 0; + display: block; + } + +#supportingText p { + font: x-small Verdana,sans-serif; + color: #333; + text-align: justify; + } + +#explanation { + position: relative; + top: 0; + left: 0; + display: block; + width: 440px; + } + +#explanation h3 { + width: 258px; + height: 21px; + margin: 0; + padding: 0; + display: block; + background: transparent url(sowhatisthisabout.gif) no-repeat; + } + +#participation { + float: left; + width: 210px; + padding: 0; + margin: 10px 0; + } + +#participation h3 { + width: 210px; + height: 21px; + margin: 0; + padding: 0; + display: block; + background: transparent url(participation.gif) no-repeat; + } + +#benefits { + float: right; + width: 210px; + padding: 0; + margin: 10px 0; + } + +#benefits h3 { + width: 210px; + height: 21px; + margin: 0; + padding: 0; + display: block; + background: transparent url(benefits_old.gif) no-repeat; + } + +#requirements { + float: right; + width: 210px; + padding:0; + margin: 10px 0; + } + +#requirements h3 { + width: 210px; + height: 21px; + margin: 0; + padding: 0; + display: block; + background: transparent url(requirements.gif) no-repeat; + } + +#footer { + width: 210px; + display: block; + text-align: right; + } + +#footer a { + display: block; + font: 9px Verdana, sans-serif; + font-weight: 900; + } + +/* links and subsections */ +#linkList { + position: absolute; + top: 321px; + left: 6px; + width: 150px; + height: 66%; +} + +#linkList div { + padding-bottom: 10px; + } + +#linkList ul { + margin-left: 5px; + list-style: none; + color: #fff; + } + +#linkList ul li a { + display: block; + } + +#linkList ul li a:link { + font-weight: 900; + color: #4C83AE; + } + +#linkList ul li a:visited { + font-weight: 900; + color: #999999; + } + +#linkList ul li a:hover, +#linkList ul li a:active { + font-weight: 900; + color: #9B3F17; + } + +#linkList ul li a.c { + display: inline; + } + +#linkList ul li a.c:link { + font-weight: 500; + color: #4C83AE; + } + +#linkList ul li a.c:visited { + font-weight: 500; + color: #999; + } + +#linkList ul li a.c:hover, +#linkList ul li a.c:active { + font-weight: 500; + color: #9B3F17; + } + +#lselect h3 { + width: 139px; + height: 19px; + background: transparent url(selectdesign.gif) no-repeat; + } + +#larchives h3 { + width: 75px; + height: 16px; + background: transparent url(archives.gif) no-repeat; + } + +#lfavorites h3 { + width: 89px; + height: 19px; + background: transparent url(favorites.gif) no-repeat; + } + +#lresources h3 { + width: 91px; + height: 19px; + background: transparent url(resources.gif) no-repeat; + } + +#pageHeader h1, +#pageHeader h2, +#preamble h3 span, +#supportingText h3 span, +#linkList h3 span { + display: none; + }/* css Zen Garden submission 024 - 'Not So Minimal' by Daniel Rubin, http://www.superfluousbanter.org// */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Daniel Rubin */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+ +
/* global
----------------------------------------------- */
body {
background: #fff url(bg.gif) no-repeat fixed top left;
font-family: verdana, helvetica, arial, sans-serif;
margin: 0 20px 0 20px;
color: #333;
}
/* layout
----------------------------------------------- */
#container {
position: relative;
background: url(header.jpg) no-repeat top left;
margin: 0 auto -1px auto;
padding-top: 144px;
width: 710px;
border-bottom: 5px solid #09345f;
}
#pageHeader {
display: none;
}
#quickSummary {
width: 100%;
text-align: right;
}
#quickSummary p.p1 {
display: none;
}
#quickSummary p.p2 {
margin-top: 0;
padding-right: 5px;
}
#preamble {
margin: 22px 0 0 176px;
width: 529px;
}
#explanation, #participation, #benefits, #requirements {
margin: 25px 0 0 176px;
width: 529px;
}
#footer {
margin: 0 0 5px 0;
padding: 10px 0 0 0;
width: 100%;
text-align: center;
}
#linkList {
position: absolute;
width: 150px;
top: 166px;
left: 5px;
}
/* text
----------------------------------------------- */
p {
font-size: 12px;
}
#preamble p.p1, #supportingText p.p1 {
margin-top: 10px;
}
#preamble p, #supportingText p {
line-height: 18px;
}
#quickSummary p.p2 {
font-size: 9px;
color: #999;
}
#footer {
font-size: 9px;
}
/* lists
----------------------------------------------- */
#linkList ul {
font-size: 10px;
list-style:none;
margin: 5px 0 0 0;
padding: 0 0 0 0;
}
#linkList ul li {
background: url(bullet_single.gif) no-repeat 7px 4px;
margin: 0;
padding: 0 0 0 17px;
line-height: 14px;
color: #ccc;
}
#linkList #lselect li {
background: url(bullet_double.gif) no-repeat 5px 2px;
font-size: 9px;
}
#linkList #lselect a:link, #linkList #lselect a:visited { display: block; }
#linkList #lselect a.c:link, #linkList #lselect a.c:visited { display:inline; }
#larchives li, #lresources li { text-transform: lowercase; }
/* links
----------------------------------------------- */
a, a:link, a:visited {
color: #999;
}
a:hover {
color: #333;
}
#quickSummary a, #quickSummary a:link, #quickSummary a:visited {
font-weight: bold;
text-transform: uppercase;
text-decoration: none;
}
#quickSummary a:hover {
text-decoration: underline;
}
#linkList a, #linkList a:link, #linkList a:visited {
color: #666;
text-decoration: none;
}
#linkList a:hover {
text-decoration: underline;
color: #333;
}
#linkList a.c, #linkList a.c:link, #linkList a.c:visited {
color: #999;
text-decoration: none;
}
#linkList a.c:hover {
text-decoration: underline;
color: #333;
}
#linkList #lselect a {
font-size: 10px;
}
#linkList #lselect a.c {
font-size: 9px;
text-transform: lowercase;
}
#footer a, #footer a:link, #footer a:visited {
font-weight: bold;
text-transform: uppercase;
text-decoration: none;
}
#footer a:hover {
text-decoration: underline;
}
/* headings
----------------------------------------------- */
h3 { margin-bottom: 0px; }
h3 span { display: none; }
#supportingText h3 {
width: 529px;
height: 15px;
}
#linkList h3 {
width: 150px;
height: 20px;
margin-top: 20px;
}
#preamble h3 {
background: transparent url(h3_theroadtoenlightenment.gif) no-repeat top left;
width: 529px;
height: 26px;
}
#explanation h3 {
background: transparent url(h3_sowhatisthisabout.gif) no-repeat top left;
}
#participation h3 {
background: transparent url(h3_participation.gif) no-repeat top left;
}
#benefits h3 {
background: transparent url(h3_benefits.gif) no-repeat top left;
}
#requirements h3 {
background: transparent url(h3_requirements.gif) no-repeat top left;
}
#lselect h3 {
background: transparent url(h3_selectadesign.gif) no-repeat top left;
margin-top: 10px;
}
#lfavorites h3 {
background: transparent url(h3_favorites.gif) no-repeat top left;
}
#larchives h3 {
background: transparent url(h3_archives.gif) no-repeat top left;
}
#lresources h3 {
background: transparent url(h3_resources.gif) no-repeat top left;
}
/* misc
--------------------------------- */
acronym { border-width: 0; }/* css Zen Garden submission 025 - 'mnemonic', by Dave Shea, http://www.mezzoblue.com/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, Dave Shea */
+/* Added: July, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the
+ designer's written permission. However, feel free to study the CSS and use
+ techniques you learn from it elsewhere. */
+
+
+/* Built in Nick Bradbury's wonderful TopStyle Pro - http://www.bradsoft.com/topstyle/ */
+/* See http://www.csszengarden.com/025/025-comments.css for the fully commented version of this file. */
+/* See the last section, MOS Enhancements, on why some things look different between IE and the rest */
+
+
+/* Basic HTML Elements */
+html {
+ margin: 0px;
+ padding: 0px;
+}
+body {
+ font-size: small;
+ font-family: arial, sans-serif;
+ background: #B0A40B url(bg-1.gif) top left repeat-x;
+ margin: 0px;
+ padding: 0px;
+}
+
+acronym {
+ border-bottom: none;
+}
+ul {
+ list-style-type: none;
+ margin: 0px;
+ padding: 0px;
+}
+
+a:link {
+ color: #DF0245;
+ font-weight: bold;
+ text-decoration: none;
+}
+a:visited {
+ color: #6F4600;
+ font-weight: normal;
+ text-decoration: underline;
+}
+a:hover, a:active {
+ text-decoration: underline;
+}
+
+
+
+/*Structural Elements */
+#container {
+ background: transparent url(bg-2.gif) top right repeat-y;
+}
+#intro {
+ padding: 0px;
+ margin: 0px;
+}
+
+#pageHeader {
+ height: 171px;
+ padding: 0px;
+ background: transparent url(bg-4.gif) top left repeat-x;
+}
+
+#pageHeader h1 {
+ padding: 0px;
+ margin: 0px;
+ float: left;
+ width: 396px;
+ height: 171px;
+ background: transparent url(cr-tl.jpg) top right no-repeat;
+}
+#pageHeader h1 span {
+ display: none;
+}
+#pageHeader h2 {
+ padding: 0px;
+ margin: 0px;
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ width: 350px;
+ height: 171px;
+ background: transparent url(cr-tr.gif) top right no-repeat;
+}
+#pageHeader h2 span {
+ display: none;
+}
+
+#quickSummary p.p1 {
+ width: 310px;
+ height: 67px;
+ background: transparent url(cr-r1.png) top right no-repeat;
+ position: absolute;
+ top: 171px;
+ right: 0px;
+ margin: 0px;
+}
+#quickSummary p.p1 span {
+ display: none;
+}
+#quickSummary p.p2 {
+ position: absolute;
+ top: 154px;
+ left: 25px;
+ margin: 0px;
+ font-size: 10px;
+ color: #CDC667;
+ padding-left: 8px;
+ background: transparent url(glitch.gif) center left no-repeat;
+}
+#quickSummary p.p2 a {
+ color: #D9D48C;
+ font-weight: bold;
+ text-decoration: none;
+}
+#quickSummary p.p2 a:hover {
+ color: #fff;
+ text-decoration: underline;
+}
+
+#preamble {
+ display: none;
+}
+
+#supportingText {
+ font: 85%/140% arial, sans-serif;
+ color: #302D0A;
+ background-color: #fff;
+ border: solid 1px #997E00;
+ /*height: 350px;
+ overflow: auto;*/
+ margin-left: 21px;
+ margin-right: 310px;
+ padding: 10px 20px;
+}
+
+#explanation h3 {
+ height: 10px;
+ background: transparent url(h_sowhat.gif) top left no-repeat;
+}
+#participation h3 {
+ height: 10px;
+ background: transparent url(h_participation.gif) top left no-repeat;
+}
+#benefits h3 {
+ height: 10px;
+ background: transparent url(h_benefits.gif) top left no-repeat;
+}
+#requirements h3 {
+ height: 10px;
+ background: transparent url(h_requirements.gif) top left no-repeat;
+}
+#explanation h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span {
+ display: none;
+}
+
+#footer {
+ z-index: 1;
+ position: absolute;
+ top: 64px;
+ left: 150px;
+ text-align: center;
+ width: 257px;
+ background: transparent url(bg-6.png) top left no-repeat;
+ height: 45px;
+ padding-top: 13px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height: 32px;
+}
+#footer a:link, #footer a:visited {
+ font-size: 10px;
+ font-weight: normal;
+ color: #fff;
+ text-decoration: none;
+ padding: 4px 12px 4px 13px;
+}
+#footer a:hover {
+ background: transparent url(bg-6a.png) center center no-repeat;
+}
+/*#footer a {
+ color: #fff;
+ text-decoration: none;
+ text-align: center;
+ display: block;
+ float: left;
+ width: 46px;
+ height: 45px;
+ margin: 0px;
+ margin-right: 10px;
+ background: transparent url(bg-5.png) top left no-repeat;
+}
+#footer a:hover {
+ background: transparent url(bg-5a.png) top left no-repeat;
+}*/
+
+
+/* left hand fooling around */
+#lselect {
+ position: absolute;
+ top: 238px;
+ right: 0px;
+ background: transparent url(cr-r2a.png) top right no-repeat;
+ width: 310px;
+ height: 213px;
+ padding: 10px 60px 10px 55px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 195px;
+ height: 193px;
+ }
+#lselect h3 {
+ height: 15px;
+ background: transparent url(h_select.gif) top left no-repeat;
+ margin: 0px 10px 8px 0px;
+ position: relative;
+ left: -20px;
+}
+#lselect h3 span {
+ display: none;
+}
+#lselect li {
+ font: normal 10px arial, sans-serif;
+ line-height: 170%;
+ text-decoration: none;
+ color: #6D6100;
+ letter-spacing: -1px;
+}
+#lselect a {
+ font: bold 10px arial, sans-serif;
+ text-decoration: none;
+ text-transform: uppercase;
+ color: #fff;
+ letter-spacing: normal;
+}
+#lselect a.c {
+ font-weight: normal;
+ color: #6D6100;
+ text-transform: lowercase;
+ letter-spacing: -1px;
+}
+#lselect a:hover {
+ text-decoration: underline;
+}
+
+#larchives {
+ position: absolute;
+ line-height: 80%;
+ text-align: center;
+ top: 451px;
+ right: 0px;
+ background: transparent url(cr-r3a.png) top right no-repeat;
+ width: 310px;
+ height: 50px;
+ padding: 15px 65px 6px 45px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 200px;
+ height: 29px;
+}
+#larchives h3 {
+ display: none;
+}
+#larchives li {
+ font: normal 10px arial, sans-serif;
+ display: inline;
+ padding-right: 6px;
+}
+#larchives li a {
+ color: #443901;
+ text-decoration: none;
+}
+#larchives li a:hover {
+ color: #fff;
+ text-decoration: underline;
+}
+
+#lresources {
+ height: 74px;
+ background: transparent url(bg-7.png) top right repeat-x;
+}
+#lresources h3 {
+ width: 310px;
+ height: 74px;
+ float: right;
+ background: transparent url(cr-br.png) top right no-repeat;
+ margin: 0px;
+}
+#lresources h3 span {
+ display: none;
+}
+#lresources ul {
+ padding: 37px 0px 0px 25px;
+}
+#lresources li {
+ display: inline;
+}
+#lresources li a {
+ color: #fff;
+ font-size: 9px;
+ font-weight: bold;
+ text-decoration: none;
+ text-transform: lowercase;
+ padding-right: 5px;
+}
+
+#lresources li a:hover {
+ text-decoration: underline;
+}
+
+/* Extra elements */
+#extraDiv1 {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ width: 750px;
+ height: 118px;
+ background: transparent url(mnemonic.gif) top left no-repeat;
+}
+#extraDiv2 {
+ width: 90px;
+ height: 18px;
+ position: absolute;
+ top: 112px;
+ left: 156px;
+ background: transparent url(ani1.gif) top left no-repeat;
+}
+#extraDiv3 span {
+ width: 61px;
+ height: 51px;
+ position: absolute;
+ top: 13px;
+ left: 315px;
+ background: transparent url(ani2.gif) top left no-repeat;
+}
+#extraDiv4 {
+ width: 256px;
+ height: 6px;
+ position: absolute;
+ top: 45px;
+ left: 98px;
+ background: transparent url(ani3.gif) top left no-repeat;
+}
+#extraDiv5 {
+ width: 100%;
+ position: relative;
+ top: -21px;
+}
+#extraDiv5 span {
+ float: right;
+ width: 209px;
+ height: 2px;
+ background: transparent url(ani4.gif) top left no-repeat;
+ margin-right: 40px;
+}
+
+
+
+
+
+/*
+
+
+
+ **** Beginning of Advanced Effects ****
+
+
+
+*/
+
+
+
+#lselect ul>li {
+ width: 100px;
+ line-height: 10px;
+}
+#lselect ul>li a {display: block;}
+#lselect ul>li a.c {display: inline;}
+
+#lselect ul>li {position: relative; left: -14px;}
+#lselect ul>li+li {position: relative; left: -12px;}
+#lselect ul>li+li+li {position: relative; left: -10px;}
+#lselect ul>li+li+li+li {position: relative; left: -8px;}
+
+#lselect ul>li+li+li+li+li {position: relative; left: 98px; top: -11em;}
+#lselect ul>li+li+li+li+li+li {position: relative; left: 100px; top: -11em;}
+#lselect ul>li+li+li+li+li+li+li {position: relative; left: 102px; top: -11em;}
+#lselect ul>li+li+li+li+li+li+li+li {position: relative; left: 104px; top: -11em;}
+
+
+#larchives ul>li a[accesskey="p"] {
+ display: block;
+ width: 37px;
+ height: 0;
+ overflow: hidden;
+ padding-top: 18px;
+ background: transparent url(archive-b1a.gif) top left no-repeat;
+ position: absolute;
+ top: 16px;
+ left: 70px;
+ color: #958500;
+}
+#larchives ul>li a[accesskey="p"]:hover {
+ background: transparent url(archive-b1b.gif) top left no-repeat;
+}
+
+#larchives ul>li a[accesskey="n"] {
+ display: block;
+ width: 31px;
+ height: 0;
+ overflow: hidden;
+ padding-top: 18px;
+ background: transparent url(archive-b2a.gif) top left no-repeat;
+ position: absolute;
+ top: 16px;
+ left: 108px;
+ color: #958500;
+}
+#larchives ul>li a[accesskey="n"]:hover {
+ background: transparent url(archive-b2b.gif) top left no-repeat;
+}
+
+
+
+#larchives ul>li+li a[accesskey="w"] {
+ display: block;
+ width: 35px;
+ height: 0;
+ overflow: hidden;
+ padding-top: 18px;
+ background: transparent url(archive-b3a.gif) top left no-repeat;
+ position: absolute;
+ top: 16px;
+ left: 170px;
+ color: #958500;
+}
+#larchives ul>li+li a[accesskey="w"]:hover {
+ background: transparent url(archive-b3b.gif) top left no-repeat;
+}
+
+
+
+#supportingText>div#footer {
+ background: none;
+}
+
+div#footer>a:link, div#footer>a:visited {
+ display: block;
+ width: 46px;
+ height: 45px;
+ padding: 13px 0px 0px 0px;
+ background: transparent url(bg-5.png) top left no-repeat;
+ position: absolute;
+ top: 0px;
+ left: 0px;
+}
+div#footer>a:hover {
+ background: transparent url(bg-5a.png) top left no-repeat;
+}
+
+div#footer>a+a:link, div#footer>a+a:visited {left: 53px;}
+div#footer>a+a+a:link, div#footer>a+a+a:visited {left: 106px;}
+div#footer>a+a+a+a:link, div#footer>a+a+a+a:visited {left: 159px;}
+div#footer>a+a+a+a+a:link, div#footer>a+a+a+a+a:visited {left: 212px;}
+
+#extraDiv3 {
+ background: transparent url(bg-5a.png) top left no-repeat;
+}/* css Zen Garden submission 026 - 'Zunflower' by Radu Darvas - http://www.homelesspixel.de/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Radu Darvas */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+ font: 12px/16px arial, helvetica, verdana, sans-serif;
+ color: #555;
+ background: url(bg_left.gif) repeat-y #fff;
+ margin: 0;
+ padding: 0;
+}
+
+a {
+ text-decoration: none;
+ font-weight: bold;
+ color: #655;
+}
+a:hover {
+ text-decoration: none;
+ font-weight: bold;
+ color: #e60;
+}
+acronym {
+ border: 0 none;
+}
+
+#container {
+ margin: 0;
+ padding: 0;
+}
+
+#quickSummary p, #preamble p {
+ margin: 0;
+ padding: 8px 30px 4px 18px;
+}
+#quickSummary .p1 {
+ font-weight: bold;
+ color: #777;
+}
+
+#intro {
+ margin: 0;
+ padding: 0;
+ width: 303px;
+}
+h1 {
+ margin: 0;
+ padding: 0;
+ width: 303px;
+ height: 198px;
+ background: url(h1.jpg) no-repeat transparent;
+}
+h1 span {
+ display: none;
+}
+h2 {
+ margin: 0 0 9px 0;
+ padding: 0;
+ width: 303px;
+ height: 37px;
+ background: url(h2.gif) no-repeat transparent;
+}
+h2 span {
+ display: none;
+}
+
+#preamble h3 {
+ margin: 5px 0 0;
+ padding: 0;
+ width: 303px;
+ height: 36px;
+ background: url(the_road.jpg) no-repeat transparent;
+}
+#preamble h3 span {
+ display: none;
+}
+
+#supportingText {
+ position: absolute;
+ top: 70px;
+ left: 303px;
+ width: 320px;
+ margin: 0;
+ padding: 0;
+ background: url(support_bg.gif) repeat-y top right transparent;
+}
+#supportingText h3, #supportingText p {
+ margin: 0;
+ padding: 0 40px 10px 0px;
+}
+#supportingText h3 span {
+ display: none;
+}
+
+#participation h3 {
+ margin: 0 40px 5px 0px;
+ padding: 0;
+ height: 34px;
+ background: url(parti.gif) no-repeat transparent;
+ border-bottom: 1px solid #ccc;
+}
+#benefits h3 {
+ margin: 0 40px 5px 0px;
+ padding: 0;
+ height: 34px;
+ background: url(bene.gif) no-repeat transparent;
+ border-bottom: 1px solid #ccc;
+}
+#requirements h3 {
+ margin: 0 40px 5px 0px;
+ padding: 0;
+ height: 34px;
+ background: url(req.gif) no-repeat transparent;
+ border-bottom: 1px solid #ccc;
+}
+#requirements p.p5 {
+ border-top: 1px solid #ccc;
+ margin: 10px 40px 5px 0;
+ padding: 10px 0 0;
+}
+#preamble h3 span {
+ display: none;
+}
+
+
+#explanation {
+ background: url(so_what_bg.gif) no-repeat top right transparent;
+}
+#explanation h3 {
+ margin: 0 15px 20px 0;
+ padding: 0;
+ height: 36px;
+ background: url(so_what.jpg) no-repeat transparent;
+}
+#explanation h3 span {
+ display: none;
+}
+
+
+#linkList {
+ position: absolute;
+ top: 130px;
+ left: 608px;
+ margin: 0;
+ padding: 0;
+ width: 200px;
+}
+#linkList h3.select {
+ margin: 0;
+ padding: 0;
+ background: url(select.jpg) no-repeat transparent;
+ height: 26px;
+}
+#linkList h3.archives {
+ margin: 0;
+ padding: 0;
+ background: url(archives.jpg) no-repeat transparent;
+ height: 26px;
+}
+#linkList h3.resources {
+ margin: 0;
+ padding: 0;
+ background: url(resources.jpg) no-repeat transparent;
+ height: 26px;
+}
+#linkList h3 span {
+ display: none;
+}
+
+
+
+#linkList #lselect a {
+ text-decoration: underline;
+ color: #766;
+ display: block;
+}
+#linkList #lselect a:visited {
+ text-decoration: underline;
+ color: #aaa;
+}
+#linkList #lselect a:hover {
+ text-decoration: underline;
+ color: #e60;
+}
+#linkList #lselect a.c {
+ display: inline;
+ text-decoration: none;
+ color: #888;
+}
+#linkList #lselect a.c:visited {
+ text-decoration: none;
+ color: #999;
+}
+#linkList #lselect a.c:hover {
+ text-decoration: none;
+ color: #e60;
+}
+
+
+
+#footer {
+ position: relative;
+ margin: 25px 15px 0 -14px;
+ padding: 3px 0 0 20px;
+ background: url(foot.jpg) no-repeat;
+ height: 23px;
+}
+#footer a {
+ color: #fff;
+ vertical-align: middle;
+}
+
+ul {
+ margin: 7px 0 7px 20px;
+ padding: 0;
+}
+li {
+ margin: 0 0 5px;
+ padding: 0;
+ list-style-type: none;
+}
+/* css Zen Garden submission 027 - 'Gothica' by Patrick H. Lauke aka redux - http://redux.deviantart.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Patrick H. Lauke */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+/* Based on the "Gothica" CSS design example for the SitePoint CSS design contest */
+ +/* decorative icons/patterns adapted from http://www.squidfingers.com/ */ + +
+
+/* basic stuff */
+ + +body { + font: 0.65em/1.3em Verdana, Arial, Helvetica, sans-serif ; + font-style: normal; + font-weight: normal; + font-variant: normal; + background: #eee url(background.png) fixed; + color: #000; + text-align: center; + padding: 0; + margin: 0; + height: 100%; +} + +h3 { + width: 100%; /* needed for IE5+ */ + font-family: Times, serif; + font-size: 100%; + text-transform: uppercase; + letter-spacing: 0.3em; + word-spacing: 0.3em; + border-bottom: #888 1px solid; +} + +html > body h3 { + /* redefinition of the border to dotted, + hidden from IE - because the dashed line + that IE uses instead of dots looks a bit + too crude in my opinion */ + border-bottom: #000 1px dotted; +} + +acronym { + /* in this case, I can live with IE's dashed line */ + border-bottom: #000 1px dotted; +} + +a, a:link { color: #900; background: transparent; text-decoration: none; } +a:visited { color: #933; background: transparent } +a:hover { color: #966; background: transparent } +a:active { color: #988; background: transparent } + +/* let's start with the whole page container */ + +#container { + position: relative; + margin: 10px auto; + width: 750px; + padding: 5px; + text-align: left; + background: #f5f5f5 url(pattern.png) no-repeat center; + border: #000 1px solid; + color: inherit; +} + +/* and now the specific divs */ + +#pageHeader { + padding: 5px; + height: 160px; + margin: 5px; + border: #000 solid 1px; + text-align: left; + background: #fff url(tophead.png) no-repeat top left; + color: inherit; +} + +#pageHeader h1, #pageHeader h2 { + display: none; +} + + +#quickSummary { + border: 1px #000 dotted; + background: #fff; + color: inherit; + font-size: 0.85em; +} + +#quickSummary, #preamble, #supportingText { + text-align: left; + margin: 1em 170px 1em 25px; + padding: 5px; +} + +#quickSummary a, #preamble a, #supportingText a { + text-decoration: none; + font-weight: bold; +} + +#explanation { + /* a little inelegant, but gets the job done */ + margin-top: -3em; +} + +#linkList { + position: absolute; + top: 180px; + right: 0; + padding: 25px 5px 5px 5px; + margin: 0; + width: 150px; + background: url(spikes.png) no-repeat center top; +} + +#lselect ul, #lresources ul, #larchives ul { + margin: 0 0 0.5em 0; + padding: 0; +} + +#lselect ul li, #lresources ul li, #larchives ul li{ + list-style-type: none; + border: #000 1px solid; + padding: 2px; + margin: 2px; + text-align: left; + background: #fff; + color: inherit; +} + +/* there seems to be an issue in Opera with the hover on the lselect... +any clues to a solution would be appreciated ;) */ + +#lselect ul li:hover, #lresources ul li:hover, #larchives ul li:hover { + background: #900; + color: #fff; +} + +#lselect ul li:hover a, #lresources ul li:hover a, #larchives ul li:hover a { + background: inherit; + color: #eee; +} + +#lselect ul a:hover, #lresources ul a:hover, #larchives ul a:hover { + /* this style is there to make up for IE's inability to apply + :hover pseudo to an li. of course, it won't look the same as having the whole + li turn red, but it should be an acceptable compromise */ + background: #900; + color: #eee; +} + +#lresources, #larchives { + padding: 25px 5px 5px 5px; + background: url(spikes.png) no-repeat center top; +} + + + +#footer { + margin: 0; + padding: 5px; + /* again, I can live with IE's dashed line */ + border: 1px #000 dotted; + background: #fff; + color: inherit; + text-align: center; +} + +#footer a { + margin-right: 20px; + padding-left: 18px; + background: url(bullet.png) no-repeat left center; +} + + + +/* and now for the big caps for each paragraph in supportingText +this is again hidden from IE, as it tends to crash otherwise and +I really can't be bothered to work around its flaws...consider it +icing on the cake for non-IE users */ + +body > div#supportingText p:first-letter { + font: 2em Times, Helvetica, serif; + float: left; + text-transform: uppercase; + margin: 0 3px 3px 0; + padding: 0; +} + +/* the following two rules may be just a minor detail, but i think it's worth it. +they add a little download icon in front of the sample CSS and HTML download links. +the first one works in all 5+ browsers, whereas the second one is only for CSS2 compliant +ones. also, use of the |= selector may be "unorthodox", but it was the best I could come up +with since the two download links in the "participation" div are not especially marked up +with a class, AND there are other links in that div ("CSS Resource Guide", "Send us a link" and "contact me") that +do not need the little icon...hence the rule could not be applied to "#participation a" */ + +#quickSummary a { + padding-left: 15px; + background: url(download.png) no-repeat left center; +} + +#participation a[href|=zengarden] { + /* CSS2-compliant only */ + padding-left: 15px; + background: url(download.png) no-repeat left center; +} + +/* no need for extras...they're just not displayed */ + +#extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 { + display: none; +}/* css Zen Garden submission 028 - 'Atlantis' by Kevin Davis, http://alazanto.org/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Kevin Davis */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+/* for more work by the author, see http://alazanto.org */
+/* have a great day! :) */
+
+/******************************************************************* primary elements */
+
+body {
+ background-color: #000;
+ color: #ccc;
+ margin: 0px;
+ padding: 0px;
+ text-align: center;
+}
+
+p {
+ font: 11pt/16pt georgia,palatino,times,serif;
+ text-align: left;
+}
+
+/******************************************************************* primary hyperlink styling */
+
+a:link {
+ font-weight: normal;
+ text-decoration: none;
+ background-color: transparent;
+ color: #bcf;
+}
+
+a:visited {
+ font-weight: normal;
+ text-decoration: none;
+ background-color: transparent;
+ color: #bde;
+}
+
+a:hover, a:active {
+ text-decoration: underline;
+ background-color: transparent;
+ color: #fff;
+}
+
+/******************************************************************* body content */
+#container {
+ position: relative;
+
+ margin-top: 0px;
+ margin-left: auto;
+ margin-bottom: 0px;
+ margin-right: auto;
+ padding: 1px; /* messy method of overcoming a rendering bug in mozilla 1.4, maybe others */
+
+ font: 8pt/12pt georgia,palatino,times,serif;
+ color: #ddd;
+ background: #000 url(backdrop.title.jpg) no-repeat top left;
+
+ width: 749px;
+
+ voice-family: "\"}\"";
+ voice-family:inherit;
+
+ width: 750px;
+
+
+}
+
+#pageHeader {
+ display: none;
+}
+ #pageHeader h1 {
+ display: none;
+ }
+ #pageHeader h1 span {
+ display: none;
+ }
+ #pageHeader h2 {
+ display: none;
+ }
+ #pageHeader h2 span {
+ display: none;
+ }
+
+#intro {
+ position: relative;
+
+ margin-top: 225px;
+ margin-left: 218px;
+ margin-bottom: 10px;
+ margin-right: 39px;
+
+ padding-top: 10px;
+ padding-left: 10px;
+ padding-bottom: 0px;
+ padding-right: 10px;
+
+ border: 1px dashed #fff;
+}
+
+ #quickSummary {
+ float: left;
+ clear:both;
+
+ margin-top: 0px;
+ margin-left: 0px;
+ margin-bottom: 0px;
+ margin-right: 7px;
+
+ width: 165px;
+
+ voice-family: "\"}\"";
+ voice-family:inherit;
+
+ width: 175px;
+ }
+
+ #quickSummary p {
+ font: italic 10pt/22pt georgia,palatino,times,serif;
+ text-align:center;
+ margin: 4px;
+ padding: 0px;
+ }
+
+ #preamble {
+ clear: right;
+
+ padding-top: 0px;
+ padding-left: 0px;
+ padding-bottom: 0px;
+ padding-right: 0px;
+ }
+
+ #intro h3 {
+ margin-top: 0px;
+ margin-left: 0px;
+ margin-bottom: 15px;
+ margin-right: 0px;
+
+ padding-top: 1px;
+ padding-left: 0px;
+ padding-bottom: 3px;
+ padding-right: 0px;
+
+ background-color: transparent;
+ font: 14pt georgia,palatino,times,serif;
+ font-weight: normal;
+ text-align: left;
+
+ color: #fff;
+ }
+
+#supportingText {
+ margin-top: 0px;
+ margin-left: 218px;
+ margin-bottom: 10px;
+ margin-right: 39px;
+ padding: 0px;
+}
+
+ #supportingText h3 {
+ margin-top: 15px;
+ margin-left: 0px;
+ margin-bottom: 15px;
+ margin-right: 0px;
+
+ padding-top: 1px;
+ padding-left: 0px;
+ padding-bottom: 3px;
+ padding-right: 0px;
+
+ font: 14pt georgia,palatino,times,serif;
+ font-weight: normal;
+ text-align: left;
+
+ background-color: transparent;
+ color: #fff;
+ border-top: 1px solid #fff;
+ border-bottom: 1px solid #fff;
+ }
+
+#footer {
+ margin-top: 30px;
+ margin-left: 0px;
+ margin-bottom: 30px;
+ margin-right: 0px;
+
+ text-align: center;
+
+ background-color: transparent;
+ color: #fff;
+ border-top: 1px solid #fff;
+ border-bottom: 1px solid #fff;
+
+}
+ #footer a:link, #footer a:visited {
+ background-color: transparent;
+ margin-left: 10px;
+ margin-right: 10px;
+ }
+
+/******************************************************************* link list */
+
+#linkList {
+ position: absolute;
+ margin: 0px;
+ padding: 0px;
+
+ top: 435px;
+ left: 50px;
+ width: 150px;
+
+ text-align: left;
+}
+
+ #linkList h3.select {
+ background: transparent url(linkhead-select.jpg) no-repeat top left;
+ margin: 0px 0px 0px 0px; width: 150px; height: 21px;
+ }
+ #linkList h3.select span {
+ display: none;
+ }
+
+ #linkList h3.favorites {
+ background: transparent url(linkhead-favorites.jpg) no-repeat top left;
+ margin: 10px 0px 0px 0px; width: 150px; height: 21px;
+ }
+ #linkList h3.favorites span {
+ display: none;
+ }
+
+ #linkList h3.archives {
+ background: transparent url(linkhead-archives.jpg) no-repeat top left;
+ margin: 10px 0px 0px 0px; width: 150px; height: 21px;
+ }
+ #linkList h3.archives span {
+ display: none;
+ }
+
+ #linkList h3.resources {
+ background: transparent url(linkhead-resources.jpg) no-repeat top left;
+ margin: 10px 0px 0px 0px; width: 150px; height: 21px;
+ }
+ #linkList h3.resources span {
+ display: none;
+ }
+
+ #linkList ul {
+ margin-top: 0px;
+ margin-bottom: 10px;
+ margin-left: 10px;
+ margin-right: 0px;
+ padding: 0px;
+ }
+ #linkList li {
+ line-height: 2.5ex;
+ list-style-type: none;
+ background: transparent url(cr1.gif) no-repeat top center;
+ display: block;
+ padding-top: 5px;
+ margin-bottom: 5px;
+ }
+
+ #lselect li, #lfavorites li {
+ background: url(docbullet.gif) no-repeat 0px 7px;
+ padding-left: 11px;
+ }
+
+ #lselect a, #lfavorites a { display:block; text-transform:lowercase; }
+ #lselect a.c, #lfavorites a.c {display:inline; text-transform: none; }/* css Zen Garden submission 029 - 'Backyard' by Ray Henry, http://www.reh3.com/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, Ray Henry */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the
+ designer's written permission. However, feel free to study the CSS and use
+ techniques you learn from it elsewhere. */
+
+
+/* basic elements */ +body { + background: #fff url(main_bg.gif) repeat-x top left; + margin: 0; + padding: 0; + text-align:left; + height:100%; + width:100%; +} + +p { + margin-top: 0px; + text-align: left; +} + +a:link { + font-weight: bold; + text-decoration: underline; + color: #616157; +} + +a:visited { + font-weight: bold; + text-decoration: underline; + color: #616157; +} + +a:hover, a:active { + text-decoration: underline; + color: #811610; +} + +/* specific divs */ +#container { + background:transparent; + padding: 0px; + margin: 0px; + width:770px; +} + +#intro { + background: transparent url(quicksum_bg.gif) no-repeat top left; + width:770px; + margin-top:28px; + margin-bottom:0; +} + +#pageHeader { + margin: 0; + padding:0; + width:770px; + height:72px; + voice-family: "\"}\""; + voice-family:inherit; + margin-bottom:22px; +} + +#pageHeader h1 { + background: transparent url(intro_bg.jpg) no-repeat top left; + margin-top: 0; + width: 403px; + height: 72px; + float: left; +} + +#pageHeader h2 { + background: transparent url(intro_bg2.jpg) no-repeat top left; + margin: 0; + width: 367px; + height: 72px; + float: right; +} + +#pageHeader h1 span, #pageHeader h2 span { + display:none +} + +#quickSummary { + background:transparent; + float:left; + clear:both; + padding-top:10px; + padding: 10px; + border-top:1px dashed #999; + width: 200px; + font-family:georgia, serif; + font-size: 12px; + line-height:30px; + color:#616157; + voice-family: "\"}\""; + voice-family:inherit; + margin-top:-1.8em; + width:180px; +} + +#quickSummary p.p1:first-letter { + padding-right:5px; + font-size: 300%; + color:#811610; +} + + #preamble p.p1:first-letter { + padding-right:5px; + font-size: 300%; + color:#811610; +} + +#quickSummary p.p2 { + line-height:18px; + font-family:verdana, arial, sans serif; + font-size:11px; +} + +#preamble { + background:transparent; + clear:both; + padding: 10px; + width: 200px; + font-family:georgia, serif; + font-size: 12px; + line-height:30px; + color:#616157; + z-index:5; + voice-family: "\"}\""; + voice-family:inherit; + width:180px; +} + +#preamble h3{ + line-height:16px; + font-size:15px; + padding-bottom:10px; + padding-top:10px; + border-top:1px solid #811610; + border-bottom:1px solid #811610; +} + +#supportingText { + background:#F7F7F2; + position:absolute; + top:100px; + padding: 10px; + margin-left:200px; + border-top:1px solid #999; + border-left:1px solid #999; + border-bottom:1px solid #999; + border-right:1px solid #999; + width:366px; + height:auto; + font-family:georgia, serif; + font-size:13px; + line-height:19px; + color:#616157; + voice-family: "\"}\""; + voice-family:inherit; + margin-left:200px; + width:344px; + top:100px; +} + +#explanation h3, #participation h3, #benefits h3, #requirements h3 { + margin-bottom:10px; + width:300px; + height:15px; + border-bottom:1px dashed #999; +} + +#explanation h3 { + background: transparent url(sup_h3_a.gif) no-repeat; +} + +#participation h3 { + background: transparent url(sup_h3_b.gif) no-repeat; +} + +#benefits h3 { + background: transparent url(sup_h3_c.gif) no-repeat; +} + +#requirements h3 { + background: transparent url(sup_h3_d.gif) no-repeat; +} + +#supportingText h3 span{ + display:none; +} + +#footer { + text-align: center; + border-top:1px solid #CBCBC2; + font-family:verdana, arial, sans serif; + font-size:10px; +} + +#footer a:link, #footer a:visited { + margin: 5px; + font-weight: normal; +} + +#linkList { + background: url(linklist_bg.gif) no-repeat top left; + margin-left: 566px; + position: absolute; + top: 100px; + height:100%; + voice-family: "\"}\""; + voice-family:inherit; + margin-left:566px; +} + +#linkList2 { + font: 10px verdana, sans-serif; + padding: 10px; + width: 204px; +} + +#linkList h3.select, #linkList h3.archives, #linkList h3.resources{ + width:180px; + height: 20px; +} + +#linkList h3.select { + background: transparent url(linklist_a.gif) no-repeat top left; + margin: 25px 0px 5px 0px; +} + +#linkList h3.archives { + background: transparent url(linklist_b.gif) no-repeat bottom left; + margin: 25px 0px 10px 0px; + border-top:1px dashed #ccc; + padding-top:5px; +} + +#linkList h3.resources { + background: transparent url(linklist_c.gif) no-repeat bottom left; + margin: 25px 0px 10px 0px; + border-top:1px dashed #ccc; + padding-top:5px; +} + +#linkList h3.select span, #linkList h3.archives span, #linkList h3.resources span { + display:none +} + +#linkList ul { + margin: 0px; + padding: 0px; + color:#555; +} + +#linkList li { + list-style-type: none; + background: transparent; + display: block; + padding-top: 5px; + margin-bottom: 5px; +} + +#linkList li a:link { + color: #555; +} + +#linkList li a:visited { + color: #555; +} + +#linkList li a:hover, #linkList li a:active { + color:#811610; +} + +a.c:link, a.c:visited, a.c:hover, a.c:active { + font-weight:normal; +} + +#extraDiv1, #extraDiv2 { + display:none; +}/* css Zen Garden submission 030 - 'Entomology' by Jon Hicks, http://exp.hicksdesign.co.uk/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Jon Hicks */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+
+/* basic elements */
+
+body {
+ background: #B61E3D url(bkgd.jpg);
+ font: 12px/16px Georgia, "Times New Roman", Times, serif;
+ color: #390404;
+ margin: 0px;
+}
+p {
+ margin-top: -0.8em;
+}
+p+p {
+ text-indent: 15px;
+}
+
+h3 {
+ font-size: 13px;
+ text-transform: uppercase;
+ letter-spacing: 0.3em;
+ margin-top: 2em;
+}
+
+a:link,
+a:visited {
+ font-style: italic;
+ text-decoration: none;
+ color: #039;
+}
+a:visited {
+ font-style: normal;
+}
+a:hover, a:active {
+ background: #ffe699;
+}
+
+
+/* main text divs */
+#container {
+ background: #ffc url(mid.jpg) repeat-y center;
+ position: absolute;
+ left: 50%;
+ width: 760px;
+ margin-left: -380px;
+}
+#intro {
+ margin: 0px;
+ background: url(top.jpg) no-repeat center top;
+ padding-top: 186px;
+}
+#pageHeader h1 span,
+#pageHeader h2 span {
+ display:none
+}
+#quickSummary p.p1:first-line {
+ text-transform: uppercase;
+}
+#quickSummary {
+ margin-top: 30px;
+}
+#quickSummary p {
+ font-size: 13px;
+ line-height: 22px;
+}
+#quickSummary,
+#preamble,
+#supportingText {
+ margin-right: 80px;
+ margin-left: 300px;
+}
+#supportingText p.p5{
+ background: url(line.jpg) no-repeat center bottom;
+ margin-right: -80px;
+ margin-left: -300px;
+ margin-top: 30px;
+ height: 30px;
+ text-align: center;
+}
+#footer {
+ background: url(bot.jpg) no-repeat center bottom;
+ margin-right: -80px;
+ margin-left: -300px;
+ height: 110px;
+ text-align: center;
+}
+#footer a:link, #footer a:visited {
+ font-size: 15px;
+ color: #390404;
+}
+
+
+/* sidelinks styles */
+#linkList {
+ background: url(b5.jpg) no-repeat center bottom;
+ padding-bottom: 150px;
+ width: 195px;
+ position: absolute;
+ left: 90px;
+ top: 200px;
+ border-right: 1px dotted #930;
+}
+#linkList h3 {
+ text-align: center;
+ font-style: italic;
+ text-transform: lowercase;
+ letter-spacing: 0.1em;
+}
+#linkList h3.select {
+ background: url(b1.jpg) no-repeat center top;
+ padding-top: 110px;
+ font-style: italic;
+ text-transform: lowercase;
+ margin-top: 0px;
+}
+linkList h3.favorites {
+ margin-top: 30px;
+ background: url(b2.jpg) no-repeat center top;
+ padding-top: 110px;
+}
+#linkList h3.archives {
+ margin-top: 30px;
+ background: url(b3.jpg) no-repeat center top;
+ padding-top: 110px;
+}
+#linkList h3.resources {
+ margin-top: 30px;
+ background: url(b4.jpg) no-repeat center top;
+ padding-top: 105px;
+}
+#linkList ul {
+ margin: -0.5em 0 0 0;
+ padding: 0px;
+ list-style-type: none;
+ text-align: center;
+}
+#linkList li {
+ background: url(listline.gif) no-repeat center bottom;
+ padding-bottom: 15px;
+}
+#linkList #lselect a {
+ display: block;
+ font-style: normal;
+ text-transform: uppercase;
+ letter-spacing: 0.1em;
+}
+#linkList #lselect a.c{
+ display: inline;
+ margin-bottom: -1em;
+ font-style: italic;
+ text-transform: none;
+ letter-spacing: 0em;
+}
+#linkList #lselect li{
+ font-style: italic;
+}
+
+
+/* CSS 2 pseudo elements - not essential but nice in browsers that support it */
+
+h3:first-letter {
+ font-size: 16px;
+}
+#linkList h3 :before {
+content: "(";
+}
+#linkList h3 :after {
+content: ")";
+}
+#footer a:before {
+content: "{ ";
+}
+#footer a:after {
+content: " }";
+}
+/* css Zen Garden submission 031 - 'Hedges' by Kev Mears, http://www.mearso.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Kev Mears */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+
+/* structure
+--------------------------------- */
+
+body
+{
+ margin: 0;
+ padding: 0;
+ background: #FFF url("bg_tree.gif") repeat-x left top;
+ color: #888;
+ text-align: center;
+}
+
+
+
+#container
+{
+ position: relative;
+ padding:0;
+ width: 732px;
+ margin: 0 auto;
+ text-align: left;
+}
+
+
+/* hidden text
+--------------------------------- */
+
+h1, h2, h3
+{
+ margin: 0;
+ background-repeat: no-repeat;
+ background-position: left top;
+}
+
+h1 span, h2 span,h3 span, #quickSummary p.p span { display: none; }
+
+/* header and summary
+--------------------------------- */
+
+#pageHeader h1
+{
+ height: 200px;
+ background: url("nutitle.gif") no-repeat;
+ padding:0;
+}
+
+#quickSummary p.p1
+{
+ position: absolute;
+ top: 12em;
+ right: 15px;
+ width: 120px;
+ margin: 75px 0 0 580px;
+ font-size: 80%;
+ text-align: right;
+}
+
+#quickSummary p.p2
+{
+ position: absolute;
+ top: 25em;
+ right: 15px;
+ width: 120px;
+ margin: 0;
+ font-size: 93%;
+ text-align: center;
+ padding-bottom: 90px;
+ background: url("barrow.gif") no-repeat bottom;
+ background-repeat: no-repeat;
+}
+
+#quickSummary p.p2 a:link, #quickSummary p.p2 a:visited
+{
+ white-space: nowrap;
+ font: bold 92%/1.3em Verdana,Arial,Sans-serif;
+ text-transform: uppercase;
+}
+
+/* preamble
+--------------------------------- */
+
+#preamble
+{
+ position: relative;
+ left: 195px;
+ padding-bottom: 0px;
+ width: 400px;
+
+}
+
+#preamble h3
+{
+ height: 70px;
+ background-image: url("road.gif");
+}
+
+#preamble p
+{
+ width: 350px;
+}
+
+/* supporting text
+--------------------------------- */
+
+#supportingText
+{
+ position: relative;
+ left: 195px;
+ padding-bottom: 0px;
+ border-bottom: 2px solid #363;
+ width: 400px;
+}
+
+#supportingText p
+{
+ line-height: 1.5em;
+}
+
+#supportingText h3 { height: 70px; }
+
+#explanation h3
+{
+ background-image: url("what.gif");
+}
+
+#participation h3
+{
+ background-image: url("participation.gif");
+}
+
+#benefits h3
+{
+ background-image: url("benefits.gif");
+}
+
+#requirements h3
+{
+ background-image: url("requirements.gif");
+}
+
+/* link list
+--------------------------------- */
+
+#linkList
+{
+ position: absolute;
+ top: 200px;
+ left: 0;
+ width: 190px;
+}
+
+#linkList h3 { height: 41px; }
+
+#lselect h3
+{
+ background-image: url("select.gif");
+}
+
+#larchives h3
+{
+ background-image: url("archives.gif");
+}
+
+#lresources h3
+{
+ background-image: url("resources.gif");
+}
+
+#linkList ul
+{
+ margin: 1em 0 1em;
+ padding: 0;
+ font-size: 90%;
+ list-style: none;
+ text-align: left;
+}
+
+#larchives li, #lresources li { text-transform: lowercase; }
+
+#linkList ul li
+{
+ margin: 0 0 .5em;
+
+ line-height: 1em;
+}
+
+#linkList li a:link, #linkList li a:visited
+{
+ font-family: Verdana,Arial,Sans-serif;
+ font-size: 90%;
+}
+
+#linkList #lselect a:link, #linkList #lselect a:visited { display: block; }
+
+#linkList #lselect a.c:link, #linkList #lselect a.c:visited
+{
+ display: inline;
+ font-family: Georgia,Serif;
+ font-weight: normal;
+ background-color: transparent;
+ text-transform: lowercase;
+}
+
+/* footer
+--------------------------------- */
+
+#footer
+{
+ background: #D9D98B;
+ color: #fff;
+ padding: 10px 20px;
+ border-top: 1px solid #363;
+ font: 85% Verdana,Arial,Sans-serif;
+ text-align: center;
+}
+
+#footer a:link, #footer a:visited
+{
+ padding: 0 5px;
+ font-weight: normal;
+}
+
+/* links
+--------------------------------- */
+
+a:link, a:visited
+{
+ color: #090;
+ background-color: transparent;
+ font-weight: bold;
+ text-decoration: none;
+}
+
+a:hover
+{
+ color: #663;
+ background-color: transparent;
+ text-decoration: underline;
+}
+
+/* misc
+--------------------------------- */
+
+acronym { border-width: 0; }
+/* css Zen Garden submission 032 - 'Crab Apple' by Jai Brinkofski - http://www.jaiandbecky.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Jai Brinkofski */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+/* hide this stuff */
+
+#pageHeader h1 span, #pageHeader h2 span, #pageHeader, #quickSummary p.p1, #preamble h3 span, #explanation h3, #participation h3, #benefits h3, #requirements h3, #lselect h3, #larchives h3, #lresources h3 {display: none}
+
+/* show this stuff */
+
+body {background-color: #D0D1D0; background-image: url(banner.jpg); background-repeat: no-repeat; left: 0px; top: 0px; width: 770px}
+
+acronym {border-bottom-width: 1px; border-bottom-style: dashed; cursor: help}
+
+#container {background-image: url(t.jpg); background-repeat: no-repeat; left: 0px; top: 0px; background-position: 0px 99px; position: absolute; width: 770px; padding-bottom: 5px}
+
+#intro {position: relative; left: 133px; top: 207px; padding-bottom: 50px; z-index: 2}
+
+#quickSummary {top: -57px; position: absolute; left: 291px; z-index: 2}
+
+#quickSummary p.p2 {color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold}
+
+#quickSummary p.p2 a:link {color: maroon; font-weight: bold; font-size: 12px; text-decoration: none}
+#quickSummary p.p2 a:visited {color: maroon; font-weight: bold; font-size: 12px; text-decoration: none}
+#quickSummary p.p2 a:hover {color: yellow; font-weight: bold; font-size: 12px; text-decoration: none; background-color: #333333}
+#quickSummary p.p2 a:active {color: maroon; font-weight: bold; font-size: 12px; text-decoration: none}
+
+#preamble {width: 614px; position:relative; left: 7px; top: -40px; overflow: visible; z-index: 1; padding-right: 3px}
+
+#preamble p {padding-right: 20px; padding-left: 5px; font-family: Arial, Helvetica, sans-seri; font-size: 10px; color: #333333}
+
+#preamble p.p1 {padding-top: 28px}
+
+#supportingText {font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #333333; width: 614px; position:relative; left:141px; margin-top: 30px; top: 100px; z-index: 1; border-width:1px;border-color:#c2c2c2; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; padding-right: 3px; margin-bottom: 100px}
+
+#supportingText p {padding-right: 20px; padding-left: 5px}
+
+#supportingText a:link {color: #FF0000; font-weight: normal; text-decoration: none}
+#supportingText a:visited {color: #990000; text-decoration: underline;}
+#supportingText a:hover {color: #FFFFFF; background-color: #666666; text-decoration: none}
+#supportingText a:active {color: #FF0000; text-decoration: underline overline; background-color: #FFFFFF}
+
+#explanation {background-image: url(sowhatisthisabout.jpg); background-repeat: no-repeat; padding-top: 23px; padding-right: 3px}
+
+#participation {background-image: url(participation.jpg); background-repeat: no-repeat; left: 0px; top: 153px; z-index: 1; padding-top: 23px}
+
+#benefits {background-image: url(benefits.jpg); background-repeat: no-repeat; left: 0px; top: 366px; z-index: 1; padding-top: 23px}
+
+#requirements {background-image: url(requirements.jpg); background-repeat: no-repeat; left: 0px; top: 466px; z-index: 1; padding-top: 23px}
+
+#footer {padding-left: 10px;}
+
+#footer a:link {font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; font-weight: bold; font-size: 12px}
+#footer a:hover {font-family: Arial, Helvetica, sans-serif; color: yellow; font-weight: bold; font-size: 12px; background-color: #333333}
+
+#linkList {position: absolute; left: 9px; top: 0px; width: 121px; font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #333333; z-index: 2; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-right-color: #c2c2c2; border-bottom-color: #c2c2c2; border-left-color: #c2c2c2; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; margin-top: 208px; bottom: 5px}
+
+#linkList a:link {color: #003366; font-weight: normal; text-decoration: none}
+#linkList a:visited {color: #000033; font-weight: normal; text-decoration: none}
+#linkList a:hover {color: #FFFFFF; font-weight: normal; text-decoration: none; background-color: #666666}
+#linkList a:active {color: #FF0000; text-decoration: underline overline; background-color: #FFFFFF}
+
+#lselect {width: 121px; left: 0px; top: -1px; z-index: 1; padding-top: 23px}
+
+#larchives {background-image: url(archives.jpg); background-repeat: no-repeat; left: 0px; width: 121px; z-index: 1; padding-top: 23px; background-position: -9px 0px}
+li {list-style-position: outside; list-style: url(li.jpg); margin: 0px 10px 0px -10px; padding-top: 7px}
+
+#lresources {background-image: url(resources.jpg); background-repeat: no-repeat; left: 0px; width: 121px; z-index: 1; padding-top: 23px; background-position: -9px 0px}/* css Zen Garden submission 033 - 'Fleur-de-lys' by Claire Campbell, http://www.tanfa.co.uk/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Claire Campbell */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+font: 100% verdana, helvetica, arial, sans-serif;
+margin: 0;
+padding: 0;
+background: #f0e7d7;
+color: #000;
+text-align: center;
+min-width: 760px;
+}
+
+p, ul, #footer {font-size: 0.8em;}
+
+h1, h2, h3 {
+font-family: georgia, serif;
+letter-spacing: 0.1cm;
+}
+
+a:link, a:visited, a:active {
+color: #800000;
+background: transparent;
+font-weight: bold;
+font-size: 0.9em;
+text-decoration: none;
+}
+a:hover {
+color: #aaab9c;
+background: transparent;
+text-decoration: underline;
+}
+
+#intro {clear: both;}
+
+#container {
+width: 760px;
+background: #f0e7d7 url(bodybg.jpg) repeat-y 0% 0%;
+color: #000;
+padding: 0;
+margin: 0 auto;
+}
+
+#pageHeader {
+position: relative;
+float: right;
+width: 230px;
+padding: 0;
+margin: 0;
+margin-left: -3px;
+background: #f0e7d7;
+color: #000;
+}
+
+
+#pageHeader h1 {
+background: #f0e7d7 url(zenhead.jpg) no-repeat 0% 0%;
+color: #800000;
+height: 174px;
+padding: 0;
+margin: 0;
+}
+
+#pageHeader h2 {
+padding: 0;
+margin: 0;
+display: none;
+}
+
+#pageHeader h1 span {display: none;}
+
+#quickSummary {
+position: relative;
+width: 230px;
+float: right;
+clear: right;
+background: transparent url(summarybg.gif) no-repeat bottom left;
+color: #000;
+margin: 0;
+padding: 0 0 20px 0;
+}
+
+#quickSummary p {
+font-family: georgia, serif;
+margin: 0;
+padding: 10px 10px 10px 20px;
+text-align: right;
+}
+
+
+#preamble {
+width: 530px;
+background: #fff url(lilybg.jpg) no-repeat 0% 0%;
+color: #000;
+margin: 0;
+padding: 50px 0 0 0;
+}
+
+#preamble h3 {
+width: 350px;
+height: 40px;
+padding: 0;
+margin: 0 0 0 170px;
+}
+
+#preamble h3 span {display: none;}
+
+#preamble p {
+padding: 0;
+margin: 0;
+padding: 20px 30px 0px 0px;
+text-align: justify;
+}
+
+#preamble p.p3 {
+padding-bottom: 20px;
+}
+
+#preamble p:first-letter {
+color: #800000;
+background: transparent;
+font-size: 16px;
+font-weight: bold;
+vertical-align: baseline;
+}
+
+
+#preamble p.p1 {margin-left: 200px;}
+#preamble p.p2 {margin-left: 180px;}
+#preamble p.p3 {margin-left: 80px;}
+
+#supportingText {
+float: left;
+clear: left;
+text-align: justify;
+background: #fff url(supportbg.gif) no-repeat top right;
+color: #000;
+padding-bottom: 20px;
+padding-top: 23px;
+border-right: 10px solid #800000;
+width: 530px;
+\width: 540px;
+w\idth: 530px;
+}
+
+#supportingText h3 {
+padding: 5px 30px 6px 0;
+margin: 10px 0 0 0;
+border-top: 1px solid #aaab9c;
+font-size: 0.9em;
+text-align: right;
+background: #fff url(suph3bg.jpg) no-repeat bottom right;
+color: #aaab9c;
+}
+
+#supportingText h3 span {}
+
+#supportingText p {padding: 15px 20px 0 50px; margin: 0;}
+
+#supportingText p:first-letter {
+color: #800000;
+background: transparent;
+font-size: 16px;
+font-weight: bold;
+vertical-align: baseline;
+}
+
+#explanation {
+background: #fff url(sowhatbg.jpg) no-repeat 0% 0%;
+color: #000;
+}
+#explanation h3 {visibility: hidden;}
+#explanation h3 span {}
+#explanation p.p1 {padding-top: 30px;}
+
+#requirements p.p5 {
+text-align: right;
+padding-bottom: 0;
+margin-bottom: -180px;
+}
+
+#linkList {
+margin: 0;
+padding: 0;
+margin-left: 530px;
+padding: 30px 15px 20px 0px;
+}
+
+#linkList h3 {
+padding: 5px 0 6px 30px;
+margin: 0;
+border-top: 1px solid #aaab9c;
+border-right: 1px solid #aaab9c;
+font-size: 0.9em;
+text-align: right;
+background: #f0e7d7 url(listh3bg.jpg) no-repeat bottom left;
+color: #aaab9c;
+text-align: left;
+}
+
+#linkList ul {
+margin: 0;
+padding: 0 0 10px 0;
+color: #aaab9c;
+background: transparent;
+border-right: 1px solid #aaab9c;
+}
+
+#linkList li {
+list-style-type: none;
+display: block;
+padding: 0;
+margin: 0;
+padding: 0;
+}
+
+#linkList #lselect li {padding: 1px 0; margin: 3px 0;}
+
+#linkList #larchives li, #linkList #lresources li {
+padding: 1px 0;
+margin: 0;
+text-align: right;
+}
+
+#larchives, #lresources {
+margin-top: 30px;
+text-align: left;
+}
+
+#lselect a, #larchives a, #lresources a {
+display:block;
+text-transform: lowercase;
+font-family: georgia, serif;
+font-size: 0.9em;
+font-weight: 700;
+padding: 10px 0 3px 0;
+}
+
+#lselect a {
+letter-spacing: 0.1em;
+background: #f0e7d7 url(linkbg.jpg) no-repeat 50% 0%;
+color: #800000;
+}
+
+#larchives a, #lresources a {
+font-family: verdana, helvetica, arial, sans-serif;
+background: #f0e7d7;
+padding: 3px 30px 3px 0;
+margin: 0;
+background: #f0e7d7 url(link2bg.jpg) no-repeat 100% 50%;
+color: #800000;
+}
+
+#lselect a.c {
+display:inline;
+text-transform: none;
+border-width: 0px;
+letter-spacing: 0;
+font-family: verdana, helvetica, sans-serif;
+background: #f0e7d7;
+color: #aaab9c;
+padding: 0;
+}
+
+#footer {
+margin: 0;
+padding: 0;
+position: relative;
+top: 0px;
+left: 630px;
+width: 6em;
+text-align: center;
+padding-bottom: 10px;
+}
+
+#footer a {
+display: block;
+width: 100%;
+background: #f7f2ea url(linkfootbg.jpg) no-repeat 0% 0%;
+color: #aaab9c;
+padding: 5px 0;
+border-width: 1px;
+border-color: #ffe #aaab9c #ccc #ffe;
+border-style: solid;
+text-decoration: none;
+}
+
+#footer a:hover {
+color: #800000;
+background: #f0e7d7 url(linkbg.jpg) no-repeat 0% 0%;
+border-color: #aaab9c #ffe #ffe #ccc;
+}
+
+#extraDiv1 {
+clear:both;
+display: block;
+position: relative;
+z-index: 10;
+padding: 0;
+margin: 0 auto;
+margin-top: -10px;
+background: #fff url(bottombg.jpg) no-repeat 109px 0;
+color: #000;
+height: 17px;
+width: 760px;
+}
+
+#extraDiv span #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6
+{display: none;}
+/* css Zen Garden submission 034 - 'zengrounds' by Andrea Piernock, http://www.snooble.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Andrea Piernock */
+/* Style based on newgrounds.com, adapted with permission */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+ margin: 0;
+ padding: 0;
+ background: #222 url(bg_main.gif) top left repeat-x;
+ color: #fff;
+ font-family: Verdana, Helvetica, Arial, sans-serif; }
+
+a { background: transparent; text-decoration: none; }
+a:link { color: #fc3; }
+a:visited { color: #f90; }
+a:active { color: #fff; }
+a:hover { color: #ff3; }
+acronym { cursor: help; border-bottom: 1px dotted #fff; }
+a acronym { cursor: help; border-bottom: 1px dotted #fc3; }
+
+#container {
+ position: relative;
+ top: 0;
+ left: 50%;
+ width: 750px;
+ margin: 0 0 0 -375px;
+ padding: 0;
+ background: #222; }
+
+#container #intro {
+ margin: 0 215px 0 0;
+ padding: 10px 0 0 0;
+ border-right: 10px solid #4E441B; }
+#container #intro #pageHeader {
+ width: 500px;
+ height: 105px;
+ margin: 0 10px;
+ padding: 10px 0 0 0;
+ background: url(csszen.gif) top left no-repeat; }
+#container #intro #pageHeader h1, #container #intro #pageHeader h2 { display: none; }
+
+#container #intro #quickSummary { margin: 0 20px; padding: 0 0 10px 0; }
+#container #intro #quickSummary p.p1 {
+ height: 75px;
+ margin: 0;
+ padding: 0;
+ background: url(demo.gif) top left no-repeat; }
+#container #intro #quickSummary p.p1 span { display: none; }
+#container #intro #quickSummary p.p2 {
+ margin: 10 0 0 0;
+ padding: 0;
+ font-size: 0.7em;
+ font-weight: bold;
+ text-align: center; }
+
+#container #intro #preamble {
+ width: 500px;
+ margin: 0 10px 15px 10px;
+ padding: 0 0 15px 0;
+ background: url(bottomRoad.gif) bottom left no-repeat; }
+#container #intro #preamble h3 {
+ height: 15px;
+ margin: 0;
+ padding: 0;
+ background: url(road.gif) top left no-repeat; }
+#container #intro #preamble h3 span { display: none; }
+#container #intro #preamble p {
+ margin: 0;
+ padding: 5px 10px;
+ background: url(tileRoad.gif) top left repeat-y;
+ font-size: 0.8em; }
+
+#container #supportingText {
+ margin: 0 215px 0 0;
+ padding: 0;
+ border-right: 10px solid #4E441B; }
+#container #supportingText div {
+ width: 500px;
+ margin: 0 10px 15px 10px;
+ padding: 0;
+ background: url(textBoxBg.gif) bottom left repeat-y; }
+#container #supportingText h3 { height: 65px; margin: 0; padding: 0; }
+#container #supportingText h3 span { display: none; }
+#container #supportingText #explanation h3 { background: url(textBoxHeadExplain.gif) top left no-repeat; }
+#container #supportingText #participation h3 { background: url(textBoxHeadPart.gif) top left no-repeat; }
+#container #supportingText #benefits h3 { background: url(textBoxHeadBenefits.gif) top left no-repeat; }
+#container #supportingText #requirements h3 { background: url(textBoxHeadRequir.gif) top left no-repeat; }
+#container #supportingText p { margin: 0; padding: 0 10px 10px 15px; font-size: 0.8em; }
+#container #supportingText p.p1 { margin-top: -35px; padding-right: 75px; }
+#container #supportingText #explanation p.p2,
+#container #supportingText #participation p.p4,
+#container #supportingText #benefits p.p1,
+#container #supportingText #requirements p.p5 {
+ padding-bottom: 25px;
+ background: url(textBoxBottom.gif) bottom left no-repeat; }
+
+#container #supportingText #footer {
+ margin: 0;
+ padding: 0 0 25px 0;
+ background: none;
+ font-size: 0.7em;
+ font-weight: bold;
+ text-align: center; }
+#container #supportingText #footer a {
+ margin: 0;
+ padding: 0 10px;
+ border-left: 5px solid #666;
+ border-right: 5px solid #666; }
+#container #supportingText #footer a:hover { background: #444; color: #fff; }
+
+#container #linkList {
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 225px;
+ margin: 0;
+ padding: 5px 0 0 0;
+ background: url(linkTile.gif) top right repeat-y; }
+#container #linkList #linkList2 div h3 span { display: none; }
+
+#container #linkList #linkList2 #lselect a { display: block; width: 100%; }
+#container #linkList #linkList2 #lselect a.c { display: inline; width: auto; }
+
+#container #linkList #linkList2 #lselect {
+ margin: 0 0 10px 0;
+ padding: 0 0 20px 0;
+ background: url(styleBottom.gif) bottom right no-repeat; }
+#container #linkList #linkList2 #lfavorites,
+#container #linkList #linkList2 #larchives,
+#container #linkList #linkList2 #lresources {
+ margin: 0 0 10px 0;
+ padding: 0 0 15px 0;
+ background: url(boxBottom.gif) bottom right no-repeat; }
+#container #linkList #linkList2 #lselect h3.select,
+#container #linkList #linkList2 #lfavorites h3.favorites,
+#container #linkList #linkList2 #larchives h3.archives,
+#container #linkList #linkList2 #lresources h3.resources {
+ height: 40px;
+ margin: 0;
+ padding: 0; }
+#container #linkList #linkList2 #lselect h3.select { background: url(headStyle.gif) top right no-repeat; }
+#container #linkList #linkList2 #lfavorites h3.favorites { background: url(faves.gif) top right no-repeat; }
+#container #linkList #linkList2 #larchives h3.archives { background: url(arcs.gif) top right no-repeat; }
+#container #linkList #linkList2 #lresources h3.resources { background: url(res.gif) top right no-repeat; }
+
+#container #linkList #linkList2 #lselect ul {
+ list-style: none;
+ margin: 0 10px 0 0;
+ padding: 0 10px 5px 80px;
+ background: url(tileStyle.gif) top right repeat-y; }
+#container #linkList #linkList2 #lfavorites ul,
+#container #linkList #linkList2 #larchives ul,
+#container #linkList #linkList2 #lresources ul {
+ list-style: none;
+ margin: 0 10px 0 0;
+ padding: 0 10px 5px 40px;
+ background: url(tile.gif) top right repeat-y; }
+#container #linkList #linkList2 #lselect li,
+#container #linkList #linkList2 #lfavorites li,
+#container #linkList #linkList2 #larchives li,
+#container #linkList #linkList2 #lresources li {
+ margin: 0;
+ padding: 0;
+ font-size: 0.7em; }/* css Zen Garden submission 035 - 'Release One' by Didier Hilhorst, http://www.nundroo.com/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, Didier Hilhorst */
+/* Added in 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the
+ designer's written permission. However, feel free to study the CSS and use
+ techniques you learn from it elsewhere. */
+
+
+
+/* Overall Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+body {
+ background: #d8d8d8 url(bg.gif) repeat-y top left;
+ font-family: 'Lucida Grande','Lucida Sans Unicode',arial,verdana,sans-serif;
+ margin: 0;
+ padding: 0;
+ color: #666;
+ }
+
+
+/* Layout Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+#container {
+ background: transparent url(bg_rel-one.gif) no-repeat bottom right;
+ margin: 0;
+ padding: 0;
+ }
+
+#intro {
+ background: transparent url(bg_pattern.gif) repeat top left;
+ margin: 0;
+ padding: 0;
+ border-bottom: 2px solid #fff
+ }
+
+#supportingText {
+ background: transparent url(bg_left.gif) repeat-y top left;
+ margin: 0;
+ padding: 0;
+ }
+
+#pageHeader {
+ background: #9bec37 url(bg_header.gif) repeat-y top left;
+ color: #666;
+ height: 180px;
+ margin: 0;
+ border-bottom: 2px solid #fff;
+ }
+
+#pageHeader h1 {
+ display: none;
+ }
+
+#pageHeader h2 {
+ display: none;
+ }
+
+#quickSummary {
+ height: 166px;
+ width: 735px;
+ background: #100b0a url(bg_sub_header.jpg) no-repeat top right;
+ color: #fff;
+ border-bottom: 2px solid #fff;
+ margin: 0;
+ }
+
+#quickSummary p.p1 {
+ padding: 14px;
+ margin: 0;
+ width: 188px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 160px; /* Actual value for conformant browsers */
+ }
+
+html>#quickSummary p.p1 {
+ width: 160px; /* Be nice to Opera */
+ }
+
+#quickSummary p.p2 {
+ padding: 0px 14px 14px 14px;
+ margin: 0;
+ width: 158px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 130px; /* Actual value for conformant browsers */
+ }
+
+html>#quickSummary p.p2 {
+ width: 130px; /* Be nice to Opera */
+ }
+
+#preamble {
+ margin-left: 233px;
+ background: #f90 url(bg_preamble.gif) no-repeat top right;
+ color: #fff;
+ border-right: 2px solid #fff;
+ padding-bottom: 16px;
+ width: 502px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 500px; /* Actual value for conformant browsers */
+ }
+
+html>#preamble {
+ width: 500px; /* Be nice to Opera */
+ }
+
+#explanation, #participation, #benefits {
+ margin-left: 233px;
+ border: 1px solid #bbb;
+ background: #f5f5f5;
+ color: #666;
+ margin-bottom: 2px;
+ width: 500px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 498px; /* Actual value for conformant browsers */
+ }
+
+html>#explanation, #participation, #benefits {
+ width: 498px; /* Be nice to Opera */
+ }
+
+#requirements {
+ margin-left: 233px;
+ border: 1px solid #bbb;
+ background: #f5f5f5;
+ color: #666;
+ margin-bottom: 0;
+ padding-bottom: 16px;
+ width: 500px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 498px; /* Actual value for conformant browsers */
+ }
+
+html>#requirements {
+ width: 498px; /* Be nice to Opera */
+ }
+
+#footer {
+ border-top: 2px solid #fff;
+ background: #9bec37 url(bg_footer.gif) no-repeat top left;
+ color: #fff;
+ padding: 14px 0 8px 252px;
+ height: 36px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height: 12px; /* Actual value for conformant browsers (IE6 needs a height value to display the background correctly. Don't even start...) */
+ }
+
+html>#footer {
+ height: 12px; /* Be nice to Opera */
+ }
+
+#linkList {
+ position: absolute;
+ background: #b5b5b5;
+ color: #666;
+ top: 350px;
+ padding: 12px;
+ border-right: 2px solid #fff;
+ width: 231px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 207px; /* Actual value for conformant browsers */
+ }
+
+html>#linkList {
+ width: 207px; /* Be nice to Opera */
+ }
+
+#larchives, #lfavorites, #lresources {
+ background: #dfdfdf;
+ color: #666;
+ border: 2px solid #fff;
+ padding: 12px;
+ margin: 0 0 12px 0;
+ }
+
+#lselect {
+ background: #dfdfdf url(bg_lselect.gif) no-repeat top right;
+ color: #666;
+ border: 2px solid #fff;
+ padding: 12px;
+ margin: 0 0 12px 0;
+ }
+
+
+/* Text Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+p {
+ font-size: 11px;
+ text-align: justify;
+ }
+
+
+#preamble p, #quickSummary p.p2 {
+ line-height: 1.5;
+ color: #fff;
+ background: transparent;
+ }
+
+#preamble p {
+ font-size: 10px;
+ width: 250px;
+ text-align: justify;
+ }
+
+#preamble p.p1 {
+ margin: 16px 18px 10px 18px;
+ }
+
+#preamble p.p2 {
+ margin: 0 18px 10px 18px;
+}
+
+#preamble p.p3 {
+ padding: 0;
+ margin: 0 18px 0 18px;
+ }
+
+
+/* First Paragraphs */
+
+#explanation p.p1, #participation p.p1, #requirements p.p1 {
+ padding: 0;
+ margin: 16px 18px 12px 18px;
+ }
+
+
+/* Intermediate Paragraphs */
+
+#participation p.p2, #participation p.p3, #requirements p.p2, #requirements p.p3, #requirements p.p4 {
+ padding: 0;
+ margin: 12px 18px 12px 18px;
+ }
+
+
+/* Last Paragraphs */
+
+#explanation p.p2, #participation p.p4 {
+ padding: 0;
+ margin: 0px 18px 16px 18px;
+ }
+
+#requirements p.p5 {
+ margin: 0px 18px 0px 18px;
+ padding: 0;
+ }
+
+
+/* One Paragraph */
+
+#benefits p.p1 {
+ margin: 16px 18px 16px 18px;
+ }
+
+
+#supportingText p {
+ line-height: 1.5;
+ }
+
+#quickSummary p.p1 {
+ font-size: 9px;
+ background: transparent;
+ color: #999;
+ text-align: left;
+ }
+
+#quickSummary p.p2 {
+ font-size: 9px;
+ color: #999;
+ text-align: left;
+ }
+
+#footer {
+ font-size: 9px;
+ font-family: 'Arial', Helvetica, sans-serif; /* Looks slightly better */
+ }
+
+/* Lists Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+#linkList ul {
+ font-size: 10px;
+ list-style:none;
+ margin: 0;
+ padding: 0;
+ }
+
+#linkList ul li {
+ background: url(bullet_gen.gif) no-repeat 2px 3px;
+ margin: 0;
+ padding: 0 0 5px 15px;
+ line-height: 12px;
+ color: #999;
+ }
+
+#linkList #lselect li {
+ background: url(bullet_design.gif) no-repeat 2px 3px;
+ font-size: 9px;
+ }
+
+#linkList #lfavorites li {
+ background: url(bullet_fav.gif) no-repeat;
+ font-size: 9px;
+ }
+
+#linkList #lselect a:link, #linkList #lselect a:visited, #linkList #lfavorites a:link, #linkList #lfavorites a:visited {
+ display: block;
+ }
+
+#linkList #lselect a.c:link, #linkList #lselect a.c:visited, #linkList #lfavorites a.c:link, #linkList #lfavorites a.c:visited {
+ display:inline;
+ }
+
+#larchives li, #lresources li {
+ text-transform: lowercase;
+ }
+
+
+/* Links Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+a, a:link, a:visited {
+ background: transparent;
+ color: #333;
+ text-decoration: underline;
+ }
+
+a:hover {
+ background: transparent;
+ color: #333;
+ text-decoration: none;
+ }
+
+#quickSummary a, #quickSummary a:link, #quickSummary a:visited {
+ background: transparent url(download.gif) no-repeat 0 4px;
+ color: #fff;
+ text-transform: uppercase;
+ text-decoration: none;
+ padding-left: 8px;
+ }
+
+#quickSummary a:hover {
+ text-decoration: underline;
+ }
+
+#linkList a, #linkList a:link, #linkList a:visited {
+ background: transparent;
+ color: #444;
+ text-decoration: none;
+ }
+
+#linkList a:hover {
+ background: transparent;
+ color: #333;
+ text-decoration: underline;
+ }
+
+#linkList a.c, #linkList a.c:link, #linkList a.c:visited {
+ background: transparent;
+ color: #666;
+ text-decoration: none;
+ }
+
+#linkList a.c:hover {
+ background: transparent;
+ color: #333;
+ text-decoration: underline;
+ }
+
+#linkList #lselect a {
+ font-size: 10px;
+ }
+
+#linkList #lselect a.c {
+ font-size: 9px;
+ text-transform: lowercase;
+ }
+
+#footer a, #footer a:link, #footer a:visited {
+ background: transparent url(arrow_footer.gif) no-repeat 0 2px;
+ color: #fff;
+ text-decoration: none;
+ text-transform: uppercase;
+ padding-left: 8px;
+ }
+
+#footer a:hover {
+ text-decoration: underline;
+ }
+
+
+/* Headings Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+h3 {
+ margin-bottom: 0px;
+ }
+
+h3 span {
+ display: none;
+ }
+
+#linkList h3 {
+ width: 150px;
+ height: 20px;
+ margin-top: 20px;
+ }
+
+#preamble h3 {
+ background: transparent url(title_road.gif) no-repeat top left;
+ width: 500px;
+ height: 34px;
+ border-bottom: 2px solid #fff;
+ margin: 0;
+ height: 36px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height: 34px; /* Actual value for conformant browsers */
+ }
+
+html>#preamble h3 {
+ height: 34px; /* Be nice to Opera */
+ }
+
+#explanation h3, #participation h3, #benefits h3, #requirements h3 {
+ width: 498px;
+ height: 30px;
+ margin: 0;
+ }
+
+#explanation h3 {
+ background: transparent url(title_about.gif) no-repeat top left;
+ }
+
+#participation h3 {
+ background: transparent url(title_partici.gif) no-repeat top left;
+ }
+
+#benefits h3 {
+ background: transparent url(title_benef.gif) no-repeat top left;
+ }
+
+#requirements h3 {
+ background: transparent url(title_req.gif) no-repeat top left;
+ }
+
+#lselect h3, #lfavorites h3, #larchives h3, #lresources h3 {
+ height: 28px;
+ width: 100%;
+ margin: 0;
+ }
+
+#lselect h3 {
+ background: transparent url(bg_select_des.gif) no-repeat top left;
+ }
+
+#lfavorites h3 {
+ background: transparent url(bg_select_fav.gif) no-repeat top left;
+ }
+
+#larchives h3 {
+ background: transparent url(bg_select_arc.gif) no-repeat top left;
+ }
+
+#lresources h3 {
+ background: transparent url(bg_select_res.gif) no-repeat top left;
+ }
+
+
+/* Other Definitions
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+acronym {
+ cursor: help;
+ }
+
+#preamble acronym {
+ border-bottom: 1px dotted #ffe0b3;
+}
+
+#lresources acronym {
+ border-bottom: 1px dotted #999;
+}
+
+#supportingText acronym {
+ background: transparent url(acro.gif) no-repeat center right;
+ padding-right: 11px;
+ margin-right: 1px;
+ cursor: help;
+ border: 0;
+ }
+
+#participation a acronym {
+ background: transparent;
+ padding: 0;
+ margin: 0;
+}
+
+#extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
+ display: none; /* I was tempted at times though... */
+ }
+
+img {
+ display: none;
+ }/* css Zen Garden submission 036 - 'White Lily' by Jens Kristensen, http://j-k.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Jens Kristensen */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* You may use this file as a foundation for any new work, but you may find it easier to start from scratch. */
+/* Not all elements are defined in this file, so you'll most likely want to refer to the xhtml as well. */
+
+
+/* basic elements */
+/*---------------------------------------------------*/
+
+body, html, div {
+ margin: 0;
+ padding: 0;
+}
+
+
+body {
+ font: 8pt/16pt verdana, geneva, arial, sans serif;
+ color: #000;
+ background: #fff url(lbg.gif) repeat-y;
+
+}
+
+/* specific divs */
+
+/* container keeps it all together */
+/*---------------------------------------------------*/
+
+#container{
+ border-top:1px solid #230;
+ border-right: 1px solid #230;
+ width:760px;
+ margin: 0px;
+ padding: 0px;
+ background: transparent url(topbg.gif) repeat-x;
+
+}
+
+/* intro div and its content */
+/*---------------------------------------------------*/
+
+#intro {
+ margin:0;
+ padding:0;
+ margin-top:20px;
+ width:760px;
+ background: transparent url(lsh.gif) no-repeat 687px 231px;
+}
+
+#pageHeader {
+ position:absolute;
+ left:0;
+ width: 355px;
+ height:201px
+
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ background: transparent url(centerpiece.jpg) no-repeat;
+ margin-top: 0px;
+ width: 355px;
+ height: 201px;
+ float: left;
+}
+
+#pageHeader h1 span,#pageHeader h2,#pageHeader h2 span {
+ display:none;
+}
+
+#quickSummary{
+ margin: 0 0 0 355px;
+ width:332px;
+ height: 200px;
+ background: #ABBC47 url(quicksumbg.gif);
+ border-right:1px solid #ABBC47;
+ border-top:1px solid #ABBC47;
+}
+
+#quickSummary p.p1 {
+ font: bold 11px/14px arial,verdana, sans serif;
+ color:#fff;
+ padding:100px 30px 2px 30px;
+}
+
+#quickSummary p.p2{
+ position:absolute;
+ left:0;
+ top:230px;
+ font: 10px verdana, arial, sans serif;
+ color:#fff;
+ margin:0 30px;
+}
+
+/* visually footer is moved up to be with the intro stuff */
+
+#footer{
+ position:absolute;
+ left:0;
+ top:230px;
+ font: 10px verdana, arial, sans serif;
+ color:#fff;
+ margin:0 30px 0 400px;
+ width:340px;
+ text-align:right;
+}
+
+#quickSummary p.p2 a, #footer a{
+ color:#fff;
+}
+
+#quickSummary p.p2 a:hover, #footer a:hover{
+ color:#230;
+ background-color:#fff;
+ text-decoration:none;
+}
+
+/* visually we now move into the main area of the page
+/*---------------------------------------------------*/
+
+#preamble{
+ padding:50px 30px 30px 30px;
+ margin:30px 0 0 355px;
+ border-width:0 0 1px 1px;
+ border-color:#fff #ddd;
+ border-style:solid;
+ text-align:left;
+ background: transparent url(endsection.gif) no-repeat bottom center;
+
+ width:343px;
+}
+
+#preamble p, #explanation p, #benefits p, #participation p, #requirements p{
+ text-align:justify;
+}
+
+#preamble h3{
+ background: transparent url(h3preamble.gif) no-repeat bottom left;
+ margin: 0px;
+ width: 270px;
+ height: 36px;
+ border-bottom:1px solid #ddd;
+}
+#preamble h3 span{
+ display:none
+}
+#preamble p.p1{
+ width: 270px;
+}
+
+
+#supportingText{
+ border-width:0 0 1px 1px;
+ border-color:#fff #ddd;
+ border-style:solid;
+ margin:0px 0px 0px 355px;
+ padding:50px 30px 0 30px;
+ width:405px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width:343px;
+
+
+}
+
+#explanation, #benefits, #participation, #requirements {
+ padding:0 0 20px 0;
+ margin-bottom:20px;
+ text-align:left;
+ background: transparent url(endsection.gif) no-repeat bottom center;
+}
+
+p{
+ padding-left: 8px;
+ padding-right: 8px;
+}
+
+.p1{
+ margin-top:26px;
+}
+
+#quickSummary .p1{
+ margin-top:0;
+}
+
+/* use images to display headers */
+
+#explanation h3{
+ background: transparent url(h3explanation.gif) no-repeat bottom left;
+}
+#benefits h3{
+ background: transparent url(h3benefits.gif) no-repeat bottom left;
+}
+#participation h3{
+ background: transparent url(h3participation.gif) no-repeat bottom left;
+}
+#requirements h3{
+ background: transparent url(h3requirements.gif) no-repeat bottom left;
+}
+
+#explanation h3, #benefits h3, #participation h3, #requirements h3 {
+ margin: 0px;
+ min-width: 200px;
+ height: 36px;
+ border-bottom:1px solid #ddd;
+}
+#explanation h3 span, #benefits h3 span, #participation h3 span, #requirements h3 span {
+ display:none
+}
+
+/* and finally we place the list of links */
+/*---------------------------------------------------*/
+
+#linkList{
+ position:absolute;
+ left:0px;
+ top:252px;
+ width:355px;
+ padding:50px 30px 0 130px;
+ background: transparent url(lsh.gif) no-repeat top left;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width:195px;
+}
+
+#linkList2{
+ padding:0;
+}
+
+/* use images for headers */
+
+h3.select{
+ background: transparent url(h3select.gif) no-repeat bottom left;
+}
+h3.archives{
+ background: transparent url(h3archives.gif) no-repeat bottom left;
+}
+h3.resources{
+ background: transparent url(h3resources.gif) no-repeat bottom left;
+}
+
+h3.select, h3.archives, h3.resources {
+ margin: 0px;
+ min-width: 200px;
+ height: 36px;
+ border-bottom:1px solid #ddd;
+}
+h3.select span, h3.archives span, h3.resources span{
+ display:none
+}
+
+/* put some style on the lists */
+
+/* first the list of designs */
+#lselect ul {
+ margin: 10px 0 0 0;
+ padding: 10px;
+}
+
+#lselect li {
+ line-height: 2.5ex;
+ list-style-type: none;
+ display: block;
+ padding: 5px 0px 5px 25px;
+ margin: 5px 0;
+ border-bottom:1px solid #eee;
+ background: transparent url(bullet.gif) no-repeat 0px 7px;
+}
+
+#lselect li a{
+ white-space:nowrap;
+ display:block;
+ font-weight:bold;
+}
+
+#lselect li a.c{
+ text-decoration:none;
+ display:inline;
+ font-weight:normal;
+}
+
+#lselect li a.c:hover{
+ text-decoration:underline;
+}
+
+/* then the lists of general info etc */
+
+#larchives ul, #lresources ul {
+ margin: 10px 0 0 0;
+ padding: 10px;
+}
+
+#larchives li, #lresources li {
+ list-style-type: none;
+ display: block;
+ padding: 0px;
+ padding: 0px 0px 0px 25px;
+ margin: 0;
+ background: transparent url(bullet2.gif) no-repeat 2px 7px;
+}
+
+/* some generic stuff */
+/*---------------------------------------------------*/
+
+a {
+ color:#230;
+}
+
+a:visited {
+ color:#672;
+}
+
+a:hover {
+ color:#ABBC47;
+}
+
+/* and finally we use one of the extra divs available */
+/*---------------------------------------------------*/
+
+#extraDiv1{
+ width:3px;
+ height:18px;
+ position:absolute;
+ left:354px;
+ top:252px;
+ background: transparent url(ltop.gif) no-repeat;
+}
+
+/* css Zen Garden submission 037 - 'pret-a-porter' by Minz Meyer - www.minzweb.de */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All other graphics copyright 2003, Minz Meyer */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* Well, though I know that web is not print, I wanted to try a visual concept that I designed for a printed brochure and
+see what happens when brought to screen. According to the printed object, which is heavily landscape format, I had to
+try the horizontal scrolling. (-- Didn't reinvent the wheel, Mike Pick already did this with his "What lies Beneath" design.)
+All in all I wanted to give it a look of a modern lifestyle and fashion magazine.
+The Photograph was shot by Thomas Moeller */
+
+
+body {
+ width: 2048px;
+ margin: 0;
+ padding: 0;
+ color: #888398;
+ background-color: #fff;
+ background-image: url(bg_body.jpg);
+ background-position: right;
+ background-repeat: repeat-y;
+ font: 11px/1.5 Arial, Verdana, sans-serif;
+
+}
+
+/* Different behaviour of the lady. Just a compromise for IE */
+
+div#extraDiv2 {
+ background-image: url(bg_face_ie.jpg);
+ background-repeat: no-repeat;
+ background-position: left bottom;
+ position: absolute;
+ left: 0;
+ bottom: 0;
+ height: 600px;
+ width: 265px;
+}
+
+/* And now the cool stuff, hiding from IE with child-selectors */
+
+body#css-zen-garden>div#extraDiv2 {
+ background-image: url(bg_face.jpg);
+ background-repeat: no-repeat;
+ background-position: left bottom;
+ position: fixed;
+ left: 0;
+ bottom: 0;
+ height: 594px;
+ width: 205px;
+ z-index: 2;
+}
+
+/* Using Geckos capability of PNG transparency to create the smooth scrolling border,
+when the screen is scrolled and the content vanishes to the left */
+
+body#css-zen-garden>div#extraDiv3 {
+ position: fixed;
+ left: 0;
+ top: 0;
+ height: 100%;
+ z-index: 1;
+ background-image: url(bg_white.png);
+ width: 225px;
+}
+
+/* The Header, using the "old":)) FIR-method */
+
+div#pageHeader {
+ position: relative;
+ left: 220px;
+ width: 1828px;
+}
+
+div#pageHeader h1 {
+ width: 493px;
+ height: 83px;
+ margin: 20px 0 0;
+ background-image: url(csszengarden.jpg);
+}
+
+div#pageHeader h1 span {
+ display: none;
+}
+
+div#pageHeader h2 {
+ width: 1826px;
+ height: 27px;
+ background-image: url(thebeautyofcssdesign.jpg);
+ background-position: right;
+ background-repeat: no-repeat;
+ margin-top: -10px;
+}
+
+div#pageHeader h2 span {
+ display: none;
+}
+
+div#quickSummary {
+ position: absolute;
+ width: 1300px;
+ left: 228px;
+ top: 98px;
+ letter-spacing: 0.1em;
+ color: #A5A3B5;
+ background-color: transparent;
+}
+
+/* Have the summary displayed in a single line */
+
+div#quickSummary p.p2, div#quickSummary p.p1 {
+ display: inline;
+ margin: 0;
+}
+
+div#extraDiv1 { /*adding a border */
+ position: absolute;
+ left: 225px;
+ top: 90px;
+ height: 1px;
+ width: 1823px;
+ background-color: #A5A3B5;
+ color: inherit;
+}
+
+
+/* The main content. All positioned absolutely
+-----------------------------------------------
+ The text-links */
+
+a:link, a:visited {
+ color: #A52A2A;
+ background-color: transparent;
+ font-weight: bold;
+ text-decoration: none;
+}
+
+a:hover {
+ text-decoration: underline;
+}
+
+/* The Preamble */
+
+div#preamble {
+ position: absolute;
+ left: 375px;
+ top: 160px;
+ width: 200px;
+ text-align: justify;
+}
+
+div#preamble h3 {
+ width: 200px;
+ height: 25px;
+ background-image: url(theroad.jpg);
+ margin: 0 0 0.5em;
+}
+
+div#preamble h3 span {
+ display: none;
+}
+
+div#preamble p {
+ margin: 0 0.5em 0.5em;
+}
+
+/* Supporting Text
+--------------------------------------*/
+
+div#explanation {
+ position: absolute;
+ left: 625px;
+ top: 160px;
+ width: 200px;
+ text-align: justify;
+}
+
+div#explanation h3 {
+ width: 200px;
+ height: 25px;
+ background-image: url(sowhatisthisabout.jpg);
+ margin: 0 0 0.5em;
+}
+
+div#explanation h3 span {
+ display: none;
+}
+
+div#explanation p {
+ margin: 0 0.5em 0.5em;
+}
+
+div#participation {
+ position: absolute;
+ left: 875px;
+ top: 160px;
+ width: 200px;
+ text-align: justify;
+}
+
+div#participation h3 {
+ width: 200px;
+ height: 25px;
+ background-image: url(participation.jpg);
+ margin: 0 0 0.5em;
+}
+
+div#participation h3 span {
+ display: none;
+}
+
+div#participation p {
+ margin: 0 0.5em 0.5em;
+}
+
+div#benefits {
+ position: absolute;
+ left: 1125px;
+ top: 160px;
+ width: 200px;
+ text-align: justify;
+}
+
+div#benefits h3 {
+ width: 200px;
+ height: 25px;
+ background-image: url(benefits.jpg);
+ margin: 0 0 0.5em;
+}
+
+div#benefits h3 span {
+ display: none;
+}
+
+div#benefits p {
+ margin: 0 0.5em 0.5em;
+}
+
+div#requirements {
+ position: absolute;
+ left: 1375px;
+ top: 160px;
+ width: 400px;
+ text-align: justify;
+}
+
+div#requirements h3 {
+ width: 400px;
+ height: 25px;
+ background-image: url(requirements.jpg);
+ margin: 0 0 0.5em;
+}
+
+div#requirements h3 span {
+ display: none;
+}
+
+div#requirements p {
+ margin: 0 0.5em 0.5em;
+}
+
+/* The Navigation
+---------------------------------------*/
+
+ div#linkList {
+ position: absolute;
+ left: 1828px;
+ top: 160px;
+ width: 220px;
+ background-color: transparent;
+ color: inherit;
+ background-image: url(bg_linklist.jpg);
+ background-repeat: repeat-y;
+ text-transform: lowercase;
+}
+
+
+div#linkList div#lselect li a:link, div#linkList div#lselect li a:visited {
+ display: block;
+ margin-left: -10px;
+ padding-left: 26px;
+ color: #8B879E;
+ background-color: transparent;
+ border-top: 1px solid #C6C6D2;
+ background-image: url(linklistlink.jpg);
+ background-repeat: no-repeat;
+}
+
+div#linkList li a:link, div#linkList div#lselect li a.c:link, div#linkList li a:visited, div#linkList div#lselect li a.c:visited {
+ display: inline;
+ background-image: none;
+ color: #A52A2A;
+ background-color: transparent;
+ padding-left: 0;
+ margin-left: 0;
+ border: none;
+}
+
+
+div#linkList ul {
+ list-style: none;
+ margin: 0 0 0 25px;
+ padding-left: 0;
+}
+
+div#linkList li {
+ padding-left: 10px;
+}
+
+
+
+div#lselect h3 {
+ float:left;
+ margin-top: 0;
+ width: 25px;
+ height: 200px;
+ background-image: url(selectadesign.jpg);
+ background-repeat: no-repeat;
+}
+
+div#lselect h3 span {
+ display: none;
+}
+
+div#larchives {
+ clear:left;
+ margin-top: 0;
+ border-top: 10px solid #D9D6E7;
+}
+
+div#larchives h3 {
+ float:left;
+ margin-top: 0;
+ width: 25px;
+ height: 81px;
+ background-image: url(archives.jpg);
+ background-repeat: no-repeat;
+}
+
+div#larchives h3 span {
+ display: none;
+}
+
+div#lresources {
+ clear:left;
+ margin-top: 0;
+ border-top: 10px solid #D9D6E7;
+}
+
+div#lresources h3 {
+ float:left;
+ margin-top: 0;
+ width: 25px;
+ height: 95px;
+ background-image: url(ressources.jpg);
+ background-repeat: no-repeat;
+}
+
+div#lresources h3 span {
+ display: none;
+}
+
+/* ...and the footer
+--------------------------------------*/
+div#footer {
+ position: absolute;
+ left: 1828px;
+ top: 3px;
+ width: 220px;
+ height: 20px;
+ text-align: center;
+ word-spacing: 0.1em;
+ overflow: hidden;
+}
+
+div#footer a:link, div#footer a:visited {
+ color: #B2AFC0;
+ background-color: transparent;
+}
+
+
+
+/* and extra artwork */
+
+div#extraDiv4 {
+ position: absolute;
+ left: 1828px;
+ top: 20px;
+ width: 214px;
+ height: 65px;
+ color: inherit;
+ background-color: #D9D6E7;
+ background-image: url(transition.jpg);
+ background-repeat: no-repeat;
+}/* css Zen Garden submission 038 - 'Creepy Crawly' by Luke Redpath - www.sonicdeath.co.uk */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All other graphics copyright 2003, Luke Redpath */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+/* Define main areas */
+body {
+ margin: 0;
+ padding: 0;
+ background: #97B661 url(body_bground.gif) repeat-y;
+}
+#container {
+ width: 760px;
+ background-color: #6E7F71;
+}
+
+/* Main Headers */
+#pageHeader h1 {
+ width: 760px;
+ height: 150px;
+ margin: 0;
+ padding: 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background-image: url(h1_mainheader.jpg);
+}
+#pageHeader h2 {
+ width: 760px;
+ height: 123px;
+ margin: 0;
+ padding: 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background-image: url(h2_mainheader.jpg);
+}
+
+/* Main content */
+#quickSummary {
+ margin-left: 289px;
+ background-image: url(summary_background.jpg);
+ background-repeat: no-repeat;
+}
+#preamble,
+#supportingText {
+ margin-left: 289px;
+}
+#quickSummary p,
+#preamble p,
+#supportingText p {
+ margin: 0 30px 20px 20px;;
+ padding: 0;
+ font-family: Georgia, serif;
+ font-size: 12px;
+ line-height: 1.6;
+ color: #DCEBDF;
+}
+
+/* Paragraph headers */
+#preamble h3 {
+ height: 36px;
+ padding: 0;
+ margin: 0 0 10px 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background: url(headers/preamble.gif) no-repeat;
+}
+#explanation h3 {
+ height: 36px;
+ padding: 0;
+ margin: 0 0 10px 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background: url(headers/explanation.gif) no-repeat;
+}
+#participation h3 {
+ height: 36px;
+ padding: 0;
+ margin: 0 0 10px 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background: url(headers/participation.gif) no-repeat;
+}
+#benefits h3 {
+ height: 36px;
+ padding: 0;
+ margin: 0 0 10px 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background: url(headers/benefits.gif) no-repeat;
+}
+#requirements h3 {
+ height: 36px;
+ padding: 0;
+ margin: 0 0 10px 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background: url(headers/requirements.gif) no-repeat;
+}
+
+/* Links */
+#linkList {
+ position: absolute;
+ top: 273px;
+ left: 0;
+ width: 289px;
+ margin: 0;
+ padding: 0 0 0 32px;
+ background-image: url(linklist_background.jpg);
+ background-repeat: no-repeat;
+}
+#linkList2 {
+ margin-right: 38px;
+}
+#linkList h3 {
+ font-family: Georgia, serif;
+ font-size: 15px;
+ color: #DCEBDF;
+ padding: 0;
+ margin: 0 0 20px 0;
+}
+#linkList ul {
+ margin: 0 0 20px 0;
+ padding: 0 32px 0 0;
+ list-style-type: none;
+ font-family: Georgia, serif;
+ font-size: 12px;
+ color: #DCEBDF;
+}
+#linkList li {
+ margin: 0 0 5px 0;
+ padding: 0 0 20px 0;
+ background: url(list_divider.gif) no-repeat;
+ background-position: bottom center;
+ text-align: center;
+}
+#lselect li a {
+ display: block;
+ text-transform: uppercase;
+}
+#lselect li a.c {
+ display: inline;
+ text-transform: none;
+}
+
+/* Link styles */
+a:link {
+ color: #E9EEDD;
+}
+a:hover {
+ color: #FFF;
+}
+a:visited {
+ color: #AAA;
+}
+
+/* Site footer */
+#footer {
+ text-align: right;
+ padding: 40px 20px 20px 0;
+ font-size: 11px;
+}/* css Zen Garden submission 039 - 'Erratic Blue' by Ian Main, http://www.e-lusion.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Ian Main */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+/* Font resizing has been locked down. I didn't want it to come to this but it mangles my layout. */
+
+/* basic elements ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+body {
+ margin: 0px;
+ padding: 0px;
+ font-family: verdana, arial, helvetica, sans-serif;
+ color: #000;
+ background: #ebebeb url(bg-grid.gif);
+ height: 100%;
+ text-align: center;
+ }
+
+html {
+ height: 100%;
+ margin: 0px;
+ padding: 0px;
+ }
+
+p, h3 {
+ margin: 0;
+ padding: 0 0px 5px 0;
+ }
+
+ul {
+ margin: 0;
+ padding: 2px 0 5px 0;
+ }
+
+li {
+ line-height: 1.6;
+ }
+
+/* Old-School! ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+acronym {
+ cursor: help;
+ }
+
+a acronym {
+ cursor: help;
+ }
+/* End Old-School! ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+
+a:link {
+ font-weight: 900;
+ color: #777;
+ text-decoration: none;
+ }
+
+a:visited {
+ font-weight: 900;
+ color: #999;
+ text-decoration: none;
+ }
+
+a:hover, a:active {
+ font-weight: 900;
+ color: #555;
+ }
+
+/* Layout */
+#container {
+ position: relative;
+ width: 712px;
+ padding: 0px;
+ margin-left: auto;
+ margin-right: auto;
+ border: 1px solid #000;
+ border-top: 0px;
+ border-bottom: 0px;
+ text-align: left;
+ /* Could not get the right column to stretch heigh: 100% of window view. So I cheated and had to
+ create a background image to fake the 100% column. */
+ background: #A1D9FC url(bg-full.gif) repeat-y;
+ }
+html>body #container {
+ width: 712px; /* ie5win fudge ends */
+ }
+
+#pageHeader h1{
+ left: 209px;
+ width: 712px;
+ height: 163px;
+ background: transparent url(intro_bg.jpg) no-repeat;
+ /* border-bottom: 3px solid #CCEDFF; Added to bevel lower edge. Layer orders were failing causing this to break. */
+ margin-top: 0;
+ margin-bottom: 25px;
+ }
+
+#pageHeader h1 span, #pageHeader h2 span, #extradiv1, #extradiv3, #extradiv4, #extradiv5, #extradiv6 {
+ margin: 0;
+ padding: 0;
+ display: none;
+ }
+
+/* Extra Divs - OverView, Footer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+/* An overview title for quickSummary. Great idea but couldn't get to work.
+ It would have sat at the top of the right column. Oh well, next time maybe! */
+
+/* #extraDiv1 {
+ position: relative;
+ margin-left: auto;
+ margin-right: auto;
+ background: transparent url(list_4.png) no-repeat;
+ height: 57px;
+ } */
+
+ #extraDiv2 {
+ position: relative;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: -20px;
+ width: 712px;
+ height: 25px;
+ background: transparent url(foot-bg.gif);
+ border-left: 1px solid #000;
+ border-right: 1px solid #000;
+ }
+
+/* Extra Divs Finish Here ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+
+#quickSummary p.p1 {
+ position: relative;
+ margin-left: 465px;
+ width: 235px;
+ font-size: 10px;
+ color: #b9b9b9;
+ line-height: 20px;
+ z-index: 1;
+ padding: 0 5px 5px 5px;
+ }
+
+#quickSummary p.p2 {
+ position: absolute;
+ top: 147px;
+ margin-left: 10px;
+ font-size: 11px;
+ font-family: verdana, sans-serif;
+ color: #777;
+ }
+ /* #linkList2 {
+ left: 0px;
+ background: transparent url(list_4.png) no-repeat;
+ height: 57px;
+ } */
+
+#linkList {
+ position: absolute;
+ top: 160px;
+ /*top: 10em; Dave suggested this but if I change the font size through the browser it pulls the whole right coloum up!!*/
+ margin-left: 458px;
+ margin-top: 3px;
+ background: transparent url(bg-side.gif) repeat-y;
+ width: 254px;
+ padding: 10px;
+ }
+
+#linkList h3.select {
+ background: transparent url(list_1.gif) no-repeat;
+ margin-top: 130px;
+ height: 57px;
+ margin-left: 5px;
+ }
+
+#linkList h3.archives {
+ background: transparent url(list_2.gif) no-repeat;
+ height: 57px;
+ margin-top: 20px;
+ margin-left: 5px;
+ }
+
+#linkList h3.resources {
+ background: transparent url(list_3.gif) no-repeat;
+ height: 57px;
+ margin-top: 20px;
+ margin-left: 5px;
+ }
+
+
+#linkList h3.select span, #linkList h3.archives span, #linkList h3.resources span {
+ display:none
+ }
+
+#linkList ul {
+ margin: 10px;
+ padding: 0px;
+ }
+
+#linkList li {
+ list-style-type: none;
+ background: transparent;
+ display: block;
+ font-size: 10px;
+ font-family: verdana, sans-serif;
+ color: #b9b9b9;
+ }
+
+#linkList li a:link, a:visited {
+ color: #b9b9b9;
+ text-decoration: none;
+ }
+
+#linkList li a:hover, #linkList li a:active{
+ color: #777;
+ text-decoration: none;
+ }
+
+a.c:link, a.c:visited, a.c:hover, a.c:active {
+ font-weight: normal;
+
+ }
+#preamble {
+ padding: 10px;
+ width: 450px;
+ margin-top: -110px;
+ font-family: verdana, sans-serif;
+ font-size: 13px;
+ color: #0F7FD0;
+ background: transparent url(text-bg.gif) top left repeat-y;
+ }
+
+#preamble h3 {
+ margin-top: 10px;
+ font-family: verdana, sans-serif;
+ margin-bottom: 20px;
+ padding: 5px;
+ text-align: center;
+ font-weight: bold;
+ color: #fff;
+ background: #86CDF9;
+ border: 1px solid #5FBEF9;
+ width: 428px;
+ font-size: 18px;
+ }
+
+#supportingText {
+ padding: 10px;
+ width: 450px;
+ font-family: verdana, sans-serif;
+ font-size: 13px;
+ color: #0F7FD0;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 440px;
+ }
+
+#supportingText a:link, #supportingText a:visited {
+ color: #3B92C9;
+ text-decoration: none;
+ }
+
+#supportingText a:hover, #supportingText a:active {
+ color: #fff;
+ border-bottom: 1px solid #fff;
+ text-decoration: none;
+ }
+
+#explanation h3, #participation h3, #benefits h3, #requirements h3 {
+ margin-top: 10px;
+ font-family: verdana, sans-serif;
+ margin-bottom: 20px;
+ padding: 5px;
+ text-align: center;
+ font-weight: bold;
+ color: #fff;
+ background: #86CDF9;
+ border: 1px solid #5FBEF9;
+ width: 428px;
+ font-size: 18px;
+ }
+
+#requirements {
+ }
+
+#requirements p.p5 {
+
+ margin-top: 20px;
+ padding: 5px;
+ text-align: center;
+ font-weight: bold;
+ color: #fff;
+ background: #86CDF9;
+ border: 1px solid #5FBEF9;
+ }
+
+#footer {
+ position: absolute;
+ top: 146px;
+ color: #777;
+ font-size: 12px;
+ margin-left: 470px;
+ width: 230px;
+}
+
+#footer a:link, #footer a:visited {
+ margin: 5px;
+ font-weight: normal;
+ color: #777;
+ text-decoration: none;
+}
+
+#footer a:hover, #footer a:active {
+ color: #333;
+ text-decoration: none;
+}
+
+#extraDiv1, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
+ display: none;
+ }/* css Zen Garden submission 040 - 'The Question Why' by Diane Clayton, http://www.schisma.net/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Diane Clayton */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+ +
+/* basic elements
+---------------------------------------------------------------*/
+body {
+ background: #030409 url(bg_darkblue.gif) repeat; /* stupid browser color shifts */
+ color: #030409;
+ font-family: Arial, sans-serif;
+ font-size: 12px;
+ margin: 0;
+ }
+
+#extraDiv1 {
+ z-index: 0;
+ background: #030409 url(bg_body.jpg) no-repeat top left;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 990px;
+ height: 980px;
+ }
+
+#preamble p, #supportingText p {
+ font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
+ line-height: 18px;
+ text-align: justify;
+ margin: 0;
+ padding: 0px 20px 10px 20px;
+ }
+#preamble p, #supportingText p {
+ background: #8B95A8 url(bg_lightblue.gif) repeat; /* stupid browser color shifts */
+ }
+
+h3 {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ }
+h3 span {
+ display: none;
+ }
+
+a:link, a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #FFFF99;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ }
+
+
+
+/* structuring and main content
+---------------------------------------------------------------*/
+#container {
+ z-index: 1;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 975px;
+ margin: 0;
+ }
+
+#intro {
+ z-index: 1;
+ position: absolute;
+ left: 710px;
+ width: 235px;
+ margin: 0;
+ padding: 0;
+ }
+
+#pageHeader h1 span, #pageHeader h2 span, #quickSummary p.p1 span {
+ display: none;
+ }
+
+#quickSummary {
+ position: absolute;
+ top: 150px;
+ right: 20px;
+ width: 175px;
+ color: #DBE0E6;
+ font-family: Arial, sans-serif;
+ font-size: 13px;
+ letter-spacing: 1px;
+ text-align: right;
+ }
+#quickSummary p {
+ padding: 0;
+ margin: 0;
+ border: 0;
+ }
+
+#preamble {
+ background: transparent url(bg_preamble.gif) no-repeat left bottom;
+ position: absolute;
+ top: 327px;
+ left: 0px;
+ width: 235px;
+ padding-bottom: 70px;
+ overflow: hidden;
+ }
+#preamble h3 {
+ background: transparent url(bg_preambleh3.gif) no-repeat left top;
+ height: 60px;
+ }
+
+#supportingText, #explanation, #participation, #benefits, #requirements {
+ margin: 0;
+ padding: 0;
+ }
+
+#supportingText {
+ z-index: 1;
+ position: absolute;
+ top: 327px;
+ left: 285px;
+ }
+
+#explanation {
+ background: transparent url(bg_explanation.gif) no-repeat left bottom;
+ color: #030409;
+ width: 400px;
+ padding-bottom: 25px;
+ margin-bottom: 10px;
+ }
+#explanation h3 {
+ background: transparent url(bg_explanationh3.gif) no-repeat left top;
+ height: 40px;
+ }
+
+#participation {
+ background: transparent url(bg_participation.gif) no-repeat left bottom;
+ color: #030409;
+ width: 400px;
+ padding-bottom: 30px;
+ margin-bottom: 10px;
+ }
+#participation h3 {
+ background: transparent url(bg_participationh3.gif) no-repeat left top;
+ height: 50px;
+ }
+
+#benefits {
+ background: transparent url(bg_benefits.gif) no-repeat left bottom;
+ color: #030409;
+ width: 400px;
+ padding-bottom: 25px;
+ margin-bottom: 20px;
+ }
+#benefits h3 {
+ background: transparent url(bg_benefitsh3.gif) no-repeat left top;
+ height: 45px;
+ }
+
+#requirements {
+ background: transparent url(bg_requirements.gif) no-repeat left bottom;
+ color: #030409;
+ width: 400px;
+ padding-bottom: 20px;
+ margin-bottom: 30px;
+ }
+#requirements h3 {
+ background: transparent url(bg_requirementsh3.gif) no-repeat left top;
+ height: 35px;
+ }
+
+#footer {
+ background: transparent url(bg_footer.gif) no-repeat center top;
+ width: 400px;
+ height: 20px;
+ margin-bottom: 50px;
+ text-align: center;
+ }
+
+
+/* link list
+---------------------------------------------------------------*/
+#linkList {
+ z-index:1;
+ position: absolute;
+ left: 25px;
+ top: 335px;
+ width: 235px;
+ }
+
+#linkList ul {
+ background: #8B95A8 url(bg_lightblue.gif) repeat;
+ margin: 0;
+ padding: 0;
+ border: 0;
+ list-style: none;
+ }
+#linkList ul li {
+ line-height: 18px;
+ margin: 0;
+ margin-left: 20px;
+ padding: 0;
+ padding-left: 25px;
+ padding-bottom: 10px;
+ }
+#linkList #lselect ul li, #linkList #lfavorites ul li {
+ background: transparent url(zenbullet.gif) no-repeat top left;
+ }
+#linkList #larchives ul li, #linkList #lresources ul li {
+ background: url(bullet.gif) no-repeat top left;
+ }
+
+#lselect, larchives, #lresources, #lfavorites {
+ padding: 0;
+ margin: 0;
+ }
+
+#lselect {
+ background: transparent url(bg_lselect.gif) no-repeat bottom left;
+ color: #030409;
+ width: 235px;
+ padding-bottom: 50px;
+ margin-bottom: 10px;
+ }
+#lselect h3 {
+ background: transparent url(bg_lselecth3.gif) no-repeat top left;
+ height:45px;
+ }
+#lselect a:link, #lselect a:visited, #lfavorites a:link, #lfavorites a:visited {
+ display: block;
+ font-size: 13px;
+ letter-spacing: 1px;
+ }
+#lselect a.c:link, #lselect a.c:visited, #lfavorites a.c:link, #lfavorites a.c:visited {
+ display: inline;
+ font-weight: normal;
+ color: #DBE0E6;
+ text-transform: lowercase;
+ padding-left: 3px;
+ }
+
+#larchives {
+ background: transparent url(bg_larchives.gif) no-repeat bottom left;
+ color: #030409;
+ width: 235px;
+ padding-bottom: 20px;
+ margin-bottom: 25px;
+ }
+#larchives h3 {
+ background: transparent url(bg_larchivesh3.gif) no-repeat top left;
+ height: 40px;
+ }
+#larchives li, #lresources li {
+ text-transform: lowercase;
+ }
+#larchives a:link, #larchives a:visited, #lresources a:link, #lresources a:visited {
+ font-size: 13px;
+ letter-spacing: 1px;
+ }
+
+#lresources {
+ background: transparent url(bg_lresources.gif) no-repeat bottom left;
+ color: #030409;
+ width: 235px;
+ padding-bottom: 50px;
+ margin-bottom: 10px;
+ }
+#lresources h3 {
+ background: transparent url(bg_lresourcesh3.gif) no-repeat top left;
+ height: 35px;
+ }
+
+
+/* just in case...
+---------------------------------------------------------------*/
+#lfavorites {
+ background: transparent url(bg_lfavorites.gif) no-repeat bottom left;
+ color: #030409;
+ width: 235px;
+ padding-bottom: 20px;
+ margin-bottom: 20px;
+ }
+#lfavorites h3 {
+ background: transparent url(bg_lfavoritesh3.gif) no-repeat top left;
+ height: 35px;
+ }
+
+
+/* extras
+---------------------------------------------------------------*/
+acronym {
+ border-width:0;
+ }/* css Zen Garden submission 041 - 'door to my garden' by Patrick Lauke, http://redux.deviantart.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Patrick Lauke */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+
+/* general stuff */
+
+
+
+body {
+ font: 0.7em/1.2em Times, serif ;
+ background: #000 url(background.png) -30px 0px no-repeat fixed;
+ color: #999;
+ padding: 0 0 0 470px;
+ margin: 0;
+}
+
+* {
+ text-transform: lowercase; /* could apply this to the body, but IE seems to ignore it there */
+ padding:0;
+ margin:0;
+}
+
+p {
+ margin: 1em 0 0 0;
+ padding: 0 0 1em 0;
+}
+
+
+p.p1:first-line {
+ font-weight: bold;
+}
+
+
+p.p2, p.p3, p.p4 {
+ /* originally used p + p, but IE doesn't play ball with that...so this is a rather ugly kludge */
+ text-indent: 1em;
+ margin-top: -0.8em;
+}
+
+
+h3 {
+ font-size: 1.2em;
+}
+
+ul {
+ list-style: none url(dot.png);
+ padding: 1em 0 0 0;
+ margin-left: 3em
+}
+
+li {
+ margin-bottom: 0.3em;
+}
+
+a {
+ color: #eee;
+ background: transparent;
+ text-decoration: none;
+}
+
+acronym {
+ /* override Mozilla and co.'s standard dotted line under acronyms for a better look
+ (at the detriment of accessibility, unfortunately) */
+ border: none;
+}
+
+
+/* more specific rules */
+
+#container {
+ background: #000 url(bottom_corner.png) no-repeat bottom right;
+ color: inherit;
+ width: 300px;
+}
+
+#pageHeader {
+ background: url(header.png) no-repeat top left;
+ width: 300px;
+ height: 170px;
+}
+
+#pageHeader span {
+ display: none;
+}
+
+#preamble, #supportingText div {
+ padding: 0 35px 0 35px;
+ text-align: justify;
+}
+
+
+/* admittedly graphics intensive, but each of the following divs has its own distincitve
+bracket (left or right) with its own different texture of dirt */
+
+#preamble {
+ background: url(bracket-l1.png) no-repeat top left;
+}
+
+#participation {
+ background: url(bracket-l2.png) no-repeat top left;
+}
+
+#requirements {
+ background: url(bracket-l3.png) no-repeat top left;
+}
+
+#benefits {
+ background: url(bracket-r1.png) no-repeat top right;
+}
+
+#explanation {
+ background: url(bracket-r2.png) no-repeat top right;
+}
+
+
+/* old-style borders for the window-frame look of the menu */
+
+#linkList {
+ position: absolute;
+ top: 145px;
+ left: 215px;
+ background: url(menu-top.png) no-repeat top right;
+ width: 248px;
+ height: 50px;
+}
+
+#linkList2 {
+ margin-top: 30px;
+ background: url(menu-body.png) #000;
+ color: inherit;
+}
+
+#lselect, #larchives, #lresources {
+ padding: 0 15px 0 15px;
+}
+
+
+#linkList2>#lselect {
+ /* slight kludge ? sure...but it adds nice eye candy. hidden from IE through the child selector,
+ and we make up for it later with extraDiv1 */
+ background: url(flower.png) no-repeat top left;
+ margin-left: -65px;
+ padding-left: 80px;
+ min-height: 150px;
+}
+
+#lresources {
+ background: url(menu-bottom.png) no-repeat bottom right;
+ padding-bottom: 2.5em;
+}
+
+
+/* static version of what was originally a flyout menu...but didn't work in Netscape 7 */
+
+#container>#linkList {
+ background: url(menu-top.png) no-repeat top right;
+}
+
+#linkList #linkList2{
+ visibility: visible;
+}
+
+
+/*just to tidy up the bottom end a bit */
+
+#container {
+ padding-bottom: 50px;
+ margin-bottom: -2em;
+}
+
+
+/* a bit of useless visual whimsy...*/
+
+p:hover {
+ color: #aaa;
+ background: transparent;
+}
+
+p:hover a {
+ color: #fff;
+ background: transparent;
+}
+
+/* and now...the extras */
+
+#extraDiv1 {
+ /* this one makes up for the screwy handling of the flower background on #lselect in IE */
+ position: absolute;
+ top: 165px;
+ left: 142px;
+ background: url(flower.png) no-repeat top left;
+ width: 115px;
+ height: 150px;
+}
+
+body>#extraDiv1 {
+ /* and this reverses the previous rule for those browsers (i.e. non IE ones) that already showed
+ the flower background correctly as it was applied to #lselect */
+ display: none;
+}
+
+
+#extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
+ display: none;
+}/* css Zen Garden submission 042 - 'Stone Washed' by Andrew Hayward, http://www.mooncalf.me.uk/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Andrew Hayward */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+ +
+
+/* ---[ General Stuff ]------------------------------ */
+
+ body {
+ margin: 0px;
+ padding: 0px;
+ background: #e6e6dc url('outer_shadow.gif') 0px 0px repeat-x;
+ color: #999;
+ font-family: tahoma, arial, helvetica, sans-serif;
+ }
+
+ h1, h2, h3, h4 {
+ margin: 0;
+ padding: 0;
+ }
+
+ p {
+ padding-left: 10px;
+ padding-right: 10px;
+ text-align: justify;
+ font-size: 0.8em;
+ }
+
+ a:link, a:visited {
+ color: #567b9b;
+ text-decoration: none;
+ }
+
+ a:hover, a:active {
+ background: #ddeeff;
+ }
+
+/* ---[ End General Stuff ]-------------------------- */
+
+/* ---[ Container ]---------------------------------- */
+
+ #container {
+ background: transparent url('side.gif') 100% 0px repeat-y;
+ }
+
+ /* ---[ Intro ]---------------------------------- */
+
+ #intro {
+ margin: 100px 275px 0px 100px;
+ background: #fff url('inner_shadow.gif') 0px 0px repeat-x;
+ padding: 30px 10px 10px 10px;
+ border-left: solid 1px #ccc;
+ }
+
+ /* ---[ Page Header ]------------------------ */
+
+ #pageHeader {
+ color: #fff;
+ height: 100px;
+ width: 100%;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ position: absolute;
+ background: transparent url('top.gif') 0px 0px repeat-x;
+ z-index: 10;
+ }
+
+ #pageHeader h1 {
+ height: 130px;
+ }
+
+ #pageHeader h1 span {
+ font-size: 1.5em;
+ background-color: transparent;
+ text-decoration: none;
+ text-transform: lowercase;
+ display: none;
+ font-weight: normal;
+ position: absolute;
+ right: 20px;
+ bottom: 3px;
+ color: #fff;
+ }
+
+ #pageHeader h2 {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ height: 115px;
+ width: 400px;
+ background: transparent url('top.title.gif') 0px 0px no-repeat;
+ }
+
+ #pageHeader h2 span {
+ display: none;
+ }
+
+ /* ---[ End Page Header ]-------------------- */
+
+ /* ---[ Quick Summary ]---------------------- */
+
+ #quickSummary {
+ width: 270px;
+ float: left;
+ border-top: solid 1px #ddd;
+ border-right: solid 1px #ddd;
+ /* border-bottom: solid 1px #999; */
+ border-left: solid 1px #ddd;
+ background: #e5e5e5 url('demo.bg.gif') 100% 100% no-repeat;
+ margin: 0px 15px 10px 0px;
+ padding: 0px 0px 3px 0px;
+ font-size: 1em;
+ }
+
+ #quickSummary p, #quickSummary p:first-letter {
+ text-align: center;
+ color: #666;
+ font-weight: normal;
+ }
+
+ #quickSummary .p1 {
+ background: #fff url('demo.p1.gif') 0% 0% no-repeat;
+ /* padding-bottom: 60px; */
+ height: 176px;
+ padding: 0px 0px 0px 0px;
+ margin: 0px;
+ }
+
+ #quickSummary .p1 span {
+ display: none;
+ }
+
+ #quickSummary .p2 {
+ position: relative;
+ bottom: 0px;
+ text-align: right;
+ padding-bottom: 15px;
+ }
+
+ #quickSummary>.p2 {
+ padding-bottom: 0px;
+ }
+
+ #quickSummary .p2 span {
+ visibility: hidden;
+ font-size: 0px;
+ }
+
+ #quickSummary .p2 span a {
+ margin-left: 75px;
+ font-size: 10pt;
+ visibility: visible;
+ display: block;
+ position: relative;
+ left: 0px;
+ background: none;
+ background: transparent url('file.gif') 100% 50% no-repeat;
+ padding-right: 18px;
+ color: #aaa;
+ font-variant: small-caps;
+ text-transform: capitalize;
+ }
+
+ #quickSummary .p2 span a:hover {
+ background: transparent url('file2.gif') 100% 50% no-repeat;
+ color: #819bb2;
+ }
+ /* ---[ End Quick Summary ]------------------ */
+
+ /* ---[ Preamble ]--------------------------- */
+
+ #preamble h3 {
+ display: none;
+ }
+
+ #preamble p {
+ font-size: 0.9em;
+ color: #819bb2;
+ padding-left: 300px;
+ }
+
+ /* ---[ End Preamble ]----------------------- */
+
+ /* ---[ End Intro ]------------------------------ */
+
+ /* ---[ Supporting Text ]------------------------ */
+
+ #supportingText {
+ margin: 0px 275px 0px 100px;
+ background: #fff;
+ padding: 10px 0px 10px 0px;
+ border-left: solid 1px #ccc;
+ }
+
+ #supportingText div {
+ clear: both;
+ }
+
+ #supportingText h3 {
+ padding-top: 30px;
+ height: 25px;
+ border-bottom: solid 1px #819bb2;
+ }
+
+ #supportingText h3 span {
+ display: none;
+ }
+
+ /* ---[ Explanation ]------------------------ */
+
+ #explanation {
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+ #explanation h3 {
+ background: #fff url('h3.explanation.gif') 100% 100% no-repeat;
+ }
+
+ #explanation p.p1 {
+ width: 45%;
+ float: left;
+ }
+
+ #explanation p.p2 {
+ width: 45%;
+ float: right;
+ }
+
+ /* ---[ End Explanation ]-------------------- */
+
+ /* ---[ Participation ]---------------------- */
+
+ #participation {
+ background: #fff url('stone.circle.jpg') 50% 100% no-repeat;
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+ #participation h3 {
+ background: #fff url('h3.participation.gif') 100% 100% no-repeat;
+ /* border-top: solid 1px #ccc; */
+ }
+
+ #participation p.p2 {
+ width: 45%;
+ float: left;
+ }
+
+ #participation p.p3 {
+ width: 45%;
+ float: right;
+ }
+
+ #participation p.p4 {
+ clear: both;
+ }
+
+ /* ---[ End Participation ]------------------ */
+
+ /* ---[ Benefits ]--------------------------- */
+
+ #benefits {
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+ #benefits h3 {
+ background: #fff url('h3.benefits.gif') 100% 100% no-repeat;
+ /* border-top: solid 1px #ccc; */
+ }
+
+ /* ---[ End Benefits ]----------------------- */
+
+ /* ---[ Requirements ]----------------------- */
+
+ #requirements {
+ background: #fff url('bamboo.leaf.jpg') 100% 100% no-repeat;
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+ #requirements h3 {
+ background: #fff url('h3.requirements.gif') 100% 100% no-repeat;
+ /* border-top: solid 1px #ccc; */
+ }
+
+ #requirements p.p2 {
+ width: 45%;
+ float: left;
+ }
+
+ #requirements p.p3, #requirements p.p4 {
+ width: 45%;
+ float: right;
+ }
+
+ #requirements p.p5 {
+ clear: both;
+ }
+
+ /* ---[ End Requirements ]------------------- */
+
+ /* ---[ Footer ]----------------------------- */
+
+ #footer {
+ margin-top: 15px;
+ padding-top: 40px;
+ padding-bottom: 20px;
+ font-size: 0.8em;
+ clear: both;
+ text-align: center;
+ background: #fff url('bamboo2.gif') 10px 0px repeat-x;
+ }
+
+ #footer a:link, #footer a:visited {
+ text-decoration: none;
+ color: #999;
+ }
+
+ #footer a:hover, #footer a:active {
+ background: none;
+ text-decoration: underline;
+ }
+
+ /* ---[ End Footer ]------------------------- */
+
+ /* ---[ End Supporting Text ]-------------------- */
+
+ /* ---[ Link List ]------------------------------ */
+
+ #linkList {
+ z-index: 2;
+ background: transparent url('pawn.jpg') 50% 100% no-repeat;
+ position: absolute;
+ top: 100px;
+ right: 100px;
+ float: right;
+ width: 175px;
+ }
+
+ #linkList h3 {
+ border: none;
+ margin-top: 5px;
+ margin-bottom: 10px;
+ height: 30px;
+ }
+
+ #linkList h3 span {
+ display: none;
+ }
+
+ /* ---[ Link List 2 ]------------------------ */
+
+ #linkList2 {
+ padding-top: 20px;
+ color: #666;
+ }
+
+ #linkList2 a:link, #linkList2 a:visited {
+ color: #819bb2;
+ text-decoration: none;
+ }
+
+ #linkList2 a:hover, #linkList2 a:active {
+ background: none;
+ text-decoration: underline;
+ }
+
+ #linkList2 div {
+ font-size: 0.7em;
+ padding: 8px 8px 10px 8px;
+ background: transparent url('sidesplit.gif') 0px 100% repeat-x;
+ }
+
+ #linkList2 ul {
+ list-style-type: none;
+ margin: 0px;
+ padding-left: 15px;
+ }
+
+ #linkList2 ul li {
+ /* background: url('bullet.gif') 0px 3px no-repeat; */
+ list-style-image: url('bullet.gif');
+ padding: 0px 0px 0px 0px;
+ margin: 0px 0px 10px 0px;
+ }
+
+ /* ---[ L Select ]----------------------- */
+
+ #lselect h3 {
+ background: #e5e5e5 url('h3.side.select.gif') 50% 0% no-repeat;
+ }
+
+ #lselect a {
+ display: block;
+ }
+
+ #lselect a.c {
+ display: inline;
+ }
+
+ /* ---[ End L Select ]------------------- */
+
+ /* ---[ L Favorites ]-------------------- */
+
+ #lfavorites h3 {
+ background: #e5e5e5 url('h3.side.favourites.gif') 50% 0% no-repeat;
+ }
+
+ #lfavorites a {
+ display: block;
+ }
+
+ #lfavorites a.c {
+ display: inline;
+ }
+
+ /* ---[ End L Favorites ]---------------- */
+
+ /* ---[ L Archives ]--------------------- */
+
+ #larchives h3 {
+ background: #e5e5e5 url('h3.side.archives.gif') 50% 0% no-repeat;
+ }
+
+ /* ---[ End L Archives ]----------------- */
+
+ /* ---[ L Resources ]-------------------- */
+
+ #lresources {
+ margin-bottom: 150px;
+ }
+
+ #lresources h3 {
+ background: #e5e5e5 url('h3.side.resources.gif') 50% 0% no-repeat;
+ }
+
+ /* ---[ End L Resources ]---------------- */
+
+ /* ---[ End Link List 2 ]-------------------- */
+
+ /* ---[ End Link List ]-------------------------- */
+
+/* ---[ End Container ]------------------------------ */
+
+/* ---[ Extra Div 1 ]-------------------------------- */
+
+ #extraDiv1 {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ width: 275px;
+ height: 130px;
+ background: transparent url('top.rip.gif') 0% 100% no-repeat;
+ z-index: 20;
+ }
+
+/* ---[ End Extra Div 1 ]---------------------------- */
+
+/* ---[ Extra Div 2 ]-------------------------------- */
+
+ #extraDiv2 {
+ position: absolute;
+ top: 125px;
+ left: 105px;
+ width: 30px;
+ height: 30px;
+ background: transparent url('corner1.gif') 0% 0% no-repeat;
+ z-index: 20;
+ }
+
+/* ---[ End Extra Div 2 ]---------------------------- */
+
+/* ---[ Extra Div 3 ]-------------------------------- */
+
+ #extraDiv3 {
+ position: absolute;
+ top: 125px;
+ left: 359px;
+ width: 30px;
+ height: 30px;
+ background: transparent url('corner2.gif') 0% 100% no-repeat;
+ z-index: 20;
+ }
+
+/* ---[ End Extra Div 3 ]---------------------------- */
+
+/* css Zen Garden submission 043 - 'Burning' by Kevin & Ethel Davis, http://etheldavisgallery.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Kevin & Ethel Davis */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without both the designer's and artist's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* CSS by Kevin Davis */
+/* For more work by the author, see http://alazanto.org */
+
+/* Artwork by Ethel Davis */
+/* For more work by the artist, see http://etheldavisgallery.com */
+
+/* have a great day! :) */
+
+
+
+
+/******************************************************************* primary elements */
+body {
+ background: #444 url(body.gif) top left repeat-y;
+ margin: 0px;
+ padding: 0px;
+ text-align: left;
+ color: #fff;
+}
+
+/******************************************************************* primary hyperlink styling */
+#supportingText a:link {
+ font-weight: normal;
+ text-decoration: none;
+ background: transparent;
+ color: #D1E8CC;
+ border-bottom: 1px solid #D1E8CC;
+}
+
+#supportingText a:visited {
+ font-weight: normal;
+ text-decoration: none;
+ background: transparent;
+ color: #BBD9BA;
+ border-bottom: 1px solid #BBD9BA;
+}
+
+#supportingText a:hover, a:active {
+ text-decoration: none;
+ background: transparent;
+ color: #fff;
+ border-bottom: 1px solid #fff;
+}
+
+/***********************************************/
+
+#linkList a:link {
+ font-weight: normal;
+ text-decoration: none;
+ background: transparent;
+ color: #bcf;
+}
+
+#linkList a:visited {
+ font-weight: normal;
+ text-decoration: none;
+ background: transparent;
+ color: #bde;
+}
+
+#linkList a:hover, a:active {
+ text-decoration: underline;
+ background: transparent;
+ color: #fff;
+}
+
+/***********************************************/
+
+#intro #quickSummary a:link {
+ font-weight: normal;
+ text-decoration: none;
+ background: transparent;
+ color: #ccc;
+ border-bottom: 1px solid #555;
+}
+
+#intro #quickSummary a:visited {
+ font-weight: normal;
+ text-decoration: none;
+ background: transparent;
+ color: #ccc;
+ border-bottom: 1px solid #555;
+}
+
+#intro #quickSummary a:hover, a:active {
+ text-decoration: none;
+ background: transparent;
+ color: #fff;
+ border-bottom: 1px solid #555;
+}
+
+/******************************************************************* body content */
+#container {
+ margin-top: 33px;
+ margin-left: 0px;
+ margin-bottom: 0px;
+ margin-right: 0px;
+
+ padding: 1px;
+
+ background: transparent url(container-back.gif) top left no-repeat;
+
+ width: 751px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width:750px;
+}
+
+html>body #container {
+ width: 750px;
+}
+
+#extraDiv1 {
+ position: absolute;
+
+ height: 33px;
+ width: 100%;
+ top: 0px;
+ left: 0px;
+
+ background: transparent url(top-bar.gif) top left repeat-x;
+}
+
+#extraDiv2 {
+ position: relative;
+
+ height: 33px;
+ width: 100%;
+ bottom: 0px;
+ left: 0px;
+
+ background: transparent url(bottom-bar.gif) top left repeat-x;
+}
+
+#extraDiv3 {
+ position: absolute;
+
+ top: 33px;
+ left: 750px;
+ right: 0px;
+
+ color: #fff;
+
+ background: #38332F url(back-top2.gif) top left repeat-y;
+ border-bottom: 2px solid #29281C;
+
+ height: 480px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height:478px;
+}
+
+html>body #extraDiv3 {
+ height: 478px;
+}
+
+ #extraDiv3 span {
+ position: absolute;
+
+ top: 0px;
+ left: 0px;
+ right: 0px;
+
+ margin-bottom: 471px;
+
+ color: #fff;
+
+ background: #38332F url(back-top2-span.gif) top left repeat-x;
+
+ height: 7px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height:7px;
+ }
+
+ html>body #extraDiv3 span {
+ height: 7px;
+ }
+
+#pageHeader {
+ position: absolute;
+ top: 33px;
+ left: 0px;
+
+ width: 0px;
+ hegith: 0px;
+
+ margin: 0px;
+ padding: 0px;
+
+ overflow: hidden;
+ text-indent: -100em;
+}
+
+
+/******************************************************************* intro section */
+#intro {
+ margin-top: 243px;
+ margin-left: 58px;
+ margin-right: 242px;
+ margin-bottom: 0px;
+
+ padding: 15px;
+
+ border-bottom: 1px solid #394A38;
+}
+
+ #intro acronym, #linkList acronym {
+ cursor: help;
+ border: 0px;
+ letter-spacing: 0.1em;
+ }
+
+ #quickSummary p.p2 {
+ position: absolute;
+
+ top: 255px;
+ left: 5px;
+
+ margin: 0px;
+
+ width: 240px;
+
+ padding-top: 0px;
+ padding-left: 0px;
+ padding-bottom: 0px;
+ padding-right: 0px;
+
+ border: 0px solid #333;
+
+ font-family: "Verdana", serif;
+ font-size: 9px;
+ font-weight: normal;
+
+ text-align: right;
+
+ color: #bbb; background: transparent;
+ }
+
+ #intro p {
+ margin-top: 0px;
+ margin-bottom: 8px;
+
+ font-family: "Times", "Times New Roman", Serif;
+ font-size: 14px;
+ font-weight: normal;
+
+ word-spacing: 0.05em;
+ letter-spacing: 0.05em;
+
+ line-height: 1.4em;
+
+ text-align: left;
+
+ color: #fff; background: transparent;
+ }
+
+ /* Thanks Mike! http://phark.typepad.com */
+
+ #intro h3 {
+ width: 100%;
+ height: 30px;
+
+ margin-top: 10px;
+ margin-left: -2px;
+ margin-bottom: 5px;
+ margin-right: 0px;
+
+ padding: 0px;
+
+ color: #fff;
+
+ border-bottom: 1px solid #5F705E;
+
+ background: transparent url(header-enlighten.gif) no-repeat top left;
+ }
+
+ #intro h3 span {display: none;}
+
+/******************************************************************* supportingtext section */
+#supportingText {
+ margin-top: 0px;
+ margin-left: 58px;
+ margin-right: 242px;
+
+ padding: 15px;
+}
+
+ #supportingText acronym {
+ cursor: help;
+ background: transparent url(acronym.gif) top left no-repeat;
+ padding-left: 15px;
+ border-bottom: 0px dotted #fff;
+ }
+
+ #supportingText p {
+ margin-top: 0px;
+ margin-left: 0px;
+ margin-right: 0px;
+ margin-bottom: 8px;
+
+ font-family: "Times", "Times New Roman", Serif;
+ font-size: 14px;
+ font-weight: normal;
+
+ word-spacing: 0.05em;
+ letter-spacing: 0.05em;
+
+ line-height: 1.4em;
+
+ text-align: left;
+
+ color: #fff; background: transparent;
+ }
+
+ #supportingText h3 {
+ width: 100%;
+ height: 30px;
+
+ margin-top: 10px;
+ margin-left: -2px;
+ margin-bottom: 5px;
+ margin-right: 0px;
+
+ border-bottom: 1px solid #5F705E;
+ }
+
+ #supportingText h3 span {display: none;}
+
+ #explanation h3 {
+ background: transparent url(header-sowhat.gif) no-repeat top left;
+ }
+
+ #participation h3 {
+ background: transparent url(header-participation.gif) no-repeat top left;
+ }
+
+ #benefits h3 {
+ background: transparent url(header-benefits.gif) no-repeat top left;
+ }
+
+ #requirements h3 {
+ background: transparent url(header-requirements.gif) no-repeat top left;
+ }
+
+/******************************************************************* footer section */
+#footer {
+ margin-top: 30px;
+ margin-left: 0px;
+ margin-bottom: 0px;
+ margin-right: 0px;
+
+ padding: 6px;
+
+ font-family: "Verdana", serif;
+ font-size: 11px;
+ font-weight: normal;
+ font-style: italic;
+
+ color: #fff;
+
+ text-align: center;
+
+ background-color: #697A68;
+ border: 1px solid #899A88;
+}
+ #footer a:link, #footer a:visited {
+ margin-left: 5px;
+ margin-right: 5px;
+
+ padding-left: 5px;
+ padding-right: 5px;
+
+ border-bottom: 0px;
+
+ border-left: 1px solid #899A88;
+ border-right: 1px solid #899A88;
+ }
+
+/******************************************************************* link list */
+
+#linkList {
+ position: absolute;
+
+ top: 0px;
+ left: 0px;
+
+ margin-top: 276px;
+ margin-left: 509px;
+
+ padding-top: 251px;
+ padding-left: 20px;
+ padding-right: 0px;
+
+ text-align: left;
+
+ background: transparent url(linklist-back.gif) top left no-repeat;
+
+ width: 242px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width:222px;
+}
+
+html>body #linkList {
+ width: 222px;
+}
+
+#lselect, #lfavorites, #larchives, #lresources {
+ margin-top: 0px;
+ margin-left: 0px;
+ margin-bottom: 10px;
+ margin-right: 10px;
+
+ padding: 4px;
+
+ border: double #878BA6;
+ /*background-color: #4A5269;*/
+}
+
+ #linkList h3 {
+ font-family: "Verdana", serif;
+ font-size: 10px;
+ font-weight: normal;
+
+ margin: 0px;
+ padding: 0px;
+
+ border-bottom: 1px solid #878BA6;
+ }
+
+ h3.select {
+ text-align: left;
+
+ width: 100%;
+ height: 14px;
+
+ background: transparent url(header-select.gif) no-repeat top left;
+ }
+ #linkList h3.select span {display:none;}
+
+ h3.favorites {
+ text-align: left;
+
+ width: 100%;
+ height: 14px;
+
+ background: transparent url(header-favorites.gif) no-repeat top left;
+ }
+ #linkList h3.favorites span {display:none;}
+
+ h3.archives {
+ text-align: left;
+
+ width: 100%;
+ height: 14px;
+
+ background: transparent url(header-archives.gif) no-repeat top left;
+ }
+ #linkList h3.archives span {display:none;}
+
+ #larchives ul>li {
+ margin-bottom: 0px;
+ margin-left: -10px;
+ text-align: left;
+
+ padding-left: 9px;
+ padding-bottom: 0px;
+
+ border-left: 1px solid #878BA6;
+ border-right: 1px solid #878BA6;
+ border-bottom: 0px solid #878BA6;
+ }
+
+ #larchives ul>li+li {
+ margin-bottom: 0px;
+ margin-left: -10px;
+ text-align: left;
+
+ padding-left: 9px;
+ padding-bottom: 5px;
+
+ border-left: 1px solid #878BA6;
+ border-right: 1px solid #878BA6;
+ border-bottom: 1px solid #878BA6;
+ }
+
+ #larchives ul>li+li+li {
+ margin-top: 5px;
+ margin-bottom: 0px;
+ margin-left: 0px;
+ text-align: left;
+
+ padding-left: 0px;
+ padding-bottom: 0px;
+
+ border-left: 0px;
+ border-right: 0px;
+ border-bottom: 0px;
+ }
+
+ h3.resources {
+ text-align: left;
+
+ width: 100%;
+ height: 14px;
+
+ background: transparent url(header-resources.gif) no-repeat top left;
+ }
+ #linkList h3.resources span {display:none;}
+
+ #linkList ul {
+ margin-top: 0px;
+ margin-bottom: 20px;
+ margin-left: 10px;
+ margin-right: 0px;
+ padding: 0px;
+ }
+ #linkList li {
+ font-family: "Verdana", serif;
+ font-size: 11px;
+ font-weight: normal;
+
+ color: #fff; background: transparent;
+
+ line-height: 13px;
+
+ list-style-type: none;
+ display: block;
+
+ padding-top: 4px;
+ margin-bottom: 2px;
+ }
+
+ #larchives li {
+ padding-top: 4px;
+ margin-bottom: 0px;
+ }
+
+ #lselect li, #lfavorites li {
+ background: url(docbullet.gif) no-repeat 0px 7px;
+ padding-left: 11px;
+ }
+
+ #lselect a, #lfavorites a { display:block; text-transform:lowercase; }
+ #lselect a.c, #lfavorites a.c {display:inline; text-transform: none; }/* css Zen Garden submission 044 - 'si6' by Shaun Inman, http://www.shauninman.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Shaun Inman */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* Lomo Credit: http://andreas.lunde.info/ | 09.05.03 :: 09.09.03 */ +/* Via: http://sxc.hu/ */
+body { + background: url(bg_top.jpg) no-repeat #FFF; + margin: 0px; + + font: 9px/16px Geneva,Arial,Tahoma,sans-serif; + color: #97999C; + } +p { + position: relative; + top: 0px; + text-align: justify; + + margin: 0px 0px 0px 35px; + padding: 0px 0px 16px 302px; + + width: 573px; /* False value for IE4-5.x/Win */ + voice-family: "\"}\""; + voice-family:inherit; + width: 271px; /* Actual value for conformant browsers */ + } +html>p { + width: 271px; /* Be nice to Opera */ + } +@media ScReEn { /* HIDE THIS NONSENSE FROM SAFARI */ + p span { position: relative; top: -1px; padding-bottom: 2px; } + } +/* MORE NONSENSE JUST FOR IE <SHAKES HEAD /> */ +* html p span { position: relative; top: -1px; } + +p.p1 { background: url(p1.gif) no-repeat; } +p.p2 { background: url(p2.gif) no-repeat; } +p.p3 { background: url(p3.gif) no-repeat; } +p.p4 { background: url(p4.gif) no-repeat; } +p.p5 { background: url(p5.gif) no-repeat; } + +a, +a:visited { + color: #717375; + text-decoration: none; + border-bottom: 2px solid #FFFC00; + } +a:hover { + color: #A1A3A5; + text-decoration: none; + border-bottom: 2px solid #FFFE66; + } + +h3 { + margin: 0px; + padding: 0px; + } + +acronym { + font-style: normal; + text-decoration: none; + border-width: 0px; + } +#container { + width: 744px; + } + +#pageHeader { z-index: 5000; } +#pageHeader h1 { + position: absolute; + top: 84px; + left: 88px; + + background: url(css_zen_garden.gif) no-repeat; + width: 205px; + height: 35px; + + padding: 0px; + margin: 0px; + } +#pageHeader h2 { + position: absolute; + top: 132px; + left: 91px; + + background: url(beauty_of.gif) no-repeat; + width: 149px; + height: 23px; + + padding: 0px; + margin: 0px; + } +#pageHeader h1 span, +#pageHeader h2 span, +#preamble h3 span, +#explanation h3 span, +#participation h3 span, +#benefits h3 span, +#requirements h3 span, +#lselect h3 span, +#lfavorites h3 span, +#larchives h3 span, +#lresources h3 span { display: none; } + +#quickSummary p { color: #828200; } +#quickSummary a, +#quickSummary a:visited { + color: #626200; + text-decoration: none; + border-bottom: 2px solid #979600; + } +#quickSummary a:hover { color: #A2A200; border-bottom: 2px solid #C7C600; } +#quickSummary { margin-top: 144px; width: 608px; } +#quickSummary p.p1 { background: url(p1_on_yellow.gif) no-repeat; } +#quickSummary p.p2 { background: url(p2_on_yellow.gif) no-repeat; padding-bottom: 0px; margin-bottom: 16px; } + +#preamble, +#explanation, +#participation, +#benefits, +#requirements, +#footer { position: relative; } + +#preamble h3 { + position: absolute; + top: -11px; + left: 88px; + + background: url(the_road.gif) no-repeat; + width: 169px; + height: 22px; + } +/* TARGETING IE6 PC, KEEP COMMENT OPEN AS FAR AS IE5 MAC IS CONCERNED \*/ +* html*#preamble h3 { left: 53px; } +/* GOTTA WAKE UP IE5 MAC! */ +#preamble p.p1 { background: url(p1_cropped.gif) no-repeat; } +#preamble p.p2 { background: url(p2_cropped.gif) no-repeat; } +#preamble p.p3 { background: url(p3_unlabeled.gif) no-repeat; padding-bottom: 0px; margin-bottom: 16px; } + +#explanation h3 { + position: absolute; + top: -12px; + left: 89px; + + background: url(so_what.gif) no-repeat; + width: 131px; + height: 23px; + } +/* TARGETING IE6 PC, KEEP COMMENT OPEN AS FAR AS IE5 MAC IS CONCERNED \*/ +* html*#explanation h3 { left: 54px; } +/* GOTTA WAKE UP IE5 MAC! */ +#explanation p.p1 { background: url(p1_unlabeled.gif) no-repeat; } +#explanation p.p2 { padding-bottom: 0px; margin-bottom: 16px; } + +#participation h3 { + position: absolute; + top: -11px; + left: 86px; + + background: url(participation.gif) no-repeat; + width: 131px; + height: 22px; + } +/* TARGETING IE6 PC, KEEP COMMENT OPEN AS FAR AS IE5 MAC IS CONCERNED \*/ +* html*#participation h3 { left: 51px; } +/* GOTTA WAKE UP IE5 MAC! */ +#participation p.p4 { padding-bottom: 0px; margin-bottom: 16px; } + +#benefits h3 { + position: absolute; + top: -11px; + left: 88px; + + background: url(benefits.gif) no-repeat; + width: 131px; + height: 22px; + } +/* TARGETING IE6 PC, KEEP COMMENT OPEN AS FAR AS IE5 MAC IS CONCERNED \*/ +* html*#benefits h3 { left: 53px; } +/* GOTTA WAKE UP IE5 MAC! */ +#benefits p.p1 { padding-bottom: 0px; margin-bottom: 16px; } + +#requirements h3 { + position: absolute; + top: -11px; + left: 89px; + + background: url(requirements.gif) no-repeat; + width: 131px; + height: 22px; + } +/* TARGETING IE6 PC, KEEP COMMENT OPEN AS FAR AS IE5 MAC IS CONCERNED \*/ +* html*#requirements h3 { left: 54px; } +/* GOTTA WAKE UP IE5 MAC! */ +#requirements p.p4 { background: url(p4_on_blue.gif) no-repeat; } +#requirements p.p5 { background: url(p5_unlabeled.gif) no-repeat; padding-bottom: 0px; margin-bottom: 16px; } + +#linkList { + position: absolute; + top: 63px; + left: 626px; + width: 116px; + } +#linkList ul, +#linkList li { + list-style: none; + padding: 0px; + margin: 0px; + line-height: 12px; + } +#linkList a, +#linkList a:visited { color: #5E5F61; border: none; } +#linkList a:hover { color: #C1C3C5; } + +#lselect li, +#lfavorites li { margin-top: 8px; } + +#lselect li a, +#lselect li a:visited, +#lfavorites li a, +#lfavorites li a:visited { display: block; } + +#lselect li a.c, +#lselect li a.c:visited, +#lfavorites li a.c, +#lfavorites li a.c:visited { color: #717375; display: inline; } +#lselect li a.c:hover, +#lfavorites li a.c:hover { color: #C1C3C5; } + +#lselect h3.select { + background: url(select_a_design.gif) no-repeat; + width: 112px; + height: 44px; + } +#lselect ul { margin-top: -1px; } +@media ScReEn { /* HIDE THIS NONSENSE FROM SAFARI */ + #lselect ul { margin-top: -2px; } + } +/* MORE NONSENSE JUST FOR IE <SHAKES HEAD /> */ +* html #lselect ul { margin-top: -2px; } + +#lfavorites h3.favorites { + background: url(favorites.gif) no-repeat; + width: 112px; + height: 44px; + margin-top: 6px; + } +#lfavorites ul { margin-top: -2px; } + +#larchives h3.archives { + background: url(archives.gif) no-repeat; + width: 112px; + height: 44px; + margin-top: 5px; + } +#larchives ul { margin-top: 6px; } + +#lresources h3.resources { + background: url(resources.gif) no-repeat; + width: 112px; + height: 44px; + margin-top: 10px; + } +#lresources ul { margin-top: 6px; } + +#footer { + display: block; + text-align: right; + + padding: 9px 430px 0px 0px; + margin: 0px 0px 36px 35px; + + width: 688px; + voice-family: "\"}\""; + voice-family:inherit; + width: 258px; + } +html>#footer { width: 258px; } +#footer a { padding-bottom: 9px; } +@media ScReEn { /* HIDE THIS NONSENSE FROM SAFARI */ + #footer a { position: relative; top: -1px; } + } +/* MORE NONSENSE JUST FOR IE <SHAKES HEAD /> */ +* html #footer a { position: relative; top: -1px; } + +#footer,#requirements { z-index: 2; } +#extraDiv1 { + position: relative; + height: 1px; + z-index: 1; + } +#extraDiv1 span { + position: absolute; + bottom: -33px; + left: 0px; + background: url(bg_bottom.jpg) no-repeat; + width: 100%; + height: 508px; + } +#extraDiv2, +#extraDiv3, +#extraDiv4, +#extraDiv5, +#extraDiv6 { display: none; } + +/* * { border: 1px solid #DDD; } *//* css Zen Garden submission 045 - 'I Dream in Colour' by Jeff Bilen - http://www.scribblersclub.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Jeff Bilen */
+/* Added: September 26th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+
+body {
+ background: #ffffff url(bottom_right.jpg) bottom right no-repeat;
+ font: 8pt/11pt "Times New Roman", serif, georgia;
+ color: #555753;
+ margin: 0px;
+ padding: 0px;
+}
+
+p {
+ font: 8pt/11pt "Times New Roman", serif, georgia;
+ margin-top: 0px;
+ text-align: left;
+ margin-left: 10px;
+}
+
+acronym {
+ border: none;
+}
+
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #333333;
+}
+
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #555555;
+}
+
+a:hover, a:active {
+ text-decoration: underline;
+ color: #555555;
+}
+
+/* specific divs */
+
+#container {
+ background: transparent url(top_left.jpg) top left no-repeat;
+ padding: 0px;
+ margin: 0px;
+ width: 760px;
+ padding-bottom: 100px;
+}
+
+#intro {
+ background: transparent url(intro_back.jpg) top left no-repeat;
+ margin-top: 133px;
+ width: 253px;
+ float: left;
+}
+
+#pageHeader h1 span {
+ display:none
+}
+
+#pageHeader h2 span {
+ display:none
+}
+
+#quickSummary {
+ width: 210px;
+ margin-left: 15px;
+ margin-top: 20px;
+}
+
+#quickSummary p {
+ font: bold italic 8pt/11pt "Times New Roman", serif, georgia;
+ color: #000000;
+ text-align: center;
+}
+
+#preamble {
+ width: 210px;
+ margin-left: 15px;
+ margin-top: 25px;
+}
+
+#preamble h3 {
+ background: transparent url(en_hdr.gif) top center no-repeat;
+ width: 210px;
+ height: 19px;
+ margin-left: 5px;
+}
+#preamble h3 span {
+ display: none;
+}
+
+#preamble p {
+ padding-left: 5px;
+ font: 8pt/14pt "Times New Roman", serif, georgia;
+}
+
+#supportingText {
+ background: transparent url(main_back.jpg) top left no-repeat;
+ position: relative;
+ margin-left: 258px;
+ top: 58px;
+ width: 376px;
+ padding-left: 25px;
+ padding-top: 25px;
+}
+
+#explanation h3 {
+ background: transparent url(what_hdr.gif) top left no-repeat;
+ height: 11px;
+ text-align: left;
+}
+
+#explanation h3 span {
+ display: none;
+}
+
+#supportingText p {
+ width: 315px;
+ text-align: left;
+}
+
+#explanation h3 {
+ background: transparent url(what_hdr.gif) top left no-repeat;
+ height: 11px;
+}
+
+#explanation {
+ padding-bottom: 10px;
+}
+
+#participation {
+ padding-bottom: 10px;
+}
+
+#benefits {
+ padding-bottom: 10px;
+}
+
+#requirements {
+ padding-bottom: 10px;
+}
+
+#participation h3 {
+ background: transparent url(part_hdr.gif) top left no-repeat;
+ height: 11px;
+}
+
+#participation h3 span {
+ display: none;
+}
+
+#benefits h3 {
+ background: transparent url(ben_hdr.gif) top left no-repeat;
+ height: 11px;
+}
+
+#benefits h3 span {
+ display: none;
+}
+
+#requirements h3 {
+ background: transparent url(req_hdr.gif) top left no-repeat;
+ height: 13px;
+}
+
+#requirements h3 span {
+ display: none;
+}
+
+#footer {
+ text-align: center;
+ border-top: 1px solid #cccccc;
+}
+
+#footer a:link, #footer a:visited {
+ margin-right: 20px;
+}
+
+#linkList {
+ margin-left: 645px;
+ width: 125px;
+ position: absolute;
+ top: 110px;
+}
+
+#linkList ul {
+ margin-left: 10px;
+ padding: 0px;
+}
+
+#lselect h3 {
+ background: transparent url(sel_des.gif) top left no-repeat;
+ height: 21px;
+}
+
+#lselect h3 span {
+ display: none;
+}
+
+#larchives h3 {
+ background: transparent url(archives.gif) top left no-repeat;
+ height: 18px;
+}
+
+#larchives h3 span {
+ display: none;
+}
+
+#lresources h3 {
+ background: transparent url(resource.gif) top left no-repeat;
+ height: 11px;
+}
+
+#lresources h3 span {
+ display: none;
+}
+
+#lfavorites h3 {
+ background: transparent url(favorites.gif) top left no-repeat;
+ height: 21px;
+}
+
+#lfavorites h3 span {
+ display: none;
+}
+
+#linkList li {
+ line-height: 2.5ex;
+ list-style-type: none;
+ padding-top: 5px;
+ margin-bottom: 5px;
+}
+
+#linkList li a:link {
+ color: #555555;
+}
+
+#linkList li a:visited {
+ color: #777777;
+}
+/* css Zen Garden submission 046 - 'sub:lime' by Andy Budd, http://www.andybudd.com/blog/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Andy Budd */
+/* Added: September 29th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+/* CSS Document */ + + +body{ + background: #e3dfdc; + margin: 0px; + padding: 0px; + font: 72%/1.6em Verdana, Arial, Helvetica, sans-serif; + color: #FFFFFF; + text-align: center; +} + +a:link { + color: #5a6635; + text-decoration: none; +} + +a:visited { + color: #5a6635; + text-decoration: none; +} + +a:hover { + color: #2b351c; +} + + +#container { + position: relative; + width: 715px; + margin: 0 auto; + background: #FFFFFF url(container.gif) repeat-y; + padding-right: 25px; + padding-left: 25px; + text-align: left; + voice-family: "\"}\""; + voice-family:inherit; + width: 665px; +} + +html>body #container { + width: 665px; +} + +/* page header stuff */ + +#pageHeader { + margin-bottom: 5px; +} + +#pageHeader h1 { + width: 665px; + height: 38px; + background: url(logo.gif) no-repeat; + margin: 0px; + padding: 0px; +} + +#pageHeader span { + display: none; +} + +#pageHeader h2 { + display: none; +} + +/* quickSummary stuff */ + +#quickSummary { + background: url(limes.gif) no-repeat; + width: 665px; +} + +#quickSummary .p1 { + background: url(callout.gif) no-repeat right; + height: 160px; + margin: 0px; + padding: 0px; +} + +#quickSummary .p1 span { + display: none; +} + + +#quickSummary .p2 { + height: 27px; + background: #97a25e; + margin: 5px 0 5px 0; + padding: 5px 0 0 10px; + vertical-align: bottom; + voice-family: "\"}\""; + voice-family:inherit; + height: 22px; +} + +html>body #quickSummary .p2 { + height: 22px; +} + +/* preamble stuff */ + +#preamble { + margin: 0 0 0 225px; + background: #a5b77a; + padding: 15px; +} + +#preamble h3 { + background: url(enlightenment.gif) no-repeat; + height: 19px; + margin: 0px; + padding: 0px; +} + +#preamble h3 span{ + display: none; +} + + +/* supportingText stuff */ + +#supportingText { + margin: 0 0 0 225px; + background: #a5b77a; + padding: 0 15px 1px 15px; + /* this is wierd. Origionally this div had no bottom padding. + When I positioned the footer absolutly, a gap of about 8px appeared + at the bottom of the page where the bg image of container wasn't getting displayed. + Adding a nominal amount of bottom padding (1px) to supportingText + fixed this problem. However I have no idea why the problem exhibited in the first place + or why this fixed it. */ +} + +#explanation h3 { + background: url(about.gif) no-repeat; + height: 19px; + margin: 0px; + padding: 0px; +} + +#participation h3 { + background: url(participation.gif) no-repeat; + height: 15px; +} + +#benefits h3 { + background: url(benefits.gif) no-repeat; + height: 18px; +} + +#requirements h3 { + background: url(requirements.gif) no-repeat; + height: 15px; +} + +#supportingText h3 span{ + display: none; +} + +#footer /*#requirements .p5*/ { + position: absolute; + margin: 0; + padding: 0; + top: 213px; + right: 35px; + text-align: right; +} + +/* bit of a nasty use of an extraDiv and a bg image +to produce the bottom yellow bar */ +#extraDiv1 { + height: 40px; + width: 715px; + margin: 0 auto; + background: #FFFFFF url(bandwidth.gif); + text-align: left; +} + +/* bit of a hack topositiuon the bandwidth text */ +#requirements .p5 { + position: absolute; + margin: 0; + padding: 0; + bottom: -30px; + left: 35px; + text-align: left; + z-index: 10; +} + +/* linkList stuff */ + +#linkList { + width: 220px; + position: absolute; + top: 240px; + left: 25px; + background: #c5d19b; +} + +#linkList2 { + padding: 15px 10px 10px 10px; +} + +#linkList h3 { + margin: 0px; + padding: 0px; +} + +#linkList h3 span { + display: none; +} + +#linkList ul { + margin: 12px 0 15px 15px; + padding: 0px; +} + + +#linkList li { + list-style: none; + margin: 0; + padding: 0px; +} + +#lselect li { + margin: 0 0 10px 0; +} + +#lselect li a { + display: block; +} + +#lselect li .c { + display: inline; +} + +#lselect h3 { + background: url(select.gif) no-repeat; + height: 22px; +} + +#larchives h3 { + background: url(archive.gif) no-repeat; + height: 15px; +} + +#lresources h3 { + background: url(resources.gif) no-repeat; + height: 14px; +} + + + +/* css Zen Garden submission 047 - 'dusk' by Jon Hicks, http://exp.hicksdesign.co.uk/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Jon Hicks */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+body {
+ background: #fff url(border.gif) repeat-y 20px 0px;
+ margin: 0;
+ padding: 0;
+ font: 10px/1.4em Arial, Helvetica, sans-serif;
+ color: #666;
+ letter-spacing: 0.01em;
+}
+p {
+ margin: 0 0 0.5em 0;
+}
+
+ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+a,
+a:link
+a:active {
+ color: #690;
+ text-decoration:none;
+}
+
+a:visited {
+ color: #666;
+}
+
+a:hover {
+ background-color: #690;
+ color: #fff;
+}
+
+
+/* main divs - in order of appearance */
+/* ------------------------------------------------------------ */
+
+/* big grey stripe */
+#extraDiv1 {
+ background: #666 url(end_block.gif) no-repeat right top;
+ position: absolute;
+ left: 10px;
+ top: 30px;
+ width: 780px;
+ height: 230px;
+ z-index: 1;
+}
+
+/* top left corner image of big grey stripe */
+#extraDiv1 span{
+ display: block;
+ background: url(corner.gif) no-repeat left top;
+ width: 360px;
+ height: 60px;
+}
+
+#container {
+ margin-left: 358px;
+ margin-top: 260px;
+ width: 550px;
+ }
+
+#pageHeader {
+ background: transparent url(logo.gif) no-repeat left top;
+ position: absolute;
+ left: 10px;
+ top: 137px;
+ height: 229px;
+ width: 730px;
+ text-indent: -1000em;
+ z-index: 2;
+}
+
+#preamble {
+ color: #eee;
+ position: absolute;
+ height: 190px;
+ width: 380px;
+ left: 357px;
+ top: 70px;
+ padding-right: 20px;
+ z-index: 2;
+ overflow: auto;
+}
+#preamble h3 {
+ background: url(road.gif) no-repeat left top;
+ height: 19px;
+ width: 216px;
+ margin: 0 0 8px 0;
+ }
+
+#preamble h3 span {
+ display: none;
+ }
+
+#quickSummary {
+ position: absolute;
+ left: 52px;
+ top: 365px;
+ height: 200px;
+ width: 230px;
+ color: #666;
+ z-index: 2;
+ line-height: 2em;
+}
+
+#quickSummary p.p2{
+ padding-top: 10px;
+}
+
+
+/* This is the bit that screws up in Opera 6 */
+
+#supportingText {
+ width: 375px;
+ height: 150px;
+ overflow: auto;
+ padding: 0 20px 30px 5px;
+ z-index: 10;
+ border-left: solid 1px #999;
+}
+
+#supportingText h3 {
+ font-size: 13px;
+ color: #7fbb09;
+ border-bottom: 1px solid #ccc;
+ margin: 1.6em 0 0.8em 0;
+}
+#supportingText h3 span {
+ border-bottom: 5px solid #ccc;
+}
+
+#footer {
+ padding-bottom: 10px;
+ padding-top: 10px;
+}
+
+
+/* links lists */
+#linkList {
+ width: 550px;
+}
+
+#linkList li{
+ padding-left: 2px;
+}
+#linkList h3 {
+ text-indent: -1000em;
+ margin-bottom: 3px;
+ width: 116px;
+ height: 18px;
+}
+
+/* links titles */
+h3.select {background: url(select.gif) no-repeat left top;}
+h3.archives {background: url(archives.gif) no-repeat left top;}
+h3.favourites {background: url(favourites.gif) no-repeat left top;}
+h3.resources {background: url(resources.gif) no-repeat left top;}
+
+
+
+div#lselect,
+div#lfavorites,
+div#larchives,
+div#lresources {
+ float: left;
+ border-left: solid 1px #999;
+ margin-right: 20px;
+ padding-top: 20px;
+}
+/* css Zen Garden submission 048 - 'HoriZental' by Clément 'fastclemmy' Hardouin, http://www.fastclemmy.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Clément Hardouin */
+/* Added: October 18th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+background-image:url("fond_body.gif");
+background-repeat:repeat-x;
+background-position:top left;
+background-color:#fff;
+color:#666;
+font-family:Trebuchet MS,Verdana,Arial,Helvetica,sans-serif;
+margin:0;
+padding:0;
+height:550px;
+width:4000px;
+}
+
+html > body {
+border-bottom:1px solid black;
+}
+
+h1, h2, h3, h4 {
+margin:0;
+padding:0;
+}
+
+div#intro {
+background-image:url("header.jpg");
+background-repeat:no-repeat;
+background-position:left top;
+height:550px;
+}
+
+div#intro p {
+width:350px;
+}
+
+h1 span, h3 span, #extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
+display:none;
+}
+
+#explanation h3 span, #preamble h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span {
+display:block;
+font-family:Century Gothic, AvantGarde, Verdana, Arial, sans-serif;
+font-weight:normal;
+font-size:1.5em;
+color:#c9380b;
+}
+
+h2 {
+color:#ccc;
+padding-top:325px;
+font-size:0.8em;
+font-weight:normal;
+letter-spacing:0.4em;
+padding-left:3em;
+}
+
+div#quickSummary {
+margin-left:0.8em;
+}
+
+div#quickSummary a, div#footer a, p a {
+color:#c9380b;
+text-decoration:none;
+font-weight:bold;
+}
+
+div#quickSummary a:hover, p a:hover, div#footer a:hover {
+text-decoration:underline;
+}
+
+div#linkList2, div#lresources {
+background-image:url("fond_bande_milieu.gif");
+background-repeat:repeat-y;
+width:255px;
+height:550px;
+position:absolute;
+top:0px;
+left:375px;
+}
+
+div#lresources {
+background-image:url("fond_bande_droite.gif");
+width:298px;
+left:3200px;
+}
+
+h3.select {
+background-image:url("selectadesign.gif");
+background-repeat:no-repeat;
+width:255px;
+height:145px;
+}
+
+h3.resources {
+background-image:url("browseresources.gif");
+background-repeat:no-repeat;
+width:298px;
+height:138px;
+}
+
+div#lselect ul, div#larchives ul, div#lresources ul {
+color:#000;
+font-size:0.9em;
+margin:0px;
+padding:0px;
+width:90%;
+padding-left:35px;
+}
+
+div#lresources ul {
+padding-left:50px;
+}
+
+div#lselect li, div#larchives li, div#lresources li {
+background-image: url("puce_blanche.gif");
+background-repeat: no-repeat;
+background-position: left center;
+list-style-type: none;
+margin: 0px 0px 0px 0px;
+padding: 0px 0px 0px 15px;
+width: 90%;
+font-size:0.8em;
+}
+
+div#lselect a, div#larchives a, div#lresources a {
+color:#666;
+text-decoration:none;
+font-weight:bold;
+}
+
+div#lselect a.c {
+color:#fff;
+font-weight:normal;
+}
+
+div#lselect a:hover, div#larchives a:hover, div#lresources a:hover {
+text-decoration:underline;
+}
+
+h3.archives {
+margin-top:70px;
+background-image:url("viewarchives.gif");
+background-repeat:no-repeat;
+width:255px;
+height:100px;
+}
+
+div#preamble, div#explanation, div#participation, div#benefits, div#requirements {
+position:absolute;
+background-repeat:no-repeat;
+top:0px;
+font-size:75%;
+height:550px;
+}
+
+div#preamble {
+left:628px;
+background-image:url("theroad.jpg");
+width:379px;
+}
+
+div#preamble h3, div#requirements h3, div#participation h3 {
+padding-top:280px;
+}
+
+div#preamble p, div#requirements p, div#participation p, div#explanation p, div#benefits p, div#preamble h3, div#requirements h3, div#participation h3, div#explanation h3, div#benefits h3, div#requirements p, div#requirements h3 {
+padding-left:8px;
+padding-right:8px;
+text-align:justify;
+}
+
+div#explanation {
+left:1007px;
+background-image:url("sowhat.jpg");
+width:398px;
+}
+
+div#explanation h3, div#benefits h3 {
+padding-top:15px;
+}
+
+div#participation {
+left:1405px;
+background-image:url("participation.jpg");
+width:656px;
+}
+
+div#benefits {
+left:2061px;
+background-image:url("benefits.jpg");
+width:390px;
+}
+
+div#requirements {
+left:2451px;
+width:1050px;
+}
+
+div#footer {
+position:absolute;
+top:470px;
+left:0.8em;
+}
+
+div#footer a:before {
+content: url("puce_rouge.gif");
+}
+
+p {
+font-size:0.9em;
+}
+
+#requirements .p5 {
+margin-top:15px;
+color:#ccc;
+}/* css Zen Garden default style - 'Tranquille' by Dave Shea - http://www.mezzoblue.com/ */
+/* css released under Zen Garden License - http://www.mezzoblue.com/zengarden/license/ */
+/* All associated graphics copyright 2003, Dave Shea */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* Please view the Zen Garden License for more information. http://www.mezzoblue.com/zengarden/license/ */
+
+
+/* The Zen Garden default was the first I put together, and almost didn't make the cut. I briefly flirted with using
+ 'Salmon Cream Cheese' as the main style for the Garden, but switched back to this one before launch.
+
+ All graphics in this design were illustrated by me in Photoshop. Google Image Search provided inspiration for
+ some of the elements. I did a bit of research on Kanji to come up with the characters on the top left. Anyone who
+ can read that will most likely tell you it makes no sense, but the best I could do was putting together the
+ characters for 'beginning' 'complete' and 'skill' to roughly say something like 'we're breaking fresh ground.'
+
+ It's a stretch. */
+
+
+/* basic elements */
+
+ html {
+ margin: 0px;
+ padding: 0px;
+ }
+ body {
+ font: 11px/14px Verdana, Geneva, Arial, Helvetica, sans-serif;
+ color: #999;
+ margin: 0px;
+ padding: 0px;
+ text-align: left;
+ background: #fff url(bg.gif) repeat-y;
+ }
+ p {
+ font: 11px/14px Verdana, Geneva, Arial, Helvetica, sans-serif;
+ margin: 0px;
+ margin-top: 10px;
+ padding:0px;
+ }
+ a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #FFCC00;
+ }
+ a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #666;
+ }
+ a:hover, a:active {
+ text-decoration: none;
+ color: #666;
+ }
+ acronym {
+ border-bottom: none;
+ }
+ /* specific divs */
+ #container {
+ padding: 0px;
+ margin: 0px;
+ }
+ #intro{
+ width: 760px;
+ position:absolute;
+ top:0px;
+ left:0px;
+ }
+ #intro{
+ width: 760px;
+ }
+ #pageHeader {
+ background: transparent url(headerbg2.gif) no-repeat top left;
+ height: 83px;
+ }
+
+ #pageHeader h1 {
+ background: transparent url(title.gif) no-repeat top left;
+ margin: 0px;
+ width: 760px;
+ height: 43px;
+ }
+ #pageHeader h1 span {
+ display:none
+ }
+ #pageHeader h2 {
+ background: transparent url(sub.gif) no-repeat top right;
+ width: 760px;
+ height: 42px;
+ margin: 0px;
+ padding:0px;
+ }
+ #pageHeader h2 span {
+ display:none
+ }
+ #quickSummary p.p1{
+ margin:0px;
+ margin-left: 199px;
+ padding: 20px;
+ text-align:justify;
+ background: transparent url(hordot.gif) repeat-x bottom;
+ }
+ #quickSummary p.p2{
+ margin:0px;
+ margin-left: 199px;
+ padding: 20px;
+ width: 520px;
+ background: transparent url(hordot.gif) repeat-x bottom;
+ }
+ #preamble{
+ margin-left: 199px;
+ padding-left: 20px ;
+ padding-right: 20px;
+ padding-bottom: 4px;
+ width: 520px;
+ background:transparent url(hordot.gif) repeat-x bottom;
+ }
+ #supportingText {
+ position: absolute;
+ top:390px;
+ left: 199px;
+ width: 560px;
+ padding-bottom: 20px;
+ }
+ #preamble h3, #explanation h3, #participation h3, #benefits h3, #requirements h3{
+ margin:20px 0px 10px 0px;
+ width:200px;
+ height:19px;
+ }
+ #preamble h3{
+ background: transparent url(preh3.gif) no-repeat top left;
+ }
+ #explanation h3{
+ background: transparent url(exph3.gif) no-repeat top left;
+ }
+ #participation h3{
+ background: transparent url(parth3.gif) no-repeat top left;
+ }
+ #benefits h3, #requirements h3{
+ background: transparent url(benh3.gif) no-repeat top left;
+ }
+ #requirements h3{
+ background: transparent url(reqh3.gif) no-repeat top left;
+ }
+
+ #preamble h3 span, #explanation h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span, #lselect h3 span, #lfavorites h3 span, #larchives h3 span, #lresources h3 span{
+ display:none;
+ }
+ #preamble p.p3, #explanation p.p2, #participation p.p4, #benefits p.p1, #requirements p.p5 {
+ padding-bottom: 20px;
+ margin:0px;
+ }
+ #preamble, #explanation, #participation, #benefits, #requirements {
+ padding-left: 20px ;
+ padding-right: 20px;
+ padding-bottom: 4px;
+ background:transparent url(hordot.gif) repeat-x bottom;
+ }
+ #linkList{
+ position: absolute;
+ top:260px;
+ left: 0px;
+ padding:0px;
+ margin:0px;
+ width: 180px;
+ }
+ #lselect h3{
+ padding:0px;
+ margin:0px;
+ width:199px;
+ height:21px;
+ }
+ #lfavorites h3, #larchives h3, #lresources h3{
+ padding:0px;
+ margin:0px;
+ width:199px;
+ height:21px;
+ }
+ #lselect h3{
+ background: transparent url(select.gif) no-repeat top left;
+ }
+ #lfavorites h3{
+ background: transparent url(fav.gif) no-repeat top left;
+ }
+ #larchives h3{
+ background: transparent url(arc.gif) no-repeat top left;
+ }
+ #lresources h3{
+ background: transparent url(res.gif) no-repeat top left;
+ }
+ #lselect ul, #lfavorites ul, #larchives ul, #lresources ul{
+ margin: 0;
+ padding: 0;
+ margin-top:20px;
+ margin-bottom: 20px;
+ list-style-type: none;
+ }
+
+ #lselect li, #lfavorites li, #larchives li, #lresources li
+ {
+ padding-left: 12px;
+ margin-top: 10px;
+ margin-bottom: 10px;
+ }
+ #lselect a, #lfavorites a
+ {
+ background: transparent url(bul2.gif) no-repeat 0px 2px;
+ padding-left:18px;
+ display:block;
+ }
+ #lselect a:hover, #lfavorites a:hover
+ {
+ background: transparent url(bul1.gif) no-repeat 0px 2px;
+ padding-left:18px;
+ display:block;
+ }
+ #lselect a.c, #lfavorites a.c
+ {
+ font: 11px/14px Verdana, Geneva, Arial, Helvetica, sans-serif;
+ color: #999;
+ font-weight: normal;
+ text-decoration:none;
+ background: transparent;
+ padding-left:0px;
+ display:inline;
+ }
+ #lselect a.c:hover, #lfavorites a.c:hover
+ {
+ background: transparent;
+ padding-left:0px;
+ display:inline;
+ }
+ #footer{
+ width: 520px;
+ padding-left: 20px ;
+ padding-right: 20px;
+ padding-bottom: 4px;
+ background: #efefef url(hordot.gif) repeat-x bottom;;
+ }
+ #extraDiv1{
+ width:196px;
+ height:177px;
+ top: 63px;
+ left:1px;
+ position:absolute;
+ background: transparent url(buda.jpg) no-repeat;
+ }
+
+/* css Zen Garden submission 050 - 'First Summary' by Cornelia Lange, http://www.clkm.de/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Cornelia Lange */
+/* Added: October 17th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
/* elements */ +body { +color: #000; +background: #545D64; +font: 90% Verdana, Arial, Helvetica, sans-serif; +text-align: center; +} +body, html, h1, h2, h3, p, ul, li, div, span { +margin: 0; +padding: 0; +} +a { +color: #fff; +font-weight: normal; +background: transparent; +} +a:visited { +color: #000; +background: transparent; +} +a:hover { +text-decoration: underline; +color: #900; +background: transparent; +} +ul, li { +display: block; +list-style: none; +} +a acronym { +border: 0 none; +} + +/* divs and related classes */ + +#container { +position: relative; +display: block; +width: 737px; +margin: 30px auto 0 auto; +text-align: left; +color: #000; +background: transparent url(zengarden.jpg) top left no-repeat; +border-left: 1px solid #545D64; +} +#intro { +padding-top: 330px; +} +#pageHeader h1 { +display: none; +} +#pageHeader h2 { +display: none; +} + +#quickSummary { +position: absolute; +top: 0; +left: 560px; +display: block; +width: 180px; +height: 330px; +color: #000; +background: transparent; +} +#quickSummary p { +font-size: .78em; +width: 120px; +} +#quickSummary .p1 { +display: none; +} +#quickSummary .p2 { +position: absolute; +top: 230px; +left: -330px; +display: block; +width: 90px; +font-family: Arial, Helvetica, sans-serif; +} + +#preamble { +display: block; +width: 626px; +margin-left: 110px; +color: #fff; +background: #B5BB7D url(enlightenment_default.gif) 100% 3em no-repeat; +} +#preamble h3 { +display: none; +} +#preamble p { +font-size: 0.8em; +line-height: 140%; +width: 440px; +color: #000; +background: #B5BB7D; +} +#preamble .p1, #preamble .p2, #preamble .p3 { +width: 290px; +margin: 0 0 0 110px; +padding: 10px 20px 5px 20px; +color: #fff; +background: #537E53; +} +#preamble .p1 { +padding-top: 4em; +} +#preamble .p2 { +margin-top: -2px; +} +#preamble .p3 { +margin-top: -2px; +padding-bottom: 20px; +} + +#supportingText { +display: block; +width: 736px; +color: #000; +background: #B5BB7D url(main_bg.gif); +border-bottom: 20px solid #B62814; +} +#explanation, #participation, #benefits, #requirements { +margin-left: 110px; +width: 626px; +} +#explanation { +color: #000; +background: #FFFFCD url(about.gif) 100% 20px no-repeat; +} +#participation { +color: #000; +background: #FAC46C url(participation.gif) 100% 20px no-repeat; +} +#benefits { +color: #000; +background: #FFFFCD url(benefits.gif) 100% 20px no-repeat; +} +#requirements { +color: #000; +background: #FAC46C url(requirements.gif) 100% 20px no-repeat; +} +#explanation p, #benefits p, #requirements p, #participation p { +width: 440px; +font-size: 0.8em; +line-height: 140%; +} + +#explanation h3 { +display: none; +} +#explanation p { +color: #000; +background: #FAC46C; +} +#explanation .p1 { +border-top: 4px solid #B52814; +width: 340px; +padding: 25px 20px 5px 80px; +} +#explanation .p2 { +width: 340px; +padding: 10px 20px 20px 80px; +margin-top: -2px; +} + +#participation h3 span { +display: none; +} +#participation p { +color: #000; +background: #B5BB7D; +} +#participation .p1 { +width: 340px; +padding: 25px 20px 5px 80px; +} +#participation .p2 { +width: 340px; +padding: 10px 20px 5px 80px; +margin-top: -2px; +} +#participation .p3 { +width: 340px; +padding: 10px 20px 5px 80px; +margin-top: -2px; +} +#participation .p4 { +width: 340px; +padding: 10px 20px 20px 80px; +margin-top: -2px; +} + +#benefits h3 { +display: none; +} +#benefits p { +color: #000; +background: #FAC46C; +} +#benefits .p1 { +width: 340px; +padding: 25px 20px 20px 80px; +} + +#requirements h3 { +display: none; +} +#requirements p { +color: #000; +background: #B5BB7D; +} +#requirements .p1 { +width: 340px; +padding: 25px 20px 5px 80px; +} +#requirements .p2 { +width: 340px; +padding: 10px 20px 5px 80px; +margin-top: -2px; +} +#requirements .p3 { +width: 340px; +padding: 10px 20px 5px 80px; +margin-top: -2px; +} +#requirements .p4 { +width: 340px; +padding: 10px 20px 5px 80px; +margin-top: -2px; +} +#requirements .p5 { +width: 340px; +padding: 10px 20px 20px 80px; +margin-top: -2px; +} + +/* The Tan-Hack for IE 5.0 */ + +* html #preamble .p1, * html #preamble .p2, * html #preamble .p3 { +width: 330px; +w\idth: 290px; +} + +* html #supportingText .p1, * html #supportingText .p2, * html #supportingText .p3, * html #supportingText .p4, * html #supportingText .p5 { +width: 440px; +w\idth: 340px; +} + +#footer { +position: absolute; +top: 115px; +left: 115px; +display: block; +height: 110px; +width: 110px; +margin: 0; +padding: 0; +} +#footer a { +font: 0.78em Arial, Helvetica, sans-serif; +} +#footer a:link, #footer a:visited { +color: #fff; +background: transparent; +} +#footer a:hover, #footer a:active { +color: #f60; +background: transparent; +} + +/* left Menu */ +#linkList2 { +display: block; +position: absolute; +top: 330px; +left: 0; +text-align: left; +} + +#lselect { +position: relative; +top: 0; +left: 0; +color: #000; +background: #D28B6B; +width: 110px; +text-align: center; +} +#lselect h3 { +display: none; +} +#lselect ul { +list-style: none; +margin: 0; +padding: 0 0 10px 0; +} +#lselect li { +display: block; +width: 100px; +background: transparent; +margin: 0 5px; +padding: 5px 0 5px 0; +font-size: 0.78em; +} +#lselect a { +display: block; +width: 100px; +color: #fff; +background: #D28B6B url(anim.gif) bottom center no-repeat; +margin: 0 0 5px 0; +padding-bottom: 10px; +text-decoration: none; +} +#lselect a:link, #lselect a:visited { +color: #fff; +background: #D28B6B url(punkte.gif) bottom center no-repeat; +} +#lselect a:hover, #lselect a:active { +color: #fff; +background: #D28B6B url(anim.gif) bottom center no-repeat; +text-decoration: underline; +} +#lselect a.c, #lselect a:link.c , #lselect a:visited.c{ +color: #000; +background: transparent; +display: inline; +} +#lselect a:hover.c, #lselect a:active.c { +display: inline; +} + +#lfavorites { +position: relative; +top: 10px; +left: 0; +width: 110px; +color: #000; +background: #D28B6B url(favorites.gif) top left no-repeat; +text-align: center; +} +#lfavorites h3 { +display: none; +} +#lfavorites ul { +list-style: none; +margin: 0; +padding: 30px 0 10px 0; +} +#lfavorites li { +display: block; +width: 100px; +background: transparent; +margin: 0 5px; +padding: 5px 0 5px 0; +font-size: 0.78em; +} +#lfavorites a { +color: #fff; +background: #D28B6B url(anim.gif) bottom center no-repeat; +margin: 0 0 5px 0; +display: block; +width: 100px; +padding-bottom: 10px; +text-decoration: none; +} +#lfavorites a:link, #lfavorites a:visited { +color: #fff; +background: #D28B6B url(punkte.gif) bottom center no-repeat; +} +#lfavorites a:hover, #lfavorites a:active { +color: #fff; +background: #D28B6B url(anim.gif) bottom center no-repeat; +text-decoration: underline; +} +#lfavorites a.c, #lfavorites a:link.c , #lfavorites a:visited.c{ +color: #000; +background: transparent; +display: inline; +} +#lfavorites a:hover.c, #lfavorites a:active.c { +display: inline; +} + +#larchives { +position: relative; +left: 0; +top: 10px; +display: block; +width: 7.65em; +height: 7.65em; +color: #fff; +background: transparent url(archives3.gif) top left no-repeat; +} +#larchives h3 { +display: none; +} +#larchives h3 span { +display: none; +} +#larchives ul { +list-style: none; +margin: 0; +padding: 40px 0 0 0; +} +#larchives li { +display: inline; +font-size: 0.78em; +padding: 0; +margin: 0; +} +#larchives a { +display: block; +color: #fff; +background: transparent url(point.gif) left no-repeat; +text-decoration: none; +padding-left: 10px; +margin-left: 5px; +} +#larchives a .accesskey { +color: #fff; +background: transparent; +} + +#lresources { +position: absolute; +top: 0; +left: 110px; +color: #fff; +background: #B62814; +display: block; +width: 626px; +height: 1.3em; +padding: 1px 0; +} +#lresources h3 { +display: none; +} +#lresources ul { +list-style: none; +margin: 0 0 0 5px; +padding: 0; +display: inline; +} +#lresources li { +display: inline; +font-size: 0.78em; +} +#lresources a { +font-size: 0.80em; +padding: 0 5px 0 8px; +color: #fff; +background: transparent url(pointanim.gif) left no-repeat; +text-decoration: none; +} +#lresources a:link, #lresources a:visited { +color: #fff; +background: transparent url(point.gif) left no-repeat; +} +#lresources a:hover, #lresources a:active { +color: #fff; +background: transparent url(pointanim.gif) left no-repeat; +} + + + + + +/* css Zen Garden submission 051 - 'Commercial Drive' by Wendy Foster, http://www.transgression.ca/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Wendy Foster */
+/* Added: October 29th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+/* Support the Open Source Initiative - http://www.opensource.org/ */
+
+
+
+/* basic elements */
+
+body {
+ background: #79000E url("girl.jpg") no-repeat fixed top left;
+ font: 10px verdana, sans-serif;
+ color: #000000;
+ margin: 0px 0px 0px 0px;
+ }
+
+p {
+ font: 10px verdana, sans-serif;
+ margin-top: 0px;
+ text-align: justify;
+
+ }
+
+/* font resizing hack. Allows for an absolute value to be specified in the main p tag, as well as resolves resizing and rendering issues cross-browser. For a detailed explanation see: Mark Pilgrim's "Relative Font Sizing HOWTO : http://diveintoaccessibility.org/examples/fontsize.html */
+
+/*/*/a{}
+body,
+body p {
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body,
+html>body p {
+ font-size: small;
+}
+/* */
+
+h3 {
+ font: 10px verdana, sans-serif;
+ letter-spacing: 1px;
+ margin-bottom: 0px;
+ background: none;
+ color: #7D775C;
+ }
+
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ background:none;
+ color: #79000e;
+ cursor: help;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ background: none;
+ color: #7099A6;
+ cursor: help;
+ }
+
+a:active {
+ font-weight:bold;
+ text-decoration: none;
+ background: none;
+ color: #5f3a79;
+ cursor: help;
+ }
+
+a:hover {
+ font-weight: bold;
+ text-decoration: none;
+ border: 1px solid #000000;
+ background: #c2c4c6;
+ color:#003058;
+ cursor: help;
+ }
+
+/* specific divs */
+#container {
+ background: #CED41E;
+ color: #000000;
+ padding: 5px 5px 5px 5px;
+ margin: 0px;
+ width:300px;
+ position:absolute;
+ top:0px;
+ left:493px;
+ border-right: 5px solid #000000;
+ border-left: 5px solid #000000;
+ }
+
+#intro {
+ min-width: 300px;
+ }
+#pageHeader {
+ margin-bottom: 20px;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ background: transparent url("garden.gif") no-repeat top left;
+ color:#000000;
+ width: 250px;
+ height: 80px;
+ }
+#pageHeader h1 span {
+ display:none
+ }
+#pageHeader h2 {
+ background: transparent url("design.gif") no-repeat top left;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ position:absolute;
+ left:35px;
+ top:82px;
+ }
+#pageHeader h2 span {
+ display:none;
+ }
+
+#quickSummary {
+ clear:both;
+ margin: 20px 20px 10px 10px;
+ padding:20px 5px 5px 5px;
+ width: 250px;
+ background: #d6d894 url("summarybg.gif");
+ color: #000000;
+ border-right: 5px solid #000000;
+ border-left: 5px solid #000000;
+ border-bottom: 5px solid #000000;
+ }
+#quickSummary p {
+ font: 10px verdana, sans-serif;
+ text-align:center;
+ }
+
+/*/*/a{}
+body #quickSummary p {
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #quickSummary,
+html>body #quickSummary p {
+ font-size: small;
+}
+/* */
+
+#preamble {
+ padding:5px 5px 5px 5px;
+ }
+#preamble h3 {
+ background: transparent url("enlightenment.gif") no-repeat top left;
+ text-align:center;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ }
+#preamble h3 span {
+ display:none;
+ }
+
+#supportingText {
+ padding:5px 5px 5px 5px;
+ margin-bottom: 20px;
+ }
+
+#explanation h3 {
+ background: transparent url("about.gif") no-repeat top left;
+ text-align:center;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ }
+#explanation h3 span {
+ display:none;
+ }
+
+#participation h3 {
+ background: transparent url("participation.gif") no-repeat top left;
+ text-align:center;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ }
+#participation h3 span {
+ display:none;
+ }
+
+#benefits h3 {
+ background: transparent url("benefits.gif") no-repeat top left;
+ text-align:center;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ }
+#benefits h3 span {
+ display:none;
+ }
+
+#requirements h3 {
+ background: transparent url("requirements.gif") no-repeat top left;
+ text-align:center;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ }
+#requirements h3 span {
+ display:none;
+ }
+
+#favorites h3 {
+ background: transparent url("favorites.gif") no-repeat top left;
+ text-align:center;
+ color:#000000;
+ width: 250px;
+ height: 25px;
+ }
+#favorites h3 span {
+ display:none;
+ }
+
+#footer {
+ text-align: center;
+ padding: 5px 5px 5px 5px;
+ border-left: 5px solid #000000;
+ border-right: 5px solid #000000;
+ border-bottom: 5px solid #000000;
+ background:#D9DE4B url("footerbg.gif");
+ color:#000000;
+ }
+#footer a:link, #footer a:visited {
+ margin-right: 20px;
+ }
+
+#linkList2 {
+ background:#CED41E url("linklistbg.gif");
+ color:#000000;
+ font: 10px verdana, sans-serif;
+ padding: 5px 5px 5px 5px;
+ border-top: 5px solid #000000;
+ border-bottom: 5px solid #000000;
+ position:absolute;
+ top:27px;
+ left:-230px;
+ height:125px;
+ width:220px;
+ overflow:auto;
+ }
+
+/*/*/a{}
+body #linkList2 {
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList2
+ {
+ font-size: small;
+}
+/* */
+
+#linkList h3.select {
+ background: transparent url(select.gif) no-repeat top left;
+ color:#000000;
+ margin: 10px 0px 5px 0px;
+ width: 100px;
+ height: 20px;
+ }
+#linkList h3.select span {
+ display:none
+ }
+#linkList h3.favorites {
+ background: transparent url(favorites.gif) no-repeat top left;
+ color:#000000;
+ margin: 25px 0px 5px 0px;
+ width: 100px;
+ height: 20px;
+ }
+#linkList h3.favorites span {
+ display:none
+ }
+#linkList h3.archives {
+ background: transparent url(archives.gif) no-repeat top left;
+ color:#000000;
+ margin: 25px 0px 5px 0px;
+ width:100px;
+ height: 20px;
+ }
+#linkList h3.archives span {
+ display:none
+ }
+#linkList h3.resources {
+ background: transparent url(resources.gif) no-repeat top left;
+ color:#000000;
+ margin: 25px 0px 5px 0px;
+ width:100px;
+ height: 20px;
+ }
+#linkList h3.resources span {
+ display:none
+ }
+
+#linkList ul {
+ font:10px verdana, sans-serif;
+ margin: 0px;
+ padding-left: 15px;
+ list-style-type: circle;
+ list-style-image: url("bullet.gif");
+ }
+
+/*/*/a{}
+body #linkList ul {
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList ul
+ {
+ font-size: small;
+}
+/* */
+
+#linkList li {
+ font: 10px verdana, sans-serif;
+ padding-top: 5px;
+ margin-bottom: 5px;
+ }
+
+/*/*/a{}
+body #linkList li {
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList li
+ {
+ font-size: small;
+}
+/* */
+
+#linkList li a:link {
+ font: 10px verdana, sans-serif;
+ font-weight:bold;
+ background:none;
+ color: #79000e;
+ text-decoration:none;
+ cursor: help;
+ }
+
+/*/*/a{}
+body #linkList li a:link{
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList li a:link
+ {
+ font-size: small;
+}
+/* */
+
+#linkList li a:visited {
+ font: 10px verdana, sans-serif;
+ font-weight:bold;
+ background:none;
+ color: #7099A6;
+ text-decoration:none;
+ cursor: help;
+ }
+
+/*/*/a{}
+body #linkList li a:visited{
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList li a:visited
+ {
+ font-size: small;
+}
+/* */
+
+#linkList li a:active {
+ font: 10px verdana, sans-serif;
+ font-weight:bold;
+ background:none;
+ color: #5f3a79;
+ text-decoration:none;
+ cursor: help;
+ }
+
+/*/*/a{}
+body #linkList li a:active{
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList li a:active
+ {
+ font-size: small;
+}
+/* */
+
+#linkList li a:hover {
+ font: 10px verdana, sans-serif;
+ font-weight:bold;
+ border: 1px solid #000000;
+ background: #c2c4c6;
+ color:#003058;
+ text-decoration:none;
+ cursor: help;
+ }
+
+/*/*/a{}
+body #linkList li a:hover{
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+html>body #linkList li a:hover
+ {
+ font-size: small;
+}
+/* */ /* css Zen Garden submission 052 - 'Postage Paid' by Mike Stenhouse, http://www.donotremove.co.uk */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Mike Stenhouse */
+/* Added: October 29th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+html {
+ background-color: #BDB7BD;
+ color: black;
+}
+body {
+ margin:0 0 0 0;
+ padding:0 0 0 0;
+
+ font-family:arial, helvetica, sans-serif;
+ font-size:11px;
+ letter-spacing:0.01em;
+
+ color:black;
+
+ /*overflow: hidden;*/ /* hack to stop IE/Mac adding masses of space under the page - caused by IE/Mac rendering space for the invisible content of overflow:auto */
+}
+p {
+ margin:0;
+ padding-top:0;
+ padding-bottom:11px;
+ line-height:130%;
+}
+acronym {
+ text-decoration:none;
+ font-style: none;
+ border-bottom:0px dotted black;
+}
+
+/* LINK STYLES */
+ a,
+ a:link
+ a:active {
+ color:black;
+ background-color:white;
+ text-decoration:none;
+ font-weight:normal;
+ }
+ a:visited {
+ color:#666;
+ }
+ a:hover {
+ background-color:black;
+ color:white;
+ }
+
+ div#intro a,
+ div#intro a:link
+ div#intro a:active {
+ color:black;
+ text-decoration:none;
+ font-weight:normal;
+ }
+ div#intro a:visited {
+ color:#666;
+ }
+ div#intro a:hover {
+ background-color:#FE7996;
+ color: white;
+ }
+
+ div#supportingText a,
+ div#supportingText a:link
+ div#supportingText a:active {
+ background-color: white;
+ color: black;
+ text-decoration:none;
+ font-weight:normal;
+ }
+ div#supportingText a:visited {
+ color:#666;
+ }
+ div#supportingText a:hover {
+ background-color: black;
+ color: white;
+ }
+
+ div#supportingText div#footer a,
+ div#supportingText div#footer a:link
+ div#supportingText div#footer a:active {
+ background-color:transparent;
+ color:black;
+ text-decoration:none;
+ font-weight:bold;
+ }
+ div#supportingText div#footer a:visited {
+ color:black;
+ }
+ div#supportingText div#footer a:hover {
+ background-color: black;
+ color: white;
+ }
+
+ div#linkList a,
+ div#linkList a:link
+ div#linkList a:active {
+ background-color:white;
+ color:black;
+ text-decoration:none;
+ font-weight:normal;
+ }
+ div#linkList a:visited {
+ color:#666;
+ text-decoration: line-through;
+ }
+ div#linkList div#larchives a:visited, div#linkList div#lresources a:visited {
+ text-decoration: none;
+ }
+ div#linkList a:hover {
+ background-color: #FE7996;
+ color: white;
+ }
+/* END LINK STYLES */
+
+/* CONTAINER */
+ div#container {
+ z-index:1;
+ width:780px;
+ padding-bottom:100px;
+
+ background: url("card_bottom.jpg") no-repeat left bottom;
+ }
+/* END CONTAINER */
+
+/* INTRO */
+ div#intro {
+ position:relative;
+ top:0;
+ left:0;
+
+ width:780px;
+ height:100px;
+
+ padding-top:0;
+ margin-top:0;
+ padding:167px 0 27px 27px;
+
+ background: url("card.jpg") repeat-y left top;
+ }
+ html>body div#intro {
+ height:auto;
+ }
+
+ div#intro h1 {
+ z-index:10;
+ position:absolute;
+ top:50px;
+ left:0;
+
+ height: 101px;
+ width: 307px;
+
+ margin:0;
+ padding:0;
+
+ background: url(logo.jpg) no-repeat left top;
+ }
+ div#intro h1 span {
+ display: none;
+ }
+ div#intro h2 {
+ z-index:10;
+ position:absolute;
+ top:119px;
+ left:174px;
+
+ width: 205px;
+ height: 32px;
+
+ margin:0;
+ padding:0;
+
+ background: url(tagline.jpg) no-repeat left top;
+ }
+ div#intro h2 span {
+ display: none;
+ }
+
+ div#intro div#pageHeader {
+ z-index:2;
+ position:absolute;
+ top:0;
+ left:0;
+
+ width:780px;
+ height:150px;
+
+ background: url("card_top.jpg") no-repeat left top;
+ }
+
+ div#intro div#quickSummary {
+ z-index:10;
+ position:absolute;
+ top:37px;
+ left:427px;
+
+ width:301px;
+
+ background: white url("rounded_top.jpg") no-repeat left top;
+ }
+ div#intro div#quickSummary p {
+ padding-left:100px;
+ padding-right:15px;
+
+ }
+ div#intro div#quickSummary p.p1 {
+ height:107px;
+
+ margin-top:26px;
+ margin-bottom:11px;
+ padding-bottom:0;
+
+ background: url("a_demonstration_of.gif") no-repeat 100px 22px;
+ }
+ div#intro div#quickSummary p.p1 span {
+ display:none;
+ }
+ div#intro div#quickSummary p.p2 {
+ padding-bottom:20px;
+
+ color:#aaa;
+
+ background: url("rounded_bottom.jpg") no-repeat bottom left;
+ }
+
+ div#intro div#preamble {
+ z-index:10;
+ position:relative;
+ width:198px;
+
+ margin:0;
+ padding:0;
+
+ color:white;
+
+ background: #071969 url("blue_top.gif") no-repeat top left;
+ }
+ div#intro div#preamble h3 {
+ position:absolute;
+ top:15px;
+ right:15px;
+
+ width: 32px;
+ height: 244px;
+
+ margin:0;
+ padding:0;
+
+ background: url(the_road_to_enlightenment2.gif) no-repeat left top;
+ }
+ div#intro div#preamble h3 span {
+ display:none;
+ }
+ div#intro div#preamble p {
+ padding-left:15px;
+ padding-right:15px;
+ margin-left:0px;
+ margin-right:30px;
+ }
+ div#intro div#preamble p.p1 {
+ padding-top:65px;
+ margin-top:0;
+ }
+ div#intro div#preamble p.p3 {
+ padding-bottom:30px;
+ margin-bottom:0;
+ background: url("blue_bottom.gif") no-repeat bottom left;
+ }
+/* END INTRO */
+
+/* SUPPORTINGTEXT */
+ div#supportingText {
+ position:absolute;
+ z-index:10;
+ left:240px;
+ top:329px;
+
+ padding:0 0 0 0;
+ width:335px;
+ height:300px;
+ overflow:auto;
+
+ background-color:#A5D2AA;
+
+ border-width: 2px 2px 2px 2px;
+ border-style:solid;
+ border-color:white;
+ }
+ div#supportingText p {
+ padding-left:35px;
+ padding-right:15px;
+ /*margin-right:35px;*/ /*to sort ie/mac horiz scrollbar*/
+ }
+
+ div#supportingText div#explanation {
+ background: url("do_not_duplicate.gif") no-repeat 5px 14px;
+ }
+ div#supportingText div#explanation h3 {
+ width: 166px;
+ height: 15px;
+ margin:10px 0 6px 34px;
+ display:block;
+
+ background: url(so_what_is_this_about.gif) no-repeat left top;
+ }
+ div#supportingText div#explanation h3 span {
+ display:none;
+ }
+
+ div#supportingText div#participation h3 {
+ width: 166px;
+ height: 18px;
+ margin:0px 0 3px 34px;
+
+ background: url(participation.gif) no-repeat left top;
+ }
+ div#supportingText div#participation h3 span {
+ display:none;
+ }
+
+ div#supportingText div#benefits h3 {
+ width: 166px;
+ height: 15px;
+ margin:0px 0 6px 34px;
+
+ background: url(benefits.gif) no-repeat left top;
+ }
+ div#supportingText div#benefits h3 span {
+ display:none;
+ }
+
+ div#supportingText div#requirements h3 {
+ width: 166px;
+ height: 18px;
+ margin:0px 0 3px 34px;
+
+ background: url(requirements.gif) no-repeat left top;
+ }
+ div#supportingText div#requirements h3 span {
+ display:none;
+ }
+
+ div#supportingText div#footer {
+ padding:0 15px 17px 35px;
+ background: url("footer.gif") no-repeat bottom left;
+ }
+/* END SUPPORTINGTEXT */
+
+/* LINKLIST */
+ div#linkList {
+ z-index:10;
+ position:absolute;
+ top:247px;
+ left:594px;
+ width:160px;
+
+ color:#aaa;
+
+ background: white url("rounded2_top.jpg") no-repeat top left;
+ }
+ div#linkList ul {
+ margin:0;
+ padding:0 15px 6px 15px;
+ list-style:none;
+ }
+ div#linkList ul li {
+ margin:0;
+ padding:0;
+ }
+
+ div#linkList div#lselect h3 {
+ width:112px;
+ height:12px;
+
+ margin:40px 0 6px 15px;
+ padding:0;
+
+ background: url("select_a_design2.gif") no-repeat top left;
+ }
+ div#linkList div#lselect h3 span {
+ display:none;
+ }
+ div#linkList div#lselect li {
+ margin-bottom:2px;
+ }
+
+ div#linkList div#larchives h3 {
+ margin:0 0 0 0;
+ }
+ div#linkList div#larchives h3 span {
+ display:none;
+ }
+ div#linkList div#larchives a {
+ font-weight:bold;
+ }
+
+ div#linkList div#lresources h3 {
+ width:81px;
+ height:11px;
+
+ margin:6px 0 6px 15px;
+ padding:0;
+
+ background: url("resources2.gif") no-repeat top left;
+ }
+ div#linkList div#lresources h3 span {
+ display:none;
+ }
+ div#linkList div#lresources ul {
+ padding-bottom:20px;
+ background: url("rounded2_bottom.jpg") no-repeat bottom left;
+ }
+ div#linkList div#lresources li {
+ margin-bottom:2px;
+ }
+/* END LINKLIST */
+
+
+/* EXTRAS */
+ div#extraDiv1 {
+ z-index:11;
+ position:absolute;
+ top:68px;
+ left:381px;
+
+ width:134px;
+ height:119px;
+
+ background: url("stamp.jpg") no-repeat top left;
+ }
+ div#extraDiv2 {
+ z-index:11;
+ position:absolute;
+ top:260px;
+ left:240px;
+
+ width:335px;
+ height:69px;
+
+ background: white url("barcode.gif") no-repeat top left;
+
+ border-width: 2px 2px 0 2px;
+ border-style:solid;
+ border-color:white;
+ }
+ div#extraDiv3 {
+ z-index:2;
+ position:absolute;
+ top:265px;
+ left:609px;
+
+ width:171px;
+ height:356px;
+
+ background: url("bent.jpg") no-repeat top left;
+ }
+/* END EXTRAS */
+/* css Zen Garden submission 053 - 'untitled' by Ray Henry, http://www.reh3.com/ */ +/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */ +/* All associated graphics copyright 2003, Ray Henry */ +/* Added: October 29th, 2003 */ + +/* IMPORTANT */ +/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */ +/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */ +/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */ + +/* basic elements */ +body { + font-family:verdana, arial, sans serif; + color:#65625B; + background:#fff url(main2_bg.gif); + margin:0; + padding:0; +} +#container { + width:auto; + margin:22px 0 0 0; + padding:7px 0 0 0; + height:471px; +} +acronym { + cursor: help; +} + +/*-- intro section --*/ +#intro { + background:#fff url(intro_bg.jpg) no-repeat top left; + width:339px; + height:471px; + padding:0 0 0 201px; + margin:0; +} +#pageHeader { + background:#fff url(pageHead_bg.gif) no-repeat top left; + width:302px; + height:51px; + margin:0; + padding:0; + border-bottom:1px dotted #c8c8c8; +} +#quickSummary, #preamble { + font-size:11px; + margin:0 0 0 100px; + width:202px; +} +#quickSummary p, #preamble p { + margin-bottom:10px; + line-height:16px; +} +#preamble h3 { + background:#fff url(preamble_h3_bg.gif) no-repeat top left; + width:142px; + height:13px; + margin-top:20px; +} + +/*-- supportingText section --*/ +#supportingText { + background:transparent; + font-size:11px; + width:auto; +} +#explanation { + position:absolute; + top:80px; + left:520px; + clear:both; + background:#fff url(graySec_bg.gif) repeat-x top left; + width:344px; + margin:0; + padding:10px 0 0 0; + height:410px; +} +#explanation h3 { + background:#F4F4F3 url(explan_h3_bg.gif) no-repeat top left; + width:137px; + height:13px; + margin:30px 10px 10px 10px; +} +#explanation p { + margin:10px; + line-height:16px; +} + +/*-- participation section --*/ +#participation { + position:absolute; + top:80px; + left:868px; + background:#fff url(explan_bg.gif) no-repeat top left; + width:344px; + margin:0; + padding:10px 0 0 3px; + height:410px; +} +#participation h3 { + background:#fff url(part_h3_bg.gif) no-repeat top left; + width:73px; + height:13px; + margin:30px 10px 10px 10px; +} +#participation p { + margin:10px; + line-height:16px; +} + +/*-- benefits section --*/ +#benefits { + position:absolute; + top:80px; + left:1216px; + background:#fff url(graySec_bg.gif) repeat-x top left; + width:344px; + margin:0; + padding:10px 0 0 3px; + height:410px; +} +#benefits h3 { + background:#F4F4F3 url(ben_h3_bg.gif) no-repeat top left; + width:45px; + height:13px; + margin:30px 10px 10px 10px; +} +#benefits p { + margin:10px; + line-height:16px; +} + +/*-- requirements section --*/ +#requirements { + position:absolute; + top:80px; + left:1564px; + background:#fff url(explan_bg.gif) repeat-x top left; + width:560px; + margin:0; + padding:10px 0 0 3px; + height:410px; +} +#requirements h3 { + background:#fff url(req_h3_bg.gif) no-repeat top left; + width:73px; + height:13px; + margin:30px 10px 10px 10px; +} +#requirements p { + margin:10px; + line-height:16px; +} + +/*-- footer section --*/ +#footer { + position:absolute; + top:80px; + left:2546px; + background:#fff url(graySec_bg.gif) repeat-x top left; + width:40px; + padding:45px 0 0 10px; + height:375px; + margin:0px 50px 0 0; + line-height:20px; +} + +/*-- lselect section --*/ +#lselect { + position:absolute; + background:#fff url(lselect_arrow_bg.gif) no-repeat top left; + top:30px; + left:520px; + height:51px; + width:2100px; + margin:0; + padding:0; + border-left:1px dotted #c8c8c8; + border-bottom:1px dotted #c8c8c8; + font-size:11px; +} +#lselect h3 { + background:#fff url(lselect_bg.gif) no-repeat top left; + width:83px; + height:13px; + margin:10px 10px 9px 10px; +} +#lselect ul { + margin:0 0 0 80px; + padding:0; +} +#lselect li { + font-size:10px; + margin-right:8px; + padding:6px; + display: inline; + list-style-type: none; + border-left:1px solid #ccc; + border-top:1px solid #ccc; + border-right:1px solid #ccc; +} +#lselect a:link, #lselect a:visited, #lselect a:active { + font-size:10px; + color:#65625B; +} +#lselect li:hover{ + background: #f5f5f5 url(tab_bg.gif) repeat-x top left; + color:#434039; +} + +/*-- larchives section --*/ +#larchives { + position:absolute; + top:80px; + left:2131px; + background:#F4F4F3 url(explan_bg.gif) repeat-x top left; + width:200px; + margin:0; + padding:10px 0 0 3px; + height:410px; +} +#larchives h3 { + background:#F4F4F3 url(arch_h3_bg.gif) no-repeat top left; + width:49px; + height:13px; + margin:30px 10px 10px 10px; +} +#larchives ul { + list-style-type: none; + font-size:11px; + margin:0 0 0 20px; + padding:0; + line-height:20px; +} + +/*-- larchives section --*/ +#lresources { + position:absolute; + top:80px; + left:2338px; + background:#fff url(explan_bg.gif) repeat-x top left; + width:200px; + margin:0; + padding:10px 0 0 3px; + height:410px; +} +#lresources h3 { + background:#fff url(res_h3_bg.gif) no-repeat top left; + width:60px; + height:13px; + margin:30px 10px 10px 10px; +} +#lresources ul { + list-style-type: none; + font-size:11px; + margin:0 0 0 20px; + padding:0; + line-height:20px; +} + +/*-- LINKS --*/ +#quickSummary a:link, #quickSummary a:visited, #quickSummary a:active, #supportingText a:link, #supportingText a:visited, #supportingText a:active, #larchives a:link, #larchives a:visited, #larchives a:active, #lresources a:link, #lresources a:visited, #lresources a:active { + color:#65625B; +} +#quickSummary a:hover, #supportingText a:hover, #larchives a:hover, #lresources a:hover{ + color:#434039; +} + +/*-- hidden --*/ +#pageHeader h1, #pageHeader h2, #preamble h3 span, #preamble p.p3, #participation p.p4, #explanation h3 span, #participation h3 span, #benefits h3 span, #supportingText h3 span, #lselect h3 span, #larchives h3 span, #lresources h3 span, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 { + display:none; +}/* css Zen Garden submission 054 - 'Gecko's Eye' by Sandra Greco, http://www.magritte.it/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Sandra Greco */
+/* Added: October 29th, 2003 */
+
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+ color: #fff;
+ background: #9E9E9E;
+ margin: 0;
+ background-image: url(bg.gif);
+ background-position: top left;
+ background-repeat:no-repeat;
+ }
+
+p {
+ font: 8pt/15pt Verdana, Arial, Helvetica, sans-serif;
+ margin-top: 4px;
+ text-align: left;
+ margin-right:5px;
+ }
+
+.p1, .p2 {
+ background-image: url(separator.gif);
+ background-position: left bottom;
+ background-repeat:no-repeat;
+ padding-bottom:15px;
+ margin-left:10px;
+ }
+
+.p3 {
+ padding-bottom:12px;
+ margin-left:10px;
+ }
+
+.p4 {
+ background-image: url(separator.gif);
+ background-position: left bottom;
+ background-repeat:no-repeat;
+ padding-bottom:10px;
+ }
+
+h3 {
+ FONT: 11pt times, Verdana, Arial, Helvetica, sans-serif;
+ COLOR: #EEE9E0;
+ text-decoration: none;
+ font-weight:bold;
+ height:10px;
+ line-height:17px;
+ letter-spacing:0.04em;
+ }
+
+a:link {
+ font-weight: bold;
+ text-decoration: underline;
+ color: #ffffff;
+ }
+
+a:visited {
+ font-weight: bold;
+ text-decoration: underline;
+ color: #ffffff;
+ }
+
+a:hover, a:active {
+ text-decoration: none;
+ color: #ffffff;
+ }
+
+#container {
+ background-image: url(geco_garden.gif);
+ background-position: 221px 0px;
+ background-repeat:no-repeat;
+ margin: 0;
+ height:80%;
+ }
+
+#explanation {
+ BACKGROUND:#880622 url(eye.gif) 0 10px no-repeat;
+ width:520px;
+ padding-bottom:35px;
+ border-top: solid 1px #5F0116;
+ border-right: solid 1px #5F0116;
+ }
+
+#participation, #benefits, #requirements {
+ BACKGROUND:#880622 url(eye.gif) 0 10px no-repeat;
+ width:520px;
+ padding-bottom:35px;
+ margin-top:-35px;
+ border-right: solid 1px #5F0116;
+ }
+
+#explanation p, #participation p, #benefits p, #requirements p {
+ width:490px;
+ margin-left:10px;
+ }
+
+#explanation h3, #participation h3, #benefits h3, #requirements h3 {
+ margin-left:55px;
+ padding-top:30px;
+ color: #d3f580;
+ }
+
+#footer {
+ font: 11px Verdana, Arial, Helvetica, sans-serif;
+ BACKGROUND:#C6C4C4;
+ width:520px;
+ text-align:center;
+ border-right: solid 1px #880622;
+ border-bottom: solid 1px #880622;
+ border-left: solid 1px #880622;
+ padding-bottom: 2px;
+ }
+
+#footer a:link, #footer a:visited {
+ margin-right: 10px;
+ color:#000000;
+ }
+
+#footer a:hover {
+ color:#880622;
+ }
+
+#intro {
+ min-width: 200px;
+ }
+
+
+#extraDiv1 {
+ background:#9E9E9E url(garden_css.gif) top left no-repeat;
+ position: absolute;
+ top: 145px;
+ left: 520px;
+ width:251px;
+ height: 152px;
+ border-bottom: solid 1px #EEE9E0;
+ border-left: solid 1px #EEE9E0;
+ border-top: solid 1px #EEE9E0;
+ }
+
+#extraDiv2 {
+ position: absolute;
+ top: 0;
+ left: 195px;
+ background-position: top left;
+ background-repeat:no-repeat;
+ width:25px;
+ height:220px;
+ }
+
+#extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
+ display:none;
+ }
+
+
+#quickSummary {
+ position:absolute;
+ top: 0;
+ left: 520px;
+ background:#0B4D69 url(sfondo_top.gif) no-repeat top left;
+ font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif;
+ border-right: solid 1px #EEE9E0;
+ border-left: solid 1px #EEE9E0;
+ width:250px;
+ z-index:1
+ }
+
+
+
+#quickSummary p {
+ font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif;
+ text-align: left;
+ margin-left:5px;
+ width: 240px;
+ }
+
+p:first-letter {
+ COLOR: #EEE9E0;
+ font-size: 150%;
+ font-weight: bold;
+ margin: 0px 2px 0px 0px;
+ }
+
+
+#preamble {
+ BACKGROUND:#497c89;
+ width:221px;
+ border-right: solid 1px #EEE9E0;
+ margin-top:0;
+ padding-bottom:1px;
+ padding-top:1px;
+ }
+
+#preamble h3 {
+ color: #d3f580;
+ padding-bottom:5px;
+ margin-left:10px;
+ padding-top:10px;
+ }
+
+#pageHeader h1, #pageHeader h1 span, #pageHeader h2, #pageHeader h2 span {
+ display:none
+ }
+
+
+#linkList {
+ margin-left: 250px;
+ margin-top:110px;
+ padding-left:7px;
+ position: absolute;
+ top: 40px;
+ left: 270px;
+ border-left: solid 1px #EEE9E0;
+ border-right: solid 1px #EEE9E0;
+ border-bottom: solid 1px #EEE9E0;
+ padding-bottom:30px;
+ width:200px;
+ }
+
+#linkList2 {
+ font: 10px Verdana, Arial, Helvetica, sans-serif;
+ padding-left:10px;
+ margin-top: 150px;
+ width: 165px;
+
+ }
+
+#linkList h3.select {
+ text-align: center;
+ }
+
+#linkList h3.select span {
+ font: 12px/18px Verdana, Arial, Helvetica, sans-serif;
+ font-weight:bold;
+ letter-spacing:0.03em;
+ margin: 30px 0px 5px 0px;
+ height: 20px;
+ }
+
+#linkList h3.favorites, #linkList h3.favorites span {
+ display:none;
+ }
+
+#larchives li {
+ margin-bottom:5px;
+ margin-top:6px;
+ }
+
+#larchives a {
+ background: url(arrow.gif) no-repeat top left;
+ }
+
+#larchives a:hover, #larchives a:active #larchives a:visited{
+ background-color: #9E9E9E;
+ text-decoration: none;
+ }
+
+#lresources li {
+ margin-bottom:5px;
+ margin-top:6px;
+ }
+
+
+#lselect a:link {
+ text-decoration: none;
+ background: url(circle.gif) top left no-repeat;
+ }
+
+#lselect a:hover, #lselect a:active {
+ text-decoration: none;
+ }
+
+#lresources a {
+ background-color: #9E9E9E;
+ background: url(arrow.gif) no-repeat top left;
+ }
+
+#lresources a:link {
+ background-color: #9E9E9E;
+ }
+
+#lresources a:hover, #lresources a:active {
+ background-color: #9E9E9E;
+ text-decoration: none;
+ }
+
+#lresources a:visited{
+ background-color: #9E9E9E;
+ text-decoration: none;
+ background: url(arrow.gif) no-repeat top left;
+ }
+
+#linkList h3.archives, #linkList h3.resources {
+ font: 12px Verdana, Arial, Helvetica, sans-serif;
+ letter-spacing:0.03em;
+ margin: 15px 0px 5px 0px;
+ height: 60px;
+ width: 140px;
+ background:url(decoration.gif) no-repeat top center;
+ text-align: center;
+ }
+
+#linkList h3.archives span, #linkList h3.resources span {
+ letter-spacing:0.03em;
+ font: 12px Verdana, Arial, Helvetica, sans-serif;
+ font-weight:bold;
+ text-align: center;
+ width:140px;
+ margin-top:40px;
+ }
+
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#linkList li {
+ list-style-type: none;
+ }
+
+
+#linkList li a:link {
+ color: #880622;
+ text-decoration: none;
+ padding-right:2px;
+ padding-left:10px;
+ padding-bottom:3px;
+ padding-top:1px;
+ height:18px;
+ }
+
+#linkList li a:hover {
+ color: #EEE9E0;
+ text-decoration: none;
+ padding-right:2px;
+ padding-left:10px;
+ padding-bottom:3px;
+ padding-top:1px;
+ }
+
+#linkList li a:visited {
+ color: #880622;
+ text-decoration: none;
+ padding-right:2px;
+ padding-left:10px;
+ padding-bottom:3px;
+ padding-top:1px;
+ }
+
+#linkList li a:active {
+ color: #880622;
+ text-decoration: none;
+ padding-right:2px;
+ padding-left:10px;
+ padding-bottom:3px;
+ padding-top:1px;
+ }
+
+#lselect{
+ display: block;
+ font-weight: normal;
+ text-decoration: none;
+ }
+
+#lselect a.c {
+ font-weight: normal;
+ text-decoration: none;
+ display: block;
+ background: url(arrow1.gif) no-repeat top left;
+ }
+
+#lselect a:hover.c {
+ display: block;
+ font-weight: normal;
+ color:#EEE9E0;
+ text-decoration: none;
+ }
+
+.c {
+ color: #880622;
+ text-decoration: none;
+ }
+
+.c:hover {
+ color: #880622;
+ text-decoration: underline;
+ }
+/* css Zen Garden submission 056 - 'zenlightenment' by Lance Leonard, http://www.solarfrog.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Lance Leonard */
+/* Added: October 29th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+html {
+ text-align: center;
+}
+body {
+ background: #369 url(bg.gif) repeat-x top;
+ margin: 0 auto;
+ padding: 0;
+ color: #fff;
+ font-family: verdana, arial, helvetica, sans-serif;
+ width: 760px;
+ font-size: x-small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: small;
+}
+
+div#container {
+ float: left;
+ margin: 160px auto 0 auto;
+ padding: 0;
+ background: url(bg_container.gif) repeat-y top center;
+ width: 760px; /* False value for IE4-5.x/Win */
+ text-align: left;
+}
+
+div#intro {
+ position: relative;
+ background: #369;
+ border: solid 1px #000;
+ margin: 0;
+ padding: 5px;
+ z-index: 1;
+ width: 760px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 748px; /* Actual value for conformant browsers */
+}
+
+div#pageHeader {
+ position: absolute;
+ top: -151px;
+ left: 41px;
+ background: url(head.jpg) no-repeat top left;
+ width: 676px;
+ height: 150px;
+}
+
+div#pageHeader h1, div#pageHeader h2 {
+ display: none;
+}
+
+div#quickSummary {
+ float: left;
+ clear: both;
+ margin: 0 0 0 5px;
+ padding: 10px 0 0 0 ;
+ width: 169px; /* False value for IE4-5.x/Win */
+ height: 169px;
+}
+
+div#quickSummary p.p1 {
+ background: url("quickSum.gif") no-repeat top left;
+ width: 159px;
+ height: 139px;
+}
+
+div#quickSummary p.p1 span {
+ display: none;
+}
+
+div#quickSummary p.p2 {
+ position: absolute;
+ top: 165px;
+ font-size: 10px;
+ width: 169px;
+}
+
+div#quickSummary a {
+ color: #fff;
+ font-weight: bold;
+}
+
+div#preamble {
+ margin: 0 0 0 175px;
+ padding: 5px 10px;
+ background: #69c;
+ min-height: 200px;
+ width: 555px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 545px; /* Actual value for conformant browsers */
+}
+
+div#preamble h3 {
+ margin: 0 0 10px 0;
+ padding: 0;
+ height: 26px;
+ background: url(road.gif) no-repeat top left;
+}
+
+div#preamble h3 span {
+ display: none;
+}
+
+div#preamble p {
+ margin: 8px 0 0 0;
+ line-height: 1.5em;
+}
+
+div#supportingText {
+ float: left;
+ margin: 0;
+ padding: 20px 20px 0 66px;
+ background: url(bg_supportingText.gif) no-repeat top left;
+ width: 496px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 410px; /* Actual value for conformant browsers */
+}
+
+div#supportingText h3 {
+ margin: 25px 0 0 0;
+ padding: 0;
+ width: 409px;
+ height: 26px;
+}
+
+div#supportingText h3 span {
+ display: none;
+}
+
+div#explanation h3 {
+ margin-top: 0;
+ background: url(what.gif) no-repeat top left;
+}
+
+div#participation h3 {
+ background: url(part.gif) no-repeat top left;
+}
+
+div#benefits h3 {
+ background: url(bene.gif) no-repeat top left;
+}
+
+div#requirements h3 {
+ background: url(requ.gif) no-repeat top left;
+}
+
+div#supportingText p {
+ margin: 15px 0 0 0;
+ letter-spacing: .1em;
+ line-height: 1.2em;
+}
+
+div#supportingText a {
+ color: #036;
+}
+
+div#linkList {
+ margin-left: 496px;
+ padding: 20px;
+ background: url(bg_linkList.gif) no-repeat top left;
+}
+
+div#linkList h3 {
+ margin: 25px 0 0 0;
+ padding: 0;
+ width: 182px;
+ height: 26px;
+}
+
+div#linkList h3 span {
+ display: none;
+}
+
+div#lselect h3 {
+ margin-top: 0px;
+ background: url(selectadesign.gif) no-repeat top left;
+}
+
+div#larchives h3 {
+ background: url(archives.gif) no-repeat top left;
+}
+
+div#lresources h3 {
+ background: url(resources.gif) no-repeat top left;
+}
+
+div#linkList a {
+ color: #369;
+ text-decoration: none;
+ font-size: small;
+ font-weight: normal;
+}
+
+div#linkList a:hover {
+ color: #036;
+}
+
+#linkList ul {
+ margin: 12px 0 15px 15px;
+ padding: 0px;
+}
+
+#linkList li {
+ list-style: none;
+ margin: 0;
+ padding: 0px;
+}
+
+#lselect li {
+ margin: 0 0 10px 0;
+}
+
+div#lselect li a {
+ display: block;
+}
+
+div#lselect li .c {
+ display: inline;
+}
+
+div#footer {
+ border-top: solid 4px #eee;
+ background: #69c;
+ margin: 20px -22px 0 -22px;
+ padding: 10px 20px;
+ width: 450px; /* False value for IE4-5.x/Win */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 410px; /* Actual value for conformant browsers */
+}
+
+div#footer a {
+ color: #fff;
+}
+/* --------- standalone --------- */
+body {
+ font: 11px/1.3 Tahoma, sans-serif;
+ margin: 0;
+ margin-left: 31px;
+ padding: 0;
+ background: #ddd url(bg.gif) repeat-y left;
+ }
+
+#container {
+ text-align: left;
+ background-color: #eee;
+ padding-bottom: 125px;
+ width: 735px;
+ height: 100%;
+ }
+
+p {
+ padding: 0 10px 0px 10px;
+ }
+
+/* sections */
+
+#intro {
+ text-align: left;
+ height: 223px;
+ padding: 130px 0 0 0;
+ margin: 0;
+ background: #ddd url(top.gif) repeat-x top;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height: 97px;
+ }
+
+#pageHeader {
+ height: 65px;
+ padding: 0;
+ margin: 0;
+ background: #fff url(mid.gif) no-repeat;
+ }
+
+#pageHeader h1 {
+ display: none;
+ }
+
+#pageHeader h2 {
+ display: none;
+ }
+
+#quickSummary {
+ height: 37px;
+ width: 735px;
+ padding-bottom: 4px;
+ margin: 0;
+ text-align: left;
+ background: #eee url(bottom.gif) no-repeat top;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ height: 28px;
+ }
+
+#quickSummary p {
+ display: none;
+ }
+
+#quickSummary p.p2 {
+ padding-left: 5px;
+ color: #555;
+ font: 9px Verdana, Arial, Sans-Serif;
+ font-weight: bold;
+ display: inline;
+ }
+
+#quickSummary p.p2 a, a {
+ color: #777;
+ text-decoration: none;
+ }
+
+#quickSummary p.p2 a:hover, a:hover {
+ color: #36c;
+ }
+
+#preamble {
+ text-align: justify;
+ position: absolute;
+ margin: 0 0 0 0;
+ width: 735px;
+ color: #555;
+ height: 130px;
+ overflow: auto;
+ padding: 0px 0px 0px 234px;
+ background: #ddd url(road.jpg) no-repeat left top;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 501px;
+ }
+
+#preamble h3 {
+ height: 20px;
+ padding: 0;
+ margin: 0;
+ background: #ddd url(1.gif) no-repeat left top;
+ }
+
+#preamble p.p3 {
+ padding: 0 10px 10px 10px;
+ }
+
+#supportingText {
+ position: absolute;
+ margin-top: 139px;
+ width: 510px;
+ color: #555;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 510px;
+ }
+
+#preamble h3 span, #supportingText h3 span, #explanation h3 span {
+ display: none;
+ }
+
+#explanation {
+ text-align: justify;
+ margin: 0 0 0 225px;
+ width: 510px;
+ color: #555;
+ background: #ddd url(r2.jpg) no-repeat left bottom;
+ padding-left: 234px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 276px;
+ }
+
+#explanation h3 {
+ height: 20px;
+ padding: 0;
+ margin: 0;
+ background: #ddd url(2.gif) no-repeat left top;
+ }
+
+#explanation p.p2 {
+ padding: 0 10px 10px 10px;
+ }
+
+#participation, #benefits, #requirements {
+ text-align: justify;
+ margin: 0 0 0 225px;
+ width: 510px;
+ color: #555;
+ padding: 10px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 490px;
+ }
+
+#participation h3, #benefits h3, #requirements h3 {
+ display: block;
+ width: 300px;
+ height: 20px;
+ margin-left: 45px;
+ }
+
+#participation h3 {
+ background: transparent url(3.gif) no-repeat;
+ }
+
+#benefits h3 {
+ background: transparent url(4.gif) no-repeat;
+ }
+
+#requirements h3 {
+ background: transparent url(5.gif) no-repeat;
+ }
+
+#requirements, #benefits, #participation {
+ background: #ddd url(corner.gif) no-repeat top left;
+ margin-top: 15px;
+ }
+
+/* sidelink items */
+
+#linkList {
+ width: 225px;
+ position: absolute;
+ background-color: #ddd;
+ font: 10px Tahoma, sans-serif;
+ margin-top: 139px;
+ color: #aaa;
+ border-right: 9px solid #eee;
+ text-align: center;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width: 216px;
+ }
+
+#lselect, #lfavorites, #larchives {
+ border-bottom: 9px solid #eee;
+ background: #ddd url(backc.gif) no-repeat bottom right;
+ }
+
+#lresources {
+ border-bottom: 9px solid #eee;
+ background: #ddd url(backc.gif) no-repeat bottom right;
+ }
+
+#lselect h3 {
+ background: #ddd url(selectd.gif) no-repeat;
+ padding: 0;
+ margin: 0;
+ height: 20px;
+ }
+
+#lselect h3 span, #lfavorites h3 span, #larchives h3 span, #lresources h3 span {
+ display: none;
+ }
+
+#lfavorites h3 {
+ background: #ddd url(selectf.gif) no-repeat;
+ padding: 0;
+ margin: 0;
+ height: 20px;
+ }
+
+#larchives h3 {
+ background: #ddd url(selecta.gif) no-repeat;
+ padding: 0;
+ margin: 0;
+ height: 20px;
+ }
+
+#lresources h3 {
+ background: #ddd url(selectr.gif) no-repeat;
+ padding: 0;
+ margin: 0;
+ height: 20px;
+ }
+
+#linkList ul {
+ list-style: none;
+ padding: 5px 0 5px 0;
+ margin: 0;
+ }
+
+#linkList li {
+ line-height: 2em;
+ display: block;
+ }
+
+#linkList li a {
+ margin: 0 2px 0 2px;
+ font-weight: bold;
+ padding: 3px;
+ border: 1px solid #ddd;
+ }
+
+#linkList li a:hover {
+ background: #eee url(llist.gif);
+ border: 1px solid #aaa;
+ }
+
+
+
+
+
+
+/* Footer */
+
+#footer {
+ padding: 15px;
+ }
+
+#footer a {
+ margin: 1px;
+ padding: 5px;
+ }
+
+#footer a:hover {
+ background-color: #ddd;
+ }
+
+/* And that's the end, let's do it again! */
+
+/* css Zen Garden submission 057 - 'This is Cereal' by Shaun Inman, http://www.shauninman.com/ */ +/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */ +/* All associated graphics copyright 2003, Shaun Inman */ +/* Added: November 4th, 2003 */ + +/* IMPORTANT */ +/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */ +/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */ +/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */ + + +/* Photography © Bradley Mason http://www.sxc.hu/browse.phtml?f=profile&l=bradleym */ + +#extraDiv3, +#extraDiv4, +#extraDiv5, +#extraDiv6 { display: none; } + +/* Warning message styles for browsers that don't support CSS attribute selectors... */ +#extraDiv1 { position: absolute; top: 112px; left: 292px; width: 340px; height: 166px; background: url(txt_upgrade.gif) no-repeat; z-index: 10; } +#container { padding: 296px 0 0 294px; z-index: 99; } +/* Clear the warning styles for those that do... */ +div[id="extraDiv1"] { display: none; } +div[id="container"] { padding: 226px 0 0 294px !important; } + +/* Spoon graphic and pull-quote */ +#extraDiv2 { position: absolute; top: 1200px; left: 0px; width: 229px; height: 580px; background: url(spoon_flake.png) no-repeat; z-index: 0; } +div[id="extraDiv2"] { top: 712px !important; } + +/* Coffee graphic */ +#extraDiv3 { display: block !important; position: relative; margin-left: 496px; height: 0; z-index: 0; } +#extraDiv3 span { + position: absolute; + bottom: -33px; + width: 100%; + height: 596px; + background: url(coffee.jpg) no-repeat; + } + +/* Small logo */ +div[id="extraDiv4"] { display: block !important; position: relative; margin-left: 64px; width: 168px; height: 0; z-index: 3; } +div[id="extraDiv4"]>span { + position: absolute; + bottom: -33px; + width: 100%; + height: 98px; + background: url(logo_small.gif) no-repeat; + } +/* div[id="extraDiv4"] span:active { background: url(logo_small_over.gif) no-repeat; } */ + + +/* Photo Credit */ +div[id="extraDiv5"] { display: block !important; position: relative; margin-left: 4px; height: 0; z-index: 0; } +div[id="extraDiv5"]>span { + position: absolute; + bottom: -33px; + width: 100%; + height: 336px; + background: url(txt_credit.gif) no-repeat; + } + +/* Quality text and SI logo */ +div[id="extraDiv6"] { + display: block !important; + position: absolute; + top: 476px; + left: 103px; + width: 146px; + height: 77px; + background: url(txt_quality.gif) no-repeat; + z-index: 0; + } + +body { + margin: 0; + padding: 0; + background: url(bg_header.jpg) no-repeat #FFF; + } + +#quickSummary, +#preamble, +#supportingText { width: 336px; z-index: 1; } + +p { + text-align: justify; + font-family: Georgia,"Times New Roman",Times,serif; + font-size: 11px; + line-height: 17px; + margin-top: 0; + color: #707070; + } +p acronym { font-style: italic; } +acronym { border-style: none; } + +p a, #footer a { color: #866F5B; text-decoration: none; border-bottom: 1px dotted #866F5B; } +p a:hover, #footer a:hover { color: #A51A0A; border-style: none; } +div[id="footer"]>a { border-style: none !important; } + +#preamble { margin-bottom: 2em; } +#preamble p.p2 { background: url(head_enlightenment.gif) no-repeat; padding-top: 2.4em; } +div[id="preamble"]>p.p2 { background: url(head_enlightenment.png) no-repeat !important; } + +#explanation, +#participation, +#benefits, +#requirements { padding-top: 1.8em; margin-bottom: 2em; } + + +@media tty { /* Mid pass to square away some IE 5 PC hinkyness. */ + i{content:"\";/*" "*/}} #explanation p.p1,#participation p.p1,#benefits p.p1,#requirements p.p1 { padding-top: 1.8em; } /*";} + }/* */ + +#explanation { background: url(head_explanation.gif) no-repeat; } +#participation { background: url(head_participation.gif) no-repeat; } +#benefits { background: url(head_benefits.gif) no-repeat; } +#requirements { position: relative; background: url(head_requirements.gif) no-repeat; z-index: 1; } + +#quickSummary { margin-bottom: 2em; } +div[id="quickSummary"] { margin-bottom: 0 !important; } +#quickSummary>p[class="p1"] { position: absolute; top: 230px; left: 108px; background: url(txt_demo.jpg) no-repeat; width: 143px; height: 0; padding-top: 57px; overflow: hidden; } +#quickSummary>p[class="p2"] { position: absolute; top: 328px; left: 105px; background: url(txt_download.gif) 5px 5px; background-repeat: no-repeat; width: 107px; height: 29px; z-index: 15; margin: 0; color: #FFF; font-size: 1px; padding-top: 36px; } +#quickSummary>p[class="p2"] a[href="zengarden-sample.html"] { position: absolute; top: 17px; left: 5px; width: 35px; height: 0px; padding-top:9px; overflow: hidden; } +#quickSummary>p[class="p2"] a[href="zengarden-sample.html"]:hover { background: url(button_html_over.gif) no-repeat; } +#quickSummary>p[class="p2"] a[href="zengarden-sample.css"] { position: absolute; top: 17px; left: 63px; width: 31px; height: 0px; padding-top:9px; overflow: hidden; } +#quickSummary>p[class="p2"] a[href="zengarden-sample.css"]:hover { background: url(button_css_over.gif) no-repeat; } +div[id="quickSummary"] a { border-style: none; } +/**/ + +/**/ +#lselect { position: absolute; top: 324px; left: 105px; } +#lresources { position: absolute; top: 714px; left: 105px; } +#larchives { position: absolute; top: 902px; left: 105px; } +#lfavorites { position: absolute; top: 1030px; left: 105px; } + +/**/ +div[id="lselect"] { top: 292px !important; left: 105px !important; background: url(button_select_design.gif) no-repeat; width: 149px; height: 37px; z-index: 300; } +div[id="lresources"] { top: 358px !important; left: 105px !important; background: url(button_resources.gif) no-repeat; width: 149px; height: 37px; z-index: 200; } +div[id="lfavorites"] { top: 443px !important; left: 105px !important; background: url(button_favorites.gif) no-repeat; width: 149px; height: 37px; z-index: 150; } +/**/ + +#lselect h3, +#lresources h3, +#larchives h3, +#lfavorites h3 { + position: absolute; top: -28px; left: 0px; + background: url(bg_menu_thin_top.gif) no-repeat; + width: 149px; height: 28px; line-height: 28px; + padding-top: 5px; + overflow: hidden; + margin: 0; + padding: 0 18px; + color: #333; + font-family: "Lucida Grande","Lucida Sans Unicode",geneva,arial,verdana,sans-serif; font-size: 9px; + } +/**/ +div[id="lselect"]>h3, +div[id="lresources"]>h3, +div[id="larchives"]>h3, +div[id="lfavorites"]>h3 { top: -1000px !important; left: -1000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; } + +#lselect:hover h3, +#lresources:hover h3, +#lfavorites:hover h3 { position: absolute; top: 5px !important; left: 5px !important; background: url(bg_menu_top.png) no-repeat; width: 203px !important; height: 0px !important; padding-top: 5px; margin: 0; } +/**/ + +#lselect ul, +#lresources ul, +#larchives ul, +#lfavorites ul { + background: url(bg_menu_thin.gif) left bottom no-repeat; + margin: 0; + padding: 0 0 5px; + list-style: none; + voice-family: "\"}\""; + voice-family:inherit; + width: 149px; + } + +/**/ +div[id="lselect"]>ul, +div[id="lresources"]>ul, +div[id="lfavorites"]>ul { position: absolute; top: -1000px; left: -1000px; width: 203px !important; background: url(bg_menu.png) left bottom no-repeat !important; } + +#lselect:hover ul, +#lresources:hover ul, +#lfavorites:hover ul { position: absolute; top: 10px; left: 5px; } +/**/ + + +#lselect li, +#lresources li, +#larchives li, +#lfavorites li { + font-size: 9px; + color: #8B8C8C; + background: url(bg_menu_separator_thin.gif) no-repeat; + padding: 8px 18px; + } + +@media tty { /* Mid pass to square away some IE 5 PC hinkyness. */ + i{content:"\";/*" "*/}} #lselect li,#lresources li,#larchives li,#lfavorites li { width: 149px; padding: 6px 18px; } /*";} + }/* */ + +/**/ +div[id="lselect"]>ul>li, +div[id="lresources"]>ul>li, +div[id="lfavorites"]>ul>li { background: url(bg_menu_separator.png) no-repeat !important; } + + +div[id="lselect"]>ul>li:first-child, +div[id="lresources"]>ul>li:first-child , +div[id="lfavorites"]>ul>li:first-child { padding-top: 5px; background: url(o.gif) no-repeat !important; } +#lselect li:hover, +#lresources li:hover, +#lfavorites li:hover { background: url(bg_menu_over.png) no-repeat !important; } + +div[id="larchives"] { position: absolute; top: 400px !important; left: 100px !important; background: url(well_design_archives.gif) 5px 0px no-repeat; width: 164px !important; height: 44px; z-index: 100; } +div[id="larchives"]>ul, div[id="larchives"]>ul>li { margin: 0; padding: 0; list-style: none; background: url(o.gif) no-repeat !important; } +#larchives a[accesskey="n"] { background: url(button_next.gif) no-repeat; position: absolute; top: 14px; left: 50px; width: 45px; height: 0px; padding-top: 21px; overflow: hidden; z-index: 1; } +#larchives a[accesskey="p"] { background: url(button_prev.gif) no-repeat; position: absolute; top: 14px; left: 7px; width: 44px; height: 0px; padding-top: 21px; overflow: hidden; z-index: 2; } +#larchives a[accesskey="w"] { background: url(button_view_all.gif) no-repeat; position: absolute; top: 14px; left: 99px; width: 53px; height: 0px; padding-top: 21px; overflow: hidden; } +#larchives a[accesskey="n"]:hover { background: url(button_next_over.gif) no-repeat; } +#larchives a[accesskey="p"]:hover { background: url(button_prev_over.gif) no-repeat; } +#larchives a[accesskey="w"]:hover { background: url(button_view_all_over.gif) no-repeat; } + +/**/ + +#lselect a, +#lfavorites a { display: block; } +#lselect a.c, +#lfavorites a.c { display:inline; font-size: 9px; text-transform: lowercase; } + +#linkList { font-family: "Lucida Grande","Lucida Sans Unicode",geneva,arial,verdana,sans-serif; font-size: 9px; } +#linkList a, +#linkList a:link, +#linkList a:visited { font-size: 10px; color: #444; text-decoration: none; } +#linkList a:hover { color: #A51A0A; } + +#linkList a.c, +#linkList a.c:link, +#linkList a.c:visited { color: #8B8C8C;} +#linkList a.c:hover { color: #A51A0A; } +/**/ + + +#footer { font-family: geneva,arial,verdana,sans-serif; font-size: 9px; } +#footer a { color: #866F5B; text-decoration: none; } +#footer a:hover { color: #A51A0A; } + +/**/ +div[id="footer"] { position: relative; top: -5px; left: -5px; width: 327px; height: 48px; background: url(txt_footer.gif) 5px 5px no-repeat; z-index: 1; } +/* xhtml */ +#footer a[href="http://validator.w3.org/check/referer"] { position: absolute; top: 17px; left: 105px; width: 33px; height: 0px; padding-top:9px; overflow: hidden; } +#footer a[href="http://validator.w3.org/check/referer"]:hover { background: url(button_xhtml_over.gif) no-repeat; } +/* css */ +#footer a[href="http://jigsaw.w3.org/css-validator/check/referer"] { position: absolute; top: 17px; left: 145px; width: 18px; height: 0px; padding-top:9px; overflow: hidden; } +#footer a[href="http://jigsaw.w3.org/css-validator/check/referer"]:hover { background: url(button_css_footer_over.gif) no-repeat; } +/* cc */ +#footer a[href="http://creativecommons.org/licenses/sa/1.0/"] { position: absolute; top: 17px; left: 170px; width: 13px; height: 0px; padding-top:9px; overflow: hidden; } +#footer a[href="http://creativecommons.org/licenses/sa/1.0/"]:hover { background: url(button_cc_over.gif) no-repeat; } +/* 508 */ +#footer a[title="Check the accessibility of this site according to U.S. Section 508"] { position: absolute; top: 17px; left: 189px; width: 15px; height: 0px; padding-top:9px; overflow: hidden; } +#footer a[title="Check the accessibility of this site according to U.S. Section 508"]:hover { background: url(button_508_over.gif) no-repeat; } +/* aaa */ +#footer a[title="Check the accessibility of this site according to WAI Content Accessibility Guidelines 1"] { position: absolute; top: 17px; left: 228px; width: 20px; height: 0px; padding-top:9px; overflow: hidden; } +#footer a[title="Check the accessibility of this site according to WAI Content Accessibility Guidelines 1"]:hover { background: url(button_aaa_over.gif) no-repeat; } + +/* Move this junk out of the way */ +#pageHeader, +#preamble h3, +#supportingText h3 { position: absolute; top: -1000px; left: -1000px; width: 1px; height: 1px; overflow: hidden; } +/* css Zen Garden submission 058 - 'Radio Zen' by Marc LA van den Heuvel, http://www.mlavdh.nl/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Marc LA van den Heuvel */
+/* Added: November 9th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+body {
+ font-family: georgia, Arial, Helvetica, sans-serif;
+ font-size: 10px;
+ background: url(schaal.jpg);
+ background-color: #F8F8EE;
+ background-repeat: no-repeat;
+ background-position: top;
+ background-attachment: fixed;
+ margin: 0px;
+ text-decoration: none;
+ }
+
+acronym {
+ border-bottom: none;
+ }
+
+#intro {
+ position: absolute;
+ width: 1590px;
+ font-style: italic;
+ line-height: normal;
+ font-variant: normal;
+ text-transform: capitalize;
+ z-index: 1;
+ }
+
+
+#pageHeader H1 {
+ position: absolute;
+ top: 278px;
+ left: 720px;
+ color: #E8E9CF;
+ font-size: 70px;
+ }
+
+
+#pageHeader H2 {
+ position: absolute;
+ top: 330px;
+ left: 1280px;
+ color: #E8E9CF;
+ font-size: 30px;
+ }
+
+
+
+#quickSummary {
+ position: absolute;
+ right: 0px;
+ text-align: left;
+ width: 165px;
+ height: 340px;
+ top: 95px;
+ padding-top: 40px;}
+
+#quickSummary P {
+ margin-top: 3px;
+ margin-bottom: 8px;
+ margin-left: 8px;
+ margin-right: 8px;
+ color: #555F44;
+ }
+
+#quickSummary a:link, #quickSummary a:visited {
+ color: #744646;
+ text-decoration: none;
+ border-bottom: 1px dashed #744646;
+ }
+
+#quickSummary a:hover, #quickSummary a:active {
+ color: #000000;
+ text-decoration: underline;
+ }
+
+#preamble {
+ position: absolute;
+ left: 10px;
+ text-align: right;
+ width: 165px;
+ top: 95px;
+ }
+
+#preamble P {
+ margin-top: 3px;
+ margin-bottom: 8px;
+ margin-left: 8px;
+ margin-right: 8px;
+ color: #555F44;
+ }
+
+#preamble h3 {
+ margin: 0px;
+ font-size: 14px;
+ font-family: Arial, Helvetica, sans-serif;
+ color: #555F44;
+ text-decoration: none;
+ font-style: normal;
+ font-weight: bold;
+ margin-left: 8px;
+ margin-right: 8px;
+ }
+
+#supportingText {
+ position: absolute;
+ width: 1230px;
+ padding-left: 185px;
+ padding-top: 95px;
+ text-align: justify;
+ background: url(naald.gif);
+ background-repeat: no-repeat;
+ background-position: top;
+ z-index: 3;
+ }
+
+#supportingText a:link, #supportingText a:visited {
+ color: #744646;
+ text-decoration: none;
+ border-bottom: 1px dashed #744646;
+ }
+
+#supportingText a:hover, #supportingText a:active {
+ color: #000000;
+ text-decoration: underline;
+ }
+
+
+#supportingText P {
+ margin-top: 3px;
+ margin-bottom: 8px;
+ margin-left: 8px;
+ margin-right: 8px;
+ color: #353638;
+ }
+
+#supportingText h3 {
+ margin: 0px;
+ font-family: Arial, Helvetica, sans-serif;
+ color: #422222;
+ text-decoration: none;
+ font-size: 8pt;
+ font-style: normal;
+ font-weight: bold;
+ margin-left: 3px;
+ margin-right: 8px;
+ background: url(klein.jpg);
+
+ }
+
+
+#explanation {
+ float: left;
+ width: 290px;
+ }
+
+#participation {
+ float: left;
+ width: 290px;
+ }
+
+#benefits {
+ float: left;
+ width: 150px;}
+
+#requirements {
+ float: left;
+ width: 500px;}
+
+
+#footer {
+ float: right;
+ padding-right: 50px;
+ top: 0px;
+ }
+
+#footer a:link, #footer a:visited {
+ color: #E8E9CF;
+ text-decoration: none;
+ border-bottom: 0px dashed #744646;
+ font-size: 12px;
+ font-style: normal;
+ font-weight: bold;
+ font-family: Arial, Helvetica, sans-serif;
+ }
+
+#footer a:hover, #footer a:active {
+ color: #000000;
+ text-decoration: underline;
+ }
+
+#linkList{
+ position: absolute;
+ padding-top: 480px;
+ text-align: justify;
+ z-index: 1;}
+
+#lselect{
+ position: absolute;
+ width: 1590px;
+ top: 46em;
+ text-align: left;
+ padding: 5px;
+ font-family: Arial, Helvetica, sans-serif;
+ background-color: #E8E9CF;
+ }
+
+#lselect ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#lselect h3 {
+ margin: 0px;
+ margin-right: 10px;
+ color: #555F44;
+ font-size: 8pt;
+ float: left;
+ font-weight: bold;
+ }
+
+#lselect li {
+ color:#000000;
+ list-style-type: none;
+ float: left;
+ border-left: 4px solid #F8F8EE;
+ padding-left: 5px;
+ padding-right: 5px;
+ }
+
+#lselect a:link, #lselect a:visited {
+ color: #744646;
+ text-decoration: none;
+ font-size: 8pt;
+ font-style: normal;
+ font-weight: bold;
+ }
+
+#lselect a:hover, #lselect a:active {
+ color: #000000;
+ text-decoration: underline;
+ }
+
+#lselect a.c, #lselect a:link.c , #lselect a:visited.c{
+ color: #422222;
+ font-weight: normal;
+ }
+
+#lselect a:hover.c, #lselect a:active.c {
+ display: inline;
+ }
+
+#larchives{
+ position: absolute;
+ padding-top: 490px;
+ text-align: justify;
+ }
+
+#larchives{
+ position: absolute;
+ width: 300px;
+ top: 49em;
+ left: 75px;
+ text-align: left;
+ padding: 5px;
+ font-family: Arial, Helvetica, sans-serif;
+ }
+
+#larchives ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#larchives h3 {
+ margin: 0px;
+ margin-right: 10px;
+ color: #555F44;
+ font-size: 9px;
+ float: left;
+ font-weight: normal;
+ }
+
+#larchives li {
+ color:#555F44;
+ list-style-type: none;
+ float: left;
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+#larchives a:link, #larchives a:visited {
+ color: #555F44;
+ text-decoration: none;
+ font-size: 9px;
+ font-style: normal;
+ font-weight: normal;
+ }
+
+#larchives a:hover, #larchives a:active {
+ color: #000000;
+ text-decoration: underline;
+ }
+
+#larchives a.c, #larchives a:link.c , #larchivest a:visited.c{
+ color: #006633;
+ }
+
+#larchives a:hover.c, #larchives a:active.c {
+ display: inline;
+ }
+
+
+#lresources{
+ position: absolute;
+ width: 800px;
+ left: 400px;
+ top: 49em;
+ text-align: left;
+ padding: 5px;
+ font-family: Arial, Helvetica, sans-serif;
+ }
+
+#lresources ul {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#lresources h3 {
+ margin: 0px;
+ margin-right: 10px;
+ color: #555F44;
+ font-size: 9px;
+ float: left;
+ font-weight: normal;
+ }
+
+#lresources li {
+ color:#555F44;
+ list-style-type: none;
+ float: left;
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+#lresources a:link, #lresources a:visited {
+ color: #555F44;
+ text-decoration: none;
+ font-size: 9px;
+ font-style: normal;
+ font-weight: normal;
+ }
+
+#lresources a:hover, #lresources a:active {
+ color: #000000;
+ text-decoration: underline;
+ }
+
+#lresources a.c, #lresources a:link.c , #lresources a:visited.c{
+ color: 422222;
+ }
+
+#lresources a:hover.c, #lresources a:active.c {
+ display: inline;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#explanation h3 {
+ background: transparent url(sowhat.gif) no-repeat top left;
+ margin-top: 10px;
+ width: 250px;
+ height: 32px;
+ float: left;
+ }
+#explanation h3 span {
+ display:none
+ }
+
+#participation h3 {
+ background: transparent url(part.gif) no-repeat top left;
+ margin-top: 10px;
+ width: 250px;
+ height: 32px;
+ float: left;
+ }
+
+#participation h3 span {
+ display:none
+ }
+
+#benefits h3 {
+ background: transparent url(ben.gif) no-repeat top left;
+ margin-top: 10px;
+ width: 120px;
+ height: 32px;
+ float: left;
+ }
+
+#benefits h3 span {
+ display:none
+ }
+
+#requirements h3 {
+ background: transparent url(rec.gif) no-repeat top left;
+ margin-top: 10px;
+ width: 470px;
+ height: 32px;
+ float: left;
+ }
+
+#requirements h3 span {
+ display:none
+ }
+
+#preamble h3 {
+ background: transparent url(road.gif) no-repeat top right;
+ margin-top: 10px;
+ width: 140px;
+ height: 32px;
+ float: left;
+ }
+
+#preamble h3 span {
+ display:none
+ }
+
+#pageHeader h1 {
+ background: transparent url(zen.gif) no-repeat top right;
+ margin-top: 10px;
+ width: 600px;
+ height: 180px;
+ float: left;
+ }
+
+#pageHeader h1 span {
+ display:none
+ }
+
+#pageHeader h2 {
+ background: transparent url(tune.jpg) no-repeat top right;
+ margin: 0px;
+ width: 321px;
+ height: 194px;
+ float: left;
+ }
+
+#pageHeader h2 span {
+ display:none
+ }
+
+#extraDiv1 {
+ position: absolute;
+ width: 1600px;
+ height: 400px;
+ top: 83px;
+ text-align: justify;
+ background: url(bgrnd.gif);
+ background-position: top;
+ z-index: 0;
+ }
+
+#extraDiv2 {
+ position: absolute;
+ width: 321px;
+ height: 194px;
+ left: 160px;
+ top: 330px;
+ text-align: justify;
+ background: url(radio.jpg);
+ background-position: top;
+ z-index: 0;
+ }
+/* css Zen Garden submission 059 - 'Dune Temple' by Greg Reimer, http://www.drpeterjones.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Greg Reimer */
+/* Added: November 9th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+
+/*
+For overview, the method of this sheet
+is to superimpose textual elements on
+top of fancy background graphics via
+CSS positioning. No FIR was used in the
+making of this sheet.
+*/
+
+body{
+margin:0px;
+padding:0px;
+background:#d18f00 url(decosides.gif) no-repeat 50% 0%;
+color:#946500;
+font-family:arial,helvetica,sans-serif;
+font-size:12px;
+text-align:center; /* so the container div centers itself in IE5/win */
+}
+a:link{
+color:#EFD396;
+text-decoration:none;
+}
+a:visited{
+color:#EFD396;
+text-decoration:none;
+}
+a:hover{
+color:#EFD396;
+text-decoration:underline;
+}
+a:active{
+color:#EFD396;
+text-decoration:none;
+}
+
+acronym{
+border:none;
+cursor:help;
+font-family:georgia,serif;
+}
+
+div#container{
+width:732px;
+margin:auto; /* ignored by IE5/win */
+background:url(main_top.png) no-repeat 0% 0%;
+position:relative;
+}
+
+div#pageHeader{
+text-align:center;
+margin-bottom:156px;
+height:13px;
+}
+
+div#pageHeader h1,div#pageHeader h2{
+text-transform:lowercase;
+margin:0px;
+font-family:arial,helvetica,sans-serif; /* being verbose because font shorthand caused IE5/win to botch */
+font-size:10px;
+font-weight:normal;
+letter-spacing:8px;
+display:inline;
+}
+
+div#pageHeader h1:after{
+content:":"; /* ignored by IE */
+}
+
+div#quickSummary,div#preamble,div#explanation,div#participation,div#benefits,div#requirements,div#footer{
+color:#CFA343;
+padding:0px 325px 0px 27px;
+text-align:justify;
+}
+
+div#container p,div#container h3{
+margin:10px 0px;
+}
+
+div#container div#intro h3,div#container div#supportingText h3{
+color:#EFD396;
+font:bold 12px verdana,sans-serif;
+}
+
+div#container div#intro h3{
+padding:2px 5px 3px 5px;
+background:url(headerbg.png) no-repeat right top;
+}
+
+html>body div#container div#supportingText h3{ /* IE/win bug workaround */
+padding:2px 5px 3px 5px;
+background:url(headerbg.png) no-repeat right top;
+}
+
+div#quickSummary{
+margin:0px 325px 0px 27px;
+padding:0px 38px;
+text-align:center;
+color:#E8B74B;
+background:url(sides.png) no-repeat 50% 0%;
+min-height:82px;
+}
+
+div#quickSummary p{
+margin: 0px 0px 10px 0px;
+}
+
+div#quickSummary p.p1{
+font-weight:bold;
+}
+
+div#quickSummary p.p2{
+text-transform:lowercase;
+margin-bottom:0px;
+padding-bottom:10px;
+}
+
+div#quickSummary p:before{
+content:"::: ";
+font-family:verdana,sans-serif;
+color:#B68F3B;
+font-weight:bold;
+}
+
+div#quickSummary p:after{
+content:" :::";
+font-family:verdana,sans-serif;
+color:#B68F3B;
+font-weight:bold;
+}
+
+div#preamble{
+padding:0px;
+margin:0px 310px 0px 27px;
+height:259px;
+overflow:auto;
+voice-family: "\"}\"";
+voice-family: inherit;
+margin-right:325px;
+}
+
+html>body div#preamble{
+margin-right:325px;
+}
+
+div#supportingText{
+background:url(main_middle.png) repeat-y;
+}
+
+div#footer{
+padding-top:50px;
+padding-bottom:320px;
+background:#d18f00 url(main_bottom.png) no-repeat;
+text-align:center;
+}
+
+div#footer a{font:bold 12px verdana,sans-serif;}
+div#footer a:after,div#footer a:before{color:#b68f3b;content:":";}
+
+div#lselect{
+position:absolute;
+left: 424px;
+top: 155px;
+width:293px;
+}
+
+div#lselect h3{
+position:absolute;
+left:70px;
+top:12px;
+color:#7A5300;
+background:transparent;
+font-size:14px;
+height:14px;
+margin:0px;
+}
+
+div#lselect ul{
+list-style:none;
+padding: 0px 0px 71px 0px;
+margin: 59px 0px 0px 0px;
+background:url(list_bottom.png) no-repeat 100% 100%;
+voice-family: "\"}\"";
+voice-family: inherit;
+padding-bottom:74px;
+}
+
+html>body div#lselect ul{
+padding-bottom:74px;
+}
+
+div#lselect ul li{
+text-align:right;
+background:url(listitem.png) no-repeat 100% 0%;
+color:#fc0;
+font:normal 9px arial,helvetica,sans-serif;
+display:block;
+height:25px;
+padding: 6px 5px 5px 5px;
+margin-top:2px;
+voice-family: "\"}\"";
+voice-family: inherit;
+height:14px;
+padding: 6px 5px 5px 5px;
+margin-top:5px;
+}
+html>body div#lselect ul li{
+height:14px;
+padding: 6px 5px 5px 5px;
+margin-top:5px;
+}
+
+div#lselect ul a:link{
+color:#EFD396;
+text-decoration:underline;
+}
+div#lselect ul a:visited{
+color:#C89D40;
+text-decoration:underline;
+}
+div#lselect ul a:hover{
+color:#EFD396;
+text-decoration:none;
+}
+div#lselect ul a:active{
+color:#ff0;
+text-decoration:underline;
+}
+
+div#larchives{
+text-align:left;
+position:absolute;
+left:438px;
+top:534px;
+width:279px;
+}
+
+div#lresources{
+text-align:left;
+position:absolute;
+left:438px;
+top:658px;
+width:279px;
+}
+
+div#lfavorites{
+text-align:left;
+position:absolute;
+left:438px;
+top:843px;
+width:279px;
+z-index:100;
+}
+
+div#larchives h3,div#lresources h3,div#lfavorites h3{
+margin:0px;
+text-align:right;
+padding:0px 7px 17px 0px;
+background:url(list_top.png) no-repeat 100% 100%;
+color:#cfa343;
+font-size:14px;
+}
+
+div#larchives ul,div#lresources ul,div#lfavorites ul{
+list-style:none;
+padding:0px;
+margin:0px;
+padding-bottom:8px;
+background:url(list_bottom2.png) no-repeat 100% 100%;
+}
+
+div#larchives li,div#lresources li,div#lfavorites li{
+display:block;
+text-align:right;
+background:url(listitem.png) no-repeat 100% 0%;
+padding: 5px 9px 5px 5px;
+margin-bottom:2px;
+color:#fc0;
+font:bold 11px arial,helvetica,sans-serif;
+voice-family: "\"}\"";
+voice-family: inherit;
+margin:0px 0px 5px 0px;
+}
+
+html>body div#larchives li,html>body div#lresources li,html>body div#lfavorites li{
+height:15px;
+margin-bottom:5px;
+margin-top:0px;
+}
+
+div#larchives ul a:link,div#lresources ul a:link,div#lfavorites ul a:link{
+color:#EFD396;
+text-decoration:underline;
+}
+div#larchives ul a:visited,div#lresources ul a:visited,div#lfavorites ul a:visited{
+color:#C89D40;
+text-decoration:underline;
+}
+div#larchives ul a:hover,div#lresources ul a:hover,div#lfavorites ul a:hover{
+color:#EFD396;
+text-decoration:none;
+}
+div#larchives ul a:active,div#lresources ul a:active,div#lfavorites ul a:active{
+color:#ff0;
+text-decoration:underline;
+}
+
+div#lfavorites ul{
+padding-bottom:69px;
+background:url(list_bottom.png) no-repeat 100% 100%;
+}/* css Zen Garden submission 060 - 'Extreme Limits' by Richard Chatfield, http://www.engagecommerce.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Richard Chatfield */
+/* Added: November 14th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+/* basic elements */
+body {
+ font: 11px arial, verdana, sans-serif;
+ color: #fff;
+ background: #000 url(contentbg.jpg) repeat-y;
+ margin: 0px;
+}
+p {
+ font: 11pxt/16pt arial, verdana, sans-serif ;
+ margin-top: 0px;
+ text-align: justify;
+ }
+h3 {
+ font: italic 16px arial, verdana, sans-serif;
+ letter-spacing: 1px;
+ margin: 15px 0px 0px 0px;
+ color: #FFFF00;
+ font-weight: bolder;
+}
+
+ h5 {
+ font: italic 14px sans-serif, arial, verdana;
+ letter-spacing: 1px;
+ margin: 15px 0px 0px 10px;
+ color: #fff;
+ font-weight: bolder;
+}
+
+a:link {
+ font-weight: bold;
+ text-decoration: none;
+ color: #FFFF00;
+ }
+a:visited {
+ font-weight: bold;
+ text-decoration: none;
+ color: #FFFF00;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #FFFF00;
+ }
+
+
+/* specific divs */
+#container {
+ padding: 0px 0px 0px 0px;
+ margin: 0px 0px 0px 0px;
+ width: 780px;
+
+ }
+
+#intro {
+
+
+
+ }
+
+#pageHeader {
+ margin-top: 0px;
+ margin-bottom: 0px;
+ }
+
+/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
+#pageHeader h1 {
+ background: url(topbg.jpg) no-repeat top left;
+ margin-top: 0px;
+ margin-bottom: 0px;
+ width: 780px;
+ height: 255px;
+ }
+#pageHeader h1 span {
+ display: none;
+
+ }
+#pageHeader h2 {
+ background: url(zengardentitle.gif) no-repeat top left;
+ margin-top: -74px;
+ margin-left: 254px;
+ width: 393px;
+ height: 45px;
+
+ }
+#pageHeader h2 span {
+ display:none;
+ }
+
+#quickSummary {
+ clear:both;
+ margin: -78px 0px 0px 5px;
+ width: 160px;
+
+ }
+#quickSummary p {
+ width: 240px;
+ font: 10px;
+ text-align:center;
+ line-height: 12px;
+ }
+
+#preamble {
+ background: url(road2enlinghtenbg.jpg) no-repeat;
+ margin: 18px 5px 5px 3px;
+ width: 249px;
+ height: 500px;
+ float: left;
+
+ }
+
+#preamble h3 {
+ margin: 20px 10px 0px 15px;
+ width: 200px;
+}
+
+#preamble p {
+ margin: 10px 10px 0px 15px;
+ width: 210px;
+}
+
+
+
+#supportingText {
+ margin: 25px 145px 0px 255px;
+ text-align: left;
+ width: 370px;
+}
+
+#explanation p.p1 {
+ margin-right: 140px;
+ text-align: left;
+}
+#explanation p.p2 {
+ margin-right: 20px;
+ text-align: left;
+}
+
+
+
+
+#footer {
+ position: absolute;
+ top: 162px;
+ left: 275px;
+ width: 345px;
+ clear: both;
+ }
+#footer a:link, #footer a:visited {
+ margin: 0px 40px 0px 0px;
+ }
+
+#linkList {
+ background: url(road2enlinghtenbg.jpg) no-repeat;
+ position: absolute;
+ top: 580px;
+ text-align: left;
+ margin: 18px 5px 5px 5px;
+ width: 249px;
+ padding: 5px 0px 0px 10px;
+ }
+#linkList2 {
+ font: 10px verdana;
+ width: 226px;
+ }
+#linkList h3.select {
+ height: 30px;
+ }
+#linkList h3.select span {
+ font: 16px arial, verdana, sans-serif;
+ letter-spacing: 1px;
+ font-weight: bolder;
+ color: #CCD8F8;
+ text-decoration: underline;
+}
+#linkList h3.favorites {
+ height: 30px;
+ }
+#linkList h3.favorites span {
+ font-style: normal;
+ text-decoration : underline;
+ color: #CCD8F8;
+ }
+#linkList h3.archives {
+ height: 30px;
+ }
+#linkList h3.archives span {
+ font-style: normal;
+ text-decoration : underline;
+ color: #CCD8F8;
+ }
+#linkList h3.resources {
+ height: 30px;
+ }
+#linkList h3.resources span {
+ font-style: normal;
+ text-decoration : underline;
+ color: #CCD8F8;
+ }
+
+
+#linkList ul {
+ margin: 0px;
+ padding: 0px;
+ }
+#linkList li {
+ list-style-type: none;
+ background: transparent url(cr1.gif) no-repeat top center;
+ display: block;
+ margin-bottom: 2px;
+ }
+#linkList li a:link {
+ color: #10184A;
+ }
+#linkList li a:hover {
+ color: #FFFF00;
+ }
+#linkList li a:visited {
+ color: #10184A;
+ }
+
+
+
+#extraDiv1 {
+ position: absolute;
+ top: 10px;
+ left: 490px;
+ background: url(guyflying.gif) no-repeat;
+ width: 285px;
+ height: 483px;
+ }
+
+#extraDiv2 {
+ position: absolute;
+ top: 1000px;
+ left: 0px;
+ background: url(flyerdude.jpg) no-repeat;
+ width: 255px;
+ height: 339px;
+ }
+
+
+ /* css Zen Garden submission 061 - 'Sky' by Stefan Petre, http://www.eyecon.ro/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Stefan Petre */
+/* Added: November 14th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+ font: 10px Arial, Helvetica, sans-serif;
+ margin: 0px;
+ padding: 0px;
+ text-align: center;
+ background-position : center;
+ background-image : url(page_fill.jpg) ;
+ background-repeat : repeat-y;
+}
+
+a:link {
+ color: #00f;
+ }
+a:visited {
+ color: #99f;
+ }
+a:hover, a:active {
+text-decoration: none;
+ }
+
+acronym {
+ border-bottom: 1px dotted #eee;
+ cursor : help;
+}
+
+#container {
+ width: 700px;
+ margin: 0px auto;
+ text-align : left;
+ background-image : url(right_fill.jpg);
+ background-repeat : repeat-y;
+ clear : both;
+ background-color : #ff;
+}
+
+#intro {
+ width: 700px;
+ height: 246px;
+ overflow: hidden;
+ background-image : url(header_intro.jpg);
+ background-position : bottom;
+ background-repeat : no-repeat;
+ text-align : right;
+ color : #fff;
+ clear : both;
+}
+#pageHeader {
+ width: 700px;
+ height : 36px;
+ overflow : hidden;
+ background-image : url(header_title.jpg);
+}
+
+
+#pageHeader h1 {
+ display : none;
+}
+
+#pageHeader h2 {
+ display : none;
+}
+
+#quickSummary {
+ float: right;
+ width: 400px;
+ margin : 0px 3px;
+ height: 40px;
+ overflow: auto;
+}
+
+#quickSummary p {
+ margin: 0px;
+}
+
+#quickSummary a{
+ color: #eee;
+}
+
+#preamble {
+ float: left;
+ width: 400px;
+ margin : 0px 3px;
+ text-align : left;
+ height: 142px;
+ overflow: auto;
+}
+
+#preamble p {
+ margin: 0px;
+}
+
+#preamble h3{
+ margin: 8px 0px;
+ font-size: 18px;
+}
+#supportingText {
+ width : 440px;
+ text-align : left;
+ float : right;
+}
+
+#linkList {
+ background-image : url(right_fill.jpg);
+ width : 250px;
+ text-align : left;
+ background-position : left;
+ min-height : 1140px;
+ padding-bottom: 20px;
+}
+
+#linkList2 {
+ background-image : url(right_start.jpg);
+ background-position : top;
+ background-repeat : no-repeat;
+ padding-top: 20px;
+}
+
+
+#lselect h3{
+ background-image : url(label_select.jpg);
+ background-repeat : no-repeat;
+ margin : 4px 0px 4px 20px;
+ height : 16px;
+}
+
+#lfavorites h3{
+ background-image : url(label_favorites.jpg);
+ background-repeat : no-repeat;
+ margin : 4px 0px 4px 20px;
+ height : 16px;
+}
+
+#larchives h3{
+ background-image : url(label_archives.jpg);
+ background-repeat : no-repeat;
+ margin : 4px 0px 4px 20px;
+ height : 16px;
+}
+
+#lresources h3{
+ background-image : url(label_resources.jpg);
+ background-repeat : no-repeat;
+ margin : 4px 0px 4px 20px;
+ height : 16px;
+}
+
+
+#linkList2 h3 span{
+ display : none;
+}
+
+#linkList2 ul{
+ list-style-type : none;
+ margin-bottom: 30px;
+}
+
+#linkList2 li{
+ margin: 4px;
+}
+
+#lselect a{
+ display : block;
+ color: #ffd;
+ font-size: 13px;
+}
+#linkList2 a{
+ color: #ffd;
+ font-size: 13px;
+}
+
+#linkList2 a.c{
+ display : inline;
+ font-size: 11px;
+ color: #ddd;
+}
+
+#explanation h3{
+ background-image : url(label_about.jpg);
+}
+
+#participation h3{
+ background-image : url(label_participation.jpg);
+}
+
+#benefits h3{
+ background-image : url(label_benefits.jpg);
+}
+#requirements h3{
+ background-image : url(label_requirements.jpg);
+}
+
+#supportingText h3 span{
+ display : none;
+}
+#supportingText h3 {
+ margin: 0px;
+ background-repeat : no-repeat;
+ height : 37px;
+ width : 237px;
+ background-position : left;
+}
+
+#supportingText p{
+ margin: 10px 6px 6px 70px;
+ text-align : justify;
+}
+
+#extraDiv1{
+ clear: both;
+}
+
+#explanation,
+#participation ,
+#benefits,
+#requirements
+{
+ margin-bottom: 20px;
+ padding-bottom: 20px;
+ background-image : url(paragraf_back.jpg);
+ background-position: bottom;
+ background-repeat: no-repeat;
+}
+
+#footer {
+ text-align: center;
+}
+
+#footer a:link, #footer a:visited {
+ margin-right: 20px;
+}/* css Zen Garden submission 062 - 'Gemination' by Egor Kloos, http://www.dutchcelt.nl/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Egor Kloos */
+/* Added: November 14th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+
+
+/* Internet Explorer */
+
+/* basic elements */
+body { margin: 0 0 0 0; text-align: center; background: #600 none; }
+p { font: normal 11px/12px arial, sans-serif; }
+ul, li { font: bold 11px/19px arial, sans-serif; list-style-type: none; }
+h3 { margin: 0; padding: 0; font: bold 10px/10px arial, sans-serif;}
+a:link { color: #f90; }
+a:visited { color: #f90; }
+a:hover,
+a:active { color: #fff; }
+
+/* specific divs */
+#container { position: relative; margin: 0 auto 0 auto; border-right: 3px solid #fff; border-left: 3px solid #fff; padding: 0 20px 0 20px; width: 706px; background: url(contentback.gif); voice-family: "\"}\""; voice-family:inherit; width: 666px; }
+html>body #container { width:666px; }
+#intro { margin: 0; padding: 0; width: 660px; height: 80px; background: transparent url(introkop.gif) no-repeat right top; }
+#pageHeader h1 { margin: 0; padding: 0; width: 660px; height: 80px; background: transparent url(ietitle.gif) no-repeat left top; }
+#pageHeader h1 span { display:none; }
+#pageHeader h2 span { display:none; }
+#quickSummary { position: absolute; top: 80px; left: 380px; margin: 0 0 20px 0; padding: 275px 0 0 0; width: 300px; background: transparent url(boxmodel.jpg) no-repeat top left; }
+#quickSummary p { margin: 0; padding: 0 0 10px 0; color: #D9BC91; font: bold 12px/15px arial; text-align: left; background: transparent; }
+#preamble { position: absolute; top: 80px; left: 20px; display: block; margin: 0; padding: 0 0 0 0; width: 333px; height: 258px; background: #513125 url(iebulb.jpg) no-repeat top left; }
+#preamble p { margin: 0; padding: 0 20px 8px 20px; color: #fff; font: normal 11px/15px Georgia, serif; }
+#preamble h3 { margin: 0; border-top: 5px solid #3D2117; padding: 0; width: 333px; height: 40px; background: transparent url(ietheroad.gif) no-repeat top center; }
+#preamble h3 span { display:none; }
+#supportingText { float: left; margin: 245px 0 0 0; border-top: 5px solid #3D2117; padding: 0 0 30px 0; width: 333px; text-align: left; background: #fff; }
+/* commented backslash hack v2 \*/
+#supportingText { float: left; margin: 260px 0 0 0; border-top: 5px solid #3D2117; padding: 0 0 30px 0; width: 333px; text-align: left; background: #fff; }
+/* end hack */
+#supportingText p { clear: right; padding: 0 20px 0 20px; font: normal 12px/15px arial, sans-serif; }
+#supportingText a:link,
+#supportingText a:visited { color: #900; }
+#supportingText a:hover,
+#supportingText a:active { color: #30c; }
+#explanation h3 { margin: 0 0 0 20px; padding: 0; width: 280px; height: 40px; background: transparent url(iezentext1.gif) no-repeat bottom left; }
+#explanation h3 span { display: none; }
+#explanation p.p1 { font: bold 12px/15px arial, sans-serif; }
+#participation h3 { margin: 0 0 0 20px; width: 290px; height: 25px; background: transparent url(iezentext2.gif) no-repeat left top; }
+#participation h3 span { display: none; }
+#benefits h3 { margin: 0 0 0 20px; width: 290px; height: 25px; background: transparent url(iezentext3.gif) no-repeat left top; }
+#benefits h3 span { display: none; }
+#requirements h3 { margin: 0 0 0 20px; width: 290px; height: 25px; background: transparent url(iezentext4.gif) no-repeat left top; }
+#requirements h3 span { display: none; }
+#footer { border-top: 1px dotted #444; padding: 15px 0 30px 0; text-align: center; }
+#footer a:link,
+#footer a:visited { font: bold 12px/15px Georgia, serif; color: #600; background: transparent; }
+#linkList { clear: both; }
+#linkList2 { position: absolute; top: 450px; left: 380px; width: 300px; text-align: left; }
+#lselect h3.select { padding: 0 0 0 0; width: 280px; height: 40px; background: transparent url(ienavtext1.gif) no-repeat left top; }
+#lselect h3 span { display: none; }
+#larchives h3.archives { padding: 0 0 0 0; width: 280px; height: 40px; background: transparent url(ienavtext2.gif) no-repeat left top; }
+#larchives h3 span { display: none; }
+#lresources h3.resources { padding: 0 0 0 0; width: 280px; height: 40px; background: transparent url(ienavtext3.gif) no-repeat left top; }
+#lresources h3 span { display: none; }
+#lselect ul { margin: 0; padding: 0 0 60px 0; }
+#larchives { margin: 0; padding: 180px 0 0 0; width: 300px; vertical-align: bottom; background: transparent url(ieboxes.gif) no-repeat right top; }
+#larchives ul { margin: 0; padding: 0 0 30px 0; }
+#lresources ul { margin: 0; padding: 0;}
+#lselect li a { display: inline; }
+#linkList li a:link { color: #f90; }
+#linkList li a:visited { color: #f90; }
+#lselect li a.c { display: inline; }
+#lselect li a.c:link { color: #fff; }
+#lselect li a.c:visited { color: #fff; }
+#linkList li a:hover,
+#linkList li a:active { color: #6CF; }
+#lselect li a.c:hover,
+#linkList li a.c:active { color: #6CF; }
+#extraDiv1 { }
+
+/* Mozilla - Safari - Opera */
+
+/* basic elements */
+/* Background pattern design by Travis Beckham. www.squidfingers.com */
+body[id=css-zen-garden] { margin: 100px 0 0 0; padding: 0; text-align: center; background: transparent url(squidback.gif); }
+body[id=css-zen-garden] p { font: normal 11px/12px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; }
+body[id=css-zen-garden] ul,
+body[id=css-zen-garden] li { font: bold 9px/10px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; list-style-type: none; color: #fff; background: transparent; }
+body[id=css-zen-garden] h3 { margin: 0; padding: 0; font: bold 13px/15px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; }
+body[id=css-zen-garden] a:link { color: #f90; }
+body[id=css-zen-garden] a:visited { color: #f90; }
+body[id=css-zen-garden] a:hover,
+body[id=css-zen-garden] a:active { color: #fff; }
+
+/* specific divs */
+body[id=css-zen-garden] #container { position: relative; margin: 0 0 0 0; border-top: 5px solid #fff; border-right: 0; border-bottom: 5px solid #fff; border-left: 0; padding: 0 0 0 0; width: 100%; height: 350px; background: url(longgarden.gif) repeat-x center right; }
+body[id=css-zen-garden] #intro { position: absolute; top: 0; left: 0; float: none; margin: 0; width: 100%; height: 350px; background: none; }
+body[id=css-zen-garden] #pageHeader { position: absolute; top: -103px; left: 0; margin: 0;}
+body[id=css-zen-garden] #pageHeader h1 { background: transparent url(zentitle.png) no-repeat top left; margin-top: 20px; width: 470px; height: 90px; float: left; }
+body[id=css-zen-garden] #pageHeader h1 span { display: none; }
+body[id=css-zen-garden] #pageHeader h2 span { display: none; }
+body[id=css-zen-garden] #quickSummary { position: absolute; top: 370px; left: 0; padding: 0; width: 100%; height: 100px; background: transparent url(starlogo.png) no-repeat bottom center; }
+body[id=css-zen-garden] #quickSummary p { margin: 0; padding: 0 0 0 20px; color: #D9BC91; font: normal 11px/14px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; text-align: left; background: transparent; }
+body[id=css-zen-garden] #preamble { position: absolute; top: 30px; left: 20px; display: block; margin: 0; border: 1px dotted #fff; padding: 0;width: 196px; height: 290px; background: transparent url(blk35.png) repeat; overflow: hidden; }
+body[id=css-zen-garden] #preamble p { margin: 0; padding: 0px 10px 5px 10px; color: #fff; font: normal 10px/13px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; }
+body[id=css-zen-garden] #preamble h3 { border: 0; width: 196px; height: 40px; background: transparent url(theroad.png) no-repeat top left; }
+body[id=css-zen-garden] #preamble h3 span { display: none; }
+body[id=css-zen-garden] #supportingText { position: absolute; top: 0; left: 465px; margin: 0; border: 0; padding: 0 20px 30px 20px; width: 325px; height: 320px; text-align: left; background: transparent url(maintext.png) repeat-y left top; overflow: auto; }
+body[id=css-zen-garden] #supportingText p { padding: 0; font: normal 12px/15px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; }
+body[id=css-zen-garden] #supportingText a:link,
+body[id=css-zen-garden] #supportingText a:visited { color: #900; }
+body[id=css-zen-garden] #supportingText a:hover,
+body[id=css-zen-garden] #supportingText a:active { color: #30c; }
+body[id=css-zen-garden] #explanation h3 { float: left; margin: 0; padding: 0 0 5px 0; width: 300px; height: 25px; background: transparent url(zentext1.png) no-repeat left top; }
+body[id=css-zen-garden] #explanation h3 span { display: none; }
+body[id=css-zen-garden] #explanation p.p1 { font: bold 12px/15px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; }
+body[id=css-zen-garden] #participation h3 { float: left; margin: 0; width: 300px; height: 25px; background: transparent url(zentext2.png) no-repeat top left; }
+body[id=css-zen-garden] #participation h3 span { display: none; }
+body[id=css-zen-garden] #benefits h3 { float: left; margin: 0; width: 300px; height: 25px; background: transparent url(zentext3.png) no-repeat top left; }
+body[id=css-zen-garden] #benefits h3 span { display: none; }
+body[id=css-zen-garden] #requirements h3 { float: left; margin: 0; width: 300px; height: 25px; background: transparent url(zentext4.png) no-repeat top left; }
+body[id=css-zen-garden] #requirements h3 span { display:none; }
+body[id=css-zen-garden] #footer { border-top: 1px dotted #444; padding: 15px 0 30px 0; text-align: center; }
+body[id=css-zen-garden] #footer a:link,
+body[id=css-zen-garden] #footer a:visited { margin-right: 20px; }
+body[id=css-zen-garden] #linkList { position: absolute; top: 0; left: 830px; width: 150px; height: 350px; text-align: left; overflow: hidden; }
+body[id=css-zen-garden] #linkList2 { position: absolute; top: 0; left: 0px; width: 150px; height: 350px; }
+body[id=css-zen-garden] #lselect { position: absolute; top: 0; left: 0; width: 150px; height: 126px; z-index: 300; }
+body[id=css-zen-garden] #lselect ul { position: absolute; top: 0; left: 0px; margin: 0; padding: 10px 0 12px 0; width: 135px; height: 328px; background: transparent url(grass.jpg) left top; }
+body[id=css-zen-garden] #lselect li { margin: 0; padding: 0 10px 10px 10px; }
+body[id=css-zen-garden] #larchives { position: absolute; top: 131px; left: 0; padding: 0; width: 150px; height: 72px; background: none; z-index: 200; }
+body[id=css-zen-garden] #larchives ul { position: absolute; top: -131px; left: 0px; margin: 0; padding: 10px 0 12px 0; width: 135px; height: 328px; background: transparent url(grass.jpg) left top; }
+body[id=css-zen-garden] #larchives li { margin: 0; padding: 0 10px 8px 10px; }
+body[id=css-zen-garden] #lresources { position: absolute; top: 208px; left: 0; height: 92px; z-index: 100; }
+body[id=css-zen-garden] #lresources ul { position: absolute; top: -208px; left: 0px; margin: 0; padding: 10px 0 12px 0; width: 135px; height: 328px; background: transparent url(grass.jpg) left top; }
+body[id=css-zen-garden] #lresources li { margin: 0; padding: 0 10px 8px 10px; }
+body[id=css-zen-garden] #lselect h3.select { padding: 0 0 0 0; width: 150px; height: 126px; background: transparent url(zentab1.png) no-repeat 135px 0px; }
+body[id=css-zen-garden] #lselect h3 span { display: none; }
+body[id=css-zen-garden] #larchives h3.archives { padding: 0 0 0 0; width: 150px; height: 72px; background: transparent url(zentab2.png) no-repeat 135px 0px; }
+body[id=css-zen-garden] #larchives h3 span { display: none; }
+body[id=css-zen-garden] #lresources h3.resources { padding: 0 0 0 0; width: 150px; height: 92px; background: transparent url(zentab3.png) no-repeat 135px 0px; }
+body[id=css-zen-garden] #lresources h3 span { display: none; }
+body[id=css-zen-garden] #lselect:hover,
+body[id=css-zen-garden] #lselect h3:hover { background: transparent url(zentab1.png) no-repeat 135px -126px; z-index: 300; }
+body[id=css-zen-garden] #larchives:hover,
+body[id=css-zen-garden] #larchives h3:hover { background: transparent url(zentab2.png) no-repeat 135px -72px; z-index: 300; }
+body[id=css-zen-garden] #lresources:hover,
+body[id=css-zen-garden] #lresources h3:hover { background: transparent url(zentab3.png) no-repeat 135px -92px; z-index: 300; }
+body[id=css-zen-garden] #linkList2 li>a { font: bold 11px/13px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif;}
+body[id=css-zen-garden] #lselect li>a { display:block; padding: 0 0 2px 0; font: bold 11px/13px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif;}
+body[id=css-zen-garden] #lselect li>a.c { display:inline; font: bold 9px/10px "Lucida Grande","Lucida Sans Unicode", helvetica, arial, sans-serif; }
+body[id=css-zen-garden] #lselect li>a.c:link { color: #fff; }
+body[id=css-zen-garden] #lselect li>a.c:visited { color: #fff; }
+body[id=css-zen-garden] #lselect li>a.c:hover,
+body[id=css-zen-garden] #lselect li>a.c:active { color: #6CF; }
+body[id=css-zen-garden] #linkList li a:link { color: #f90; }
+body[id=css-zen-garden] #linkList li a:visited { color: #f90; }
+body[id=css-zen-garden] #linkList li a:hover,
+body[id=css-zen-garden] #linkList li a:active { color: #6CF; }
+body[id=css-zen-garden] #extraDiv1 { position: absolute; top: 105px; left: 200px; width: 250px; height: 350px; background: url(intro.png) no-repeat left top; }/* css Zen Garden submission 063 - 'Elastic Lawn' by Patrick Griffiths, http://htmldog.com/ptg/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Patrick Griffiths */
+/* Added: December 5th, 2003 */
+
+/* IMPORTANT */
+/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
+/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
+/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
+
+
+body {
+ font-family: arial, Helvetica, sans-serif;
+ font-size: 77%; /* initially set to percentage so that ems work without producing miniscule text in IE */
+ text-align: center; /* needed to center the container in IE5.x because it doesn't like 'margin: 0 auto' */
+ color: #dfd;
+ background: #1b890e url(grass.jpg); /* defines the colour as well as the background image so that an average colour is shown while the image loads */
+ padding: 0 0 6em 0;
+ margin: 0;
+}
+
+#container {
+ width: 48em;
+ text-align: left; /* resets the text alignment */
+ margin: 0 auto; /* centers the container */
+}
+
+p {
+ padding: 0;
+ margin: 0;
+}
+
+p span {
+ display: block;
+ padding: 0 4em 1em 4em;
+}
+
+a {
+ color: #fe6;
+ background: url(underline1light.gif) bottom repeat-x;
+ text-decoration: none;
+}
+
+a:hover { background-image: url(underline2light.gif); }
+
+acronym { border: 0; }
+
+
+
+
+
+/*------------Hidden elements------------*/
+
+h1 span, h2, #intro h3 span, #supportingText h3 span, #linkList h3.xselect {
+ /* The equivalent of 'display: none' but leaves the elements readable by some screen readers */
+ position: absolute;
+ overflow: hidden;
+ clip: rect(0,0,0,0);/* because 'height: 0' doesn't have any fun in IE5.5 */
+ height: 0;/* because clip doesn't have any fun in IE6 */
+}
+
+
+
+
+
+/*------------Main heading and Quick Summary------------*/
+
+#intro #pageHeader { padding: 0; }
+
+h1 {
+ position: relative;
+ top: 19px;
+ left: -24px;
+ height: 8em;
+ font-size: 1em;
+ background: url(logo.gif) bottom left no-repeat;
+ padding: 0;
+ margin: 0;
+}
+
+#quickSummary {
+ height: 8.1em; /* ensures that the linkList top fits directly below */
+ background: #fc3 url(yellowdiagonal.gif);
+}
+
+#quickSummary p span {
+ color: #030;
+ margin: 0;
+}
+
+#quickSummary .p1 span {
+ font-weight: bold;
+ background: url(curve.gif) top right no-repeat;
+ padding: 2.2em 15em 1em 3em;
+}
+
+#quickSummary .p2 span {
+ position: absolute;
+ top: 10.3em;
+ left: 50%;
+ width: 22em;
+ text-align: center;
+ padding: 0 0 0 11em;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 11em;
+}
+html>#quickSummary .p2 { width: 11em; }
+
+#quickSummary a {
+ color: #070;
+ background-image: url(underline1dark.gif);
+}
+
+#quickSummary a:hover { background-image: url(underline2dark.gif); }
+
+
+
+
+
+/*------------Preamble, Supprting Text and Footer------------*/
+
+#preamble, #supportingText {
+ width: 32em;
+ background: #0d4407 url(grassdark.jpg);
+ margin-left: 16em;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ margin: 0 0 0 auto;
+}
+html>#preamble, html>#supportingText { margin: 0 0 0 auto; }
+
+#benefits p {
+ /* because otherwise IE 6 goes crazy */
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ position: relative;
+ top: -1.5em;
+ margin: 1.5em 0 -1.5em 0;
+}
+#benefits>p {
+ top: 0;
+ margin: 0;
+}
+
+#preamble , #supportingText div { padding: 0 0 2.5em 0; }
+
+#explanation, #benefits {
+ color: #030;
+ background: #fc3 url(yellowdiagonal.gif);
+ margin: 0 2em;
+}
+
+#preamble .p1, #participation .p1, #requirements .p1 {
+ position: relative;
+ top: -15px;
+ background: url(corner_yelongreen_br.gif) top right no-repeat;
+ margin: 0 2em -15px 2em;
+}
+
+#preamble .p1 {
+ margin: 0 0 -15px 0;
+}
+
+#participation .p1 span, #requirements .p1 span {
+ display: block;
+ background: url(corner_yelongreen_bl.gif) top left no-repeat;
+ padding-top: 4em;
+ padding-right: 2em;
+ padding-left: 2em;
+}
+
+#preamble .p1 span {
+ display: block;
+ padding-top: 4em;
+}
+
+#explanation .p1, #benefits .p1 {
+ background: url(corner_yelongreen_tl.gif) top left no-repeat;
+}
+
+#explanation .p1 span, #benefits .p1 span {
+ display: block;
+ background: url(corner_yelongreen_tr.gif) top right no-repeat;
+ padding-top: 3em;
+}
+
+#intro h3, #supportingText h3 {
+ position: relative;
+ top: -13px;
+ height: 13px;
+ background: url(enlightenment.gif) bottom center no-repeat;
+ padding: 0;
+ margin: 0 0 -13px 0;
+}
+
+#explanation h3 { background-image: url(about.gif); }
+#participation h3 { background-image: url(participation.gif); }
+#benefits h3 { background-image: url(benefits.gif); }
+#requirements h3 { background-image: url(requirements.gif); }
+
+#footer {
+ text-align: center;
+ background: url(corner_grassdarkongrass_bl.gif) bottom left no-repeat;
+ padding: 4em 0;
+}
+
+#extraDiv1 {
+ position: relative;
+ top: -15px;
+ width: 48em;
+ height: 15px;
+ background: url(corner_grassdarkongrass_br.gif) bottom right no-repeat;
+ margin: 0 auto;
+}
+
+
+
+
+
+
+/*------------Link List------------*/
+
+#linkList {
+ position: absolute;
+ top: 16.1em;
+ width: 16em;
+ margin: 0;
+}
+
+#linkList2 {
+ background: #5b460b url(grassbrown.jpg);
+ padding: 0;
+}
+
+#linkList h3 {
+ font-family: "Trebuchet MS", arial, Helvetica, sans-serif;
+ font-size: 1.2em;
+ text-transform: uppercase;
+ text-align: center;
+ color: #fc3;
+ margin: 0;
+}
+
+#linkList h3.select {
+ position: relative;
+ top: -15px;
+ width: 13.3333em;
+ background: url(corner_yelonbrown_bl.gif) top left no-repeat;
+ padding: 0;
+ margin-bottom: -15px;
+}
+
+h3.select span {
+ display: block;
+ position: relative;
+ left: 15px;
+ background: url(twirl.gif) top right no-repeat;
+ padding-right: 15px;
+ padding-top: 2.5em;
+ margin-left: -15px;
+}
+
+#linkList a {
+ color: #efe;
+ background-image: url(underline1yellow.gif);
+}
+
+#linkList a:hover {
+ background-image: url(underline2yellow.gif);
+}
+
+ul {
+ list-style: none;
+ padding: 1em 1.5em;
+ margin: 0;
+}
+
+li {
+ padding-left: 1.5em;
+ margin-bottom: 1em;
+}
+
+li/* */ {
+ background: url(bullet.gif) left no-repeat;
+}
+
+#lselect ul a {
+ display: block;
+ font-family: "Trebuchet MS", arial, Helvetica, sans-serif;
+ font-weight: bold;
+}
+
+#lselect ul a.c {
+ display: inline;
+ font-family: arial, Helvetica, sans-serif;
+ font-weight: normal;
+}
+
+#lresources {
+ position: relative;
+ top: 15px;
+ background: url(curvebl2.gif) bottom right no-repeat;
+ padding-bottom: 15px;
+ margin-top: -15px;
+}
+
+#lresources ul {
+ background: url(curvebl.gif) bottom left no-repeat;
+}/* css Zen Garden submission 064 - 'Night Drive' by Dave Shea, http://www.mezzoblue.com/ */ +/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */ +/* All associated graphics copyright 2003, Dave Shea */ +/* Added: December 6th, 2003 */ + +/* IMPORTANT */ +/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */ +/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */ +/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */ + + +html { + margin: 0; + padding: 0; + } + +body { + color: #A05B00; + background: #000 url(bg1.gif) repeat; + text-align: center; + font: 11px/18px helvetica, arial, sans-serif; + text-transform: lowercase; + margin: 0; + padding: 0; + } +a:link { + color: #FFC000; + text-decoration: none; + } +a:visited { + color: #D79900; + text-decoration: underline; + } +a:hover { + color: #FF0; + text-decoration: underline; + } + +p { + padding: 0 0 0.3em 14px; + } +h3 { + font-size: 12px; + color: #CA7400; + margin-bottom: 0; + padding-left: 14px; + background: transparent url(w1.gif) 0 2px no-repeat; + } +h3 + p { + margin-top: 0; + } +acronym { + font-style: normal; + border-bottom: none; + } + +/* structure */ +#container { + background-color: #000; + width: 770px; + text-align: left; + margin-left: auto; + margin-right: auto; + border-left: double 3px #332511; + border-right: double 3px #332511; + } + + + +/* header */ +h1 span, h2 span { + display: none; + } +h1 { + width: 770px; + height: 166px; + margin: 0; + background: #000 url(bg2.gif) top left no-repeat; + } +h2 { + width: 244px; + height: 42px; + background: #000 url(h1.gif) top left no-repeat; + position: absolute; + top: 120px; + margin: 0; + margin-left: 495px; + } + + +/* content */ +#quickSummary, #preamble, #supportingText { + margin: 0 0 0 400px; + padding: 1px 0; /*1px 10px 1px 10px;*/ + background: transparent url(bg4.gif) top left repeat-y; + width: 342px; + } +#quickSummary h3, #preamble h3, #supportingText h3 { + margin: 0 10px; +} +#quickSummary p, #preamble p, #supportingText p { + margin: 0 0 10px 10px; +} + +#quickSummary { + border-top: solid 1px #332511; + padding-top: 10px; + } + + +/* sidebar */ +#linkList { + position: absolute; + top: 166px; + width: 400px; + height: 633px; + color: #132F5B; /*#742500;*/ + background: transparent url(bg3.gif) top left repeat-x; + border-top: solid 1px #332511; + line-height: 12px; + padding-top: 20px; + } +#linkList ul { + margin: 0; + padding: 0; + } +#linkList li { + list-style-type: none; + padding: 0; + margin-bottom: 0.5em; + } +#lselect li { + padding: 3px 3px 3px 16px; + background: transparent url(w2.gif) 3px 3px no-repeat; +} +#lselect li a:link, #lselect li a:visited { + display: block; +} +#linkList h3 { + padding-left: 0; + background-image: none; + } +#linkList h3 span { + display: none; +} +#linkList a, #linkList a:link { + color: #AF4F0A; + font-weight: bold; +} +#linkList li a.c:link, #linkList li a.c:visited { + color: #742500; + font-weight: normal; + display: inline; + text-decoration: none; +} +#linkList a.c:hover { + text-decoration: underline; +} + +#linkList h3.select { + width: 160px; + height: 12px; + background: transparent url(h-select.gif) top left no-repeat; + margin-bottom: 0.5em; +} +#linkList h3.archives { + width: 180px; + height: 12px; + background: transparent url(h-archives.gif) top left no-repeat; + margin-bottom: 0.5em; +} +#linkList h3.resources { + width: 180px; + height: 12px; + background: transparent url(h-resources.gif) top left no-repeat; + margin-bottom: 0.5em; +} + + +#lselect { + width: 160px; + float: left; + padding-left: 50px; +} + +/* CSS MOSe hovers */ +* > #lselect li { + margin-top: -7px; + padding: 5px 5px 5px 18px; + background-position: 5px 5px; + margin-right: 10px; + border: solid 1px transparent; +} +#lselect li:hover { + background: #2A1812; + border-color: #452310; +} +#lselect li:hover a { + color: #FF9D14; +} +#lselect li:hover a.c { + color: #E84900; +} + + +#larchives { + padding-top: 1px; +} +#larchives, #lresources { + padding-left: 200px; +} + +#footer { + text-align: right; + padding: 5px 10px 100px 15px; + background: url(skyline.jpg) bottom left repeat-x; + position: relative; + left: 3px; + width: 342px; + margin: 0; +} + + +/* extra bits */ +#extraDiv1 { + position: absolute; + top: 41px; + left: 0; + text-align: center; + width: 100%; + } +#extraDiv1 span { + width: 400px; + height: 123px; + background: transparent url(granville.jpg) top left no-repeat; + display: block; + margin-left: auto; + margin-right: auto; + padding-right: 370px; + width: 770px; + voice-family: "\"}\""; + voice-family:inherit; + width: 400px; + } +html>body #extraDiv1 span { + width: 400px; +} +#extraDiv2 { + position: absolute; + top: 41px; + left: 0; + text-align: center; + width: 100%; + } +#extraDiv2 span { + height: 70px; + background: transparent url(falsecreek.jpg) top right no-repeat; + display: block; + margin-left: auto; + margin-right: auto; + padding-left: 402px; + width: 769px; + voice-family: "\"}\""; + voice-family:inherit; + width: 367px; + } +html>body #extraDiv2 span { + width: 367px; +} +#extraDiv3 { + position: absolute; + top: 0; + left: 0; + width: 100%; + text-align: center; +} +#extraDiv3 span { + text-align: left; + width: 770px; + height: 38px; + background: transparent url(bg5.gif) top left repeat-x; + display: block; + margin-left: auto; + margin-right: auto; +} +#extraDiv4 { + position: absolute; + top: 0; + left: 0; + width: 100%; + text-align: center; +} +/* IE doesn't support PNG transparency. No soup for you. */ +html>body #extraDiv4 span { + width: 790px; + height: 94px; + background: transparent url(seal.png) top right no-repeat; + display: block; + margin-left: auto; + margin-right: auto; +}/* css Zen Garden submission 065 - 'New Groove' by Martin Neumann, http://www.rushmedia.de/ */</ |