summaryrefslogtreecommitdiff
path: root/test/data
diff options
context:
space:
mode:
Diffstat (limited to 'test/data')
-rw-r--r--test/data/Aliases302
-rw-r--r--test/data/csdetect/INDEX6
-rw-r--r--test/data/csdetect/bom-charset.dat21
-rw-r--r--test/data/csdetect/bom.datbin0 -> 388 bytes
-rw-r--r--test/data/css/INDEX6
-rw-r--r--test/data/css/allzengarden.css52816
-rw-r--r--test/data/css/simple.css47
7 files changed, 53198 insertions, 0 deletions
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
new file mode 100644
index 0000000..f8c3070
--- /dev/null
+++ b/test/data/csdetect/bom.dat
Binary files differ
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 Clment '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, Clment 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/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Martin Neumann */
+/* Added: December 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. */
+
+
+/* ----- General styles ----- */
+
+body {
+ margin:0 0 10px 0;
+ padding:0;
+ background:#EFF4F4 url("stripes_bg.jpg") repeat-y 750px 0px;
+ color:#000000;
+ font-size:76%;
+ line-height:1.3em;
+ text-decoration:none;
+ font-family:"Trebuchet MS",Verdana,Sans-Serif;
+ text-align:justify;
+ }
+
+acronym {
+ border:none;
+}
+
+h1, h2, h3 {
+ margin:0;
+}
+
+a, a:visited, a:active, a:visited {
+ font-weight:bold;
+ text-decoration:none;
+ color:#4A3D7C;
+}
+
+a:hover {
+ color:#D84E7B;
+}
+
+
+/* ----- Structural elements ----- */
+
+#pageHeader {
+ position:relative;
+ margin:0;
+ padding:0;
+ width:100%;
+ height:260px;
+ background:url("arrow.gif") repeat-x 25px 217px;
+ }
+
+#pageHeader h1 {
+ height:260px;
+ background:url("csszengarden_logo.gif") no-repeat left bottom;
+ z-index:15;
+}
+
+#pageHeader h1 span, h2 span {
+ display:none;
+}
+
+#quickSummary {
+ position:absolute;
+ top:165px;
+ left:380px;
+ width:300px;
+ font-family:Arial,Sans-Serif;
+ font-size:1.1em;
+ z-index:10;
+}
+
+#quickSummary .p1 {
+ display:none;
+}
+
+#quickSummary p {
+ margin:0;
+}
+
+#preamble {
+ position:relative;
+ float:left;
+ padding-bottom:10px;
+ top:70px;
+ left:15px;
+ width:250px;
+ background:#E4EDDE url("bottom_preamble.gif") no-repeat left bottom;
+}
+
+#preamble p {
+ margin:0;
+ padding:5px 20px;
+}
+
+#preamble h3 {
+ height:70px;
+ background:url("header_preamble.gif") no-repeat left top;
+}
+
+#preamble h3 span, #explanation h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span {
+ display:none;
+}
+
+#supportingText {
+ position:relative;
+ top:20px;
+ text-align:left;
+ margin:0 0 30px 290px;
+ padding-bottom:5px;
+ width:430px;
+ background:#D5D8E7 url("bottom_supportingText.gif") no-repeat left bottom;
+ z-index:1;
+}
+
+#supportingText p {
+ margin:0;
+ padding:5px 10px;
+}
+
+#supportingText a {
+ font-style:italic;
+}
+
+#explanation h3 {
+ height:80px;
+ background:url("header_supportingText.gif") no-repeat left top;
+}
+
+#explanation p {
+ margin-top:-5px;
+}
+
+#participation h3 {
+ height:19px;
+ margin:15px 0 10px 0;
+ background:url("header_participation.gif") no-repeat 30px 0px;
+}
+
+#benefits h3 {
+ height:16px;
+ margin:15px 0 10px 0;
+ background:url("header_benefits.gif") no-repeat 30px 0px;
+}
+
+#requirements h3 {
+ height:19px;
+ margin:15px 0 10px 0;
+ background:url("header_requirements.gif") no-repeat 30px 0px;
+}
+
+#footer {
+ text-align:center;
+ margin:10px;
+ background:url("grad_line.gif") no-repeat bottom center;
+}
+
+#footer a {
+ font-style:normal;
+}
+
+/* ----- Linklists ----- */
+
+#linkList {
+ position:absolute;
+ top:60em;
+ left:15px;
+ width:250px;
+ padding-bottom:20px;
+ background:#E4EDDE url("bottom_preamble.gif") no-repeat left bottom;
+}
+
+#linkList ul {
+ margin:0;
+ padding:0;
+ list-style:none;
+}
+
+#lselect li, #lfavorites li {
+ padding:0;
+ margin:0 10px;
+ text-align:right;
+
+ background:url("lselect_seperator.gif") no-repeat bottom center;
+}
+
+#lselect a, #lfavorites a {
+ margin-top:2px;
+ padding:1px 0 0 27px;
+ font-style:normal;
+ font-size:1.1em;
+ font-weight:bold;
+ display:block;
+ text-align:left;
+
+ height:17px;
+ margin-top:1px;
+}
+
+#lselect a:hover, #lfavorites a:hover {
+ background:#D8EDCA url("lselect_hover.gif") no-repeat left top;
+}
+
+#lselect a.c, #lfavorites a.c {
+ padding:0;
+ margin-right:15px;
+
+ color:#6150A4;
+ font-style:italic;
+ font-size:1em;
+ font-weight:normal;
+ display:inline;
+}
+
+#lselect a.c:hover, #lfavorites a.c:hover {
+ color:#D84E7B;
+ background:none;
+}
+
+#lselect h3 {
+ height:50px;
+ margin-bottom:10px;
+ background:url("header_select.gif") no-repeat left top;
+}
+
+#lfavorites h3 {
+ height:15px;
+ margin:20px 0 15px 0;
+ background:url("header_favorites.gif") no-repeat 40px 0;
+}
+
+#lselect h3 span, #lfavorites h3 span {
+ display:none;
+}
+
+#larchives h3 {
+ height:15px;
+ margin:30px 0 10px 0;
+ background:url("header_archives.gif") no-repeat 50px 0;
+}
+
+#lresources h3 {
+ height:15px;
+ margin:30px 0 10px 0;
+ background:url("header_resources.gif") no-repeat 30px 0;
+}
+
+#larchives li, #lresources li {
+ text-align:center;
+}
+
+#larchives h3 span, #lresources h3 span {
+ display:none;
+}
+
+#larchives a, #lresources a {
+ font-size:1.1em;
+ line-height:1.5em;
+}
+
+/* ----- Extra images ----- */
+
+#extraDiv1 {
+ position:absolute;
+ top:220px;
+ left:320px;
+ width:446px;
+ height:23px;
+ background:url("new_groove.gif") no-repeat left top;
+ z-index:10;
+}
+
+#extraDiv2 {
+ position:relative;
+ display:block;
+ height:0px;
+}
+
+#extraDiv2 span{
+ position:absolute;
+ bottom:20px;
+ right:10%;
+ width:253px;
+ height:404px;
+ background:url("listening.gif") no-repeat;
+ z-index:0;
+}
+
+ #extraDiv3 {
+ position:absolute;
+ top:0px;
+ left:0px;
+ width:716px;
+ height:193px;
+ background:url("lounge_bg.jpg") no-repeat left top;
+ z-index:0;
+}
+
+#extraDiv4 {
+ position:relative;
+ display:block;
+ height:0px;
+}
+
+ #extraDiv4 span {
+ position:absolute;
+ bottom:200px;
+ right:0px;
+ width:54px;
+ height:552px;
+ background:url("garden_lounge_vert.gif") no-repeat left top;
+ z-index:0;
+}/* css Zen Garden submission 066 - 'Focus & Shoot' by Colectivo YTW (Julio Beamonte, Beatriz Martinez, Gustavo Gavan, Franck Scipion), http://www.yatienesweb.info/corporativo/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, YTW */
+/* Main Photo - Copyright 2003, Cristobal Lucas Gomez, cristoballucas@hotmail.com, all rights reserved*/
+/* Added: December 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. */
+
+
+/* General*/
+
+body {
+ background-image:url(bg.jpg);
+ background-color:#fff;
+ font-family:arial, sans serif;
+ font-size:11px;
+ line-height:15px;
+ color:#fff;
+ margin:0px;
+ }
+
+/* Positioning*/
+
+#container {
+ margin-left:0px;
+ margin-top:0px;
+ padding:0px;
+ width:950px;
+ z-index:1;
+ }
+
+#intro {
+ width:275px;
+ position:absolute;
+ left:45px;
+ top:15px;
+ z-index:2;
+ }
+
+#supportingText {
+ width:5px;
+ position:absolute;
+ left:45px;
+ top:15px;
+ z-index:2;
+ }
+#participation {
+ width:325px;
+ position:absolute;
+ left:575px;
+ top:820px;
+ z-index:2;
+ }
+#benefits {
+ width:435px;
+ position:absolute;
+ left:0px;
+ top:820px;
+ z-index:2;
+ }
+#footer{
+ width:250px;
+ position:absolute;
+ left:600px;
+ top:360px;
+ z-index:2;
+ }
+
+#requirements {
+ width:900px;
+ position:absolute;
+ left:0px;
+ top:1250px;
+ z-index:2;
+ }
+
+#linkList2 {
+ width:275px;
+ position:absolute;
+ left:345px;
+ top:87px;
+ z-index:2;
+ }
+#explanation {
+ width:305px;
+ position:absolute;
+ left:600px;
+ top:0px;
+ z-index:2;
+ }
+
+/* Cosmetics */
+
+#extraDiv1 {
+ background-image:url(background.jpg);
+ background-repeat:no-repeat;
+ position:absolute;
+ left:2px;
+ top:2px;
+ width:1000px;
+ height:1515px;
+ z-index:1;
+ }
+
+#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;
+ }
+
+#requirements {
+ background-image:url(End_Section.gif);
+ background-repeat:no-repeat;
+ background-position:bottom center;
+ }
+
+#explanation, #participation, #benefits, #quickSummary, #preamble, #lselect, #lfavorites, #lresources, #larchives {
+ background-image:url(End_Section2.gif);
+ background-repeat:no-repeat;
+ background-position:bottom center;
+ }
+
+#pageHeader {
+ display:none;
+ }
+h3 {
+ font-family:arial, sans serif;
+ text-transform: uppercase;
+ color:#fff;
+ font-size:11px;
+ font-weight:bold;
+ margin-top:3px;
+ margin-bottom:3px;
+ border-bottom: #fff 1px solid
+ }
+h3 span {
+ border-bottom: #c00 5px solid
+ }
+
+#explanation h3, #participation h3, #requirements h3, #benefits h3, #quickSummary h3, #preamble h3, #lselect h3, #lfavorites, #lresources h3, #larchives h3 {
+ background-image:url(h3.gif);
+ background-repeat:no-repeat;
+ background-position:bottom right;
+ }
+
+p {
+ margin:6px;
+ }
+
+
+#requirements p.p5 {
+ color:#c00;
+ font-weight:bold;
+ }
+
+acronym {
+ border-bottom: dotted 1px #fff;
+ cursor: help;
+ }
+
+/* Links */
+
+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;
+ }
+
+#footer a {
+ text-transform: uppercase;
+ color:#fff;
+ text-decoration:underline;
+ background: url(bullet_single.gif) no-repeat 5px 2px;
+ padding-left: 15px;
+ }
+#footer a:link {
+ text-transform: uppercase;
+ color:#fff;
+ text-decoration:underline;
+ background: url(bullet_single.gif) no-repeat 5px 2px;
+ padding-left: 15px;
+ }
+#footer a:hover {
+ text-transform: uppercase;
+ color:#fff;
+ font-weight:bold;
+ text-decoration:underline;
+ }
+#footer a:visited {
+ text-transform: uppercase;
+ color:#c00;
+ text-decoration:underline;
+ }
+
+#lselect a {
+ color:#fff;
+ text-decoration:underline;
+ }
+#lselect a:link {
+ color:#fff;
+ text-decoration:underline;
+ }
+#lselect a:hover {
+ color:#fff;
+ font-weight:bold;
+ text-decoration:underline;
+ }
+#lselect a:visited {
+ color:#e2e2e2;
+ text-decoration:underline;
+ }
+#lselect a.c:hover {
+ color:#c00;
+ background-color:#fff;
+ font-weight:bold;
+ }
+
+/* Lists */
+
+#linkList ul {
+ margin: 0px 0px 5px 0px;
+ padding: 0px;
+ }
+
+#linkList li {
+ list-style-type: none;
+ }
+
+#linkList #lselect li {
+ background: url(bullet_double.gif) no-repeat 5px 2px;
+ padding-left: 15px;
+}
+
+#lselect li a.c{
+ text-decoration:none;
+ display:inline;
+ font-size:9px;
+ text-transform: uppercase;
+}
+
+#linkList #larchives li, #linkList #lresources li {
+ background: url(arrow.gif) no-repeat 0px 5px;
+ padding-left: 10px;
+ display: inline;
+}
+/* css Zen Garden submission 067 - 'A Silent Strength' 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: December 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 {
+ background: #ADB58D url(main_bg_pattern.gif);
+ margin:0;
+ padding:0;
+ text-align:center;
+ }
+p {
+ font: 11px verdana;
+ text-align: left;
+ }
+h1, h2, h3, h4 {
+ margin:0;
+ padding:0;
+}
+a:link {
+ text-decoration:underline;
+ color: #5a682e;
+ }
+a:visited {
+ text-decoration:underline;
+ color: #38460c;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #380000;
+ }
+acronym {
+ border-bottom:1px dotted #38460c;
+ cursor:help;
+}
+a acronym {bottom-border:0;}
+ul {
+ padding:0;
+ margin:0;
+}
+/* header images */
+h1, h2 {
+ margin: 0 40px 0 335px;
+ padding:0;
+ width: 395px;
+}
+h1 {
+ background:#f4f5f0 url(intro_bg_a.jpg) no-repeat top left;
+ height:110px;
+}
+h2 {
+ background:#f4f5f0 url(intro_bg_b.jpg) no-repeat top left;
+ height:106px;
+}
+h1 span, h2 span {display:none;}
+
+/* specific divs */
+#container {
+ background:#fff url(container_bg.jpg) repeat-y top left;
+ width:770px;
+ text-align:left;
+ margin-left:auto;
+ margin-right:auto;
+ }
+#quickSummary, #preamble, #explanation, #participation, #benefits, #requirements {
+ margin: 0 40px 0 335px;
+ padding:0 15px;
+ width: 365px;
+ border-bottom:1px solid #e3e4e0;
+ }
+#quickSummary {
+ background:transparent url(quicksum_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#preamble {
+ background:transparent url(theroad_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#explanation {
+ background:transparent url(explain_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#participation {
+ background:transparent url(participate_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#benefits {
+ background:transparent url(benefit_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#requirements {
+ background:transparent url(req_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#preamble h3, #explanation h3, #participation h3, #benefits h3, #requirements h3 {display:none;}
+#quickSummary p, #preamble p, #explanation p, #participation p, #benefits p, #requirements p {
+ margin:10px 5px;
+ line-height:16px;
+ color:#38460c;
+}
+/* footer */
+#footer {
+ text-align:center;
+ margin: 10px 40px 0 335px;
+ padding-bottom:10px;
+ width: 365px;
+ font: 10px verdana;
+}
+/* main navigation */
+#linkList {
+ background:#fff url(intro_title.jpg) no-repeat top left;
+ position: absolute;
+ top: 0px;
+ padding:110px 0 0 0;
+ margin:0 0 0 58px;
+ width:277px;
+ height:100%;;
+}
+#linkList ul {
+ margin: 0;
+ padding: 0;
+}
+#lselect {
+ background:transparent url(select_nav_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#lselect h3 {display:none}
+#lselect ul {
+ margin:0 0 0 -15px;
+ padding:0;
+ width:235px;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ margin:0;
+}
+#lselect li {
+ font:11px verdana;
+ width:235px;
+ padding:5px 10px 15px 10px;
+ height:auto;
+ list-style-type: none;
+ margin:0 0 -3px 20px;
+ background:#dee1d3 url(li_bg_tab.gif) no-repeat bottom left;
+ voice-family: "\"}\"";
+ voice-family:inherit;
+ width:215px;
+}
+div[id="lselect"]>li { margin:0 0 0 20px; !important; }
+#lselect li a:link, #lselect li a:visited {
+ font-weight:bold;
+ color:#39470D;
+ display: block;
+ margin:0;
+}
+#linkList li a.c:link, #linkList li a.c:visited {
+ color: #929B70;
+ padding:0;
+ font-weight: normal;
+ display: inline;
+ text-decoration: underline;
+}
+#linkList a.c:hover {
+ text-decoration: underline;
+}
+#larchives {
+ background: #fff url(archive_title.gif) no-repeat top left;
+ padding-top:30px;
+}
+#larchives h3 {display:none;}
+#larchives ul, #lresources ul {
+ margin:0;
+ padding:0;
+ width:235px;
+}
+#larchives li, #lresources li {
+ font:11px verdana;
+ width:215px;
+ padding: 5px 5px 0 5px;
+ list-style-type: none;
+ margin:0 0 0 20px;
+}
+#larchives a:link, #larchives a:visited, #lresources a:link, #lresources a:visited {
+ color:#929B70;
+ text-decoration:underline;
+}
+#larchives a:hover, #lresources a:hover {
+ color:#818a60;
+}
+#lresources {
+ background:#fff url(res_title.gif) no-repeat top left;
+ padding-top:47px;
+}
+#lresources h3 {display:none;}
+
+/* extra divs */
+#extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {display:none;}/* css Zen Garden submission 068 - 'Ballade' by Charlotte Lambert, http://charlotte.flibuste.net/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Charlotte Lambert */
+/* Added: December 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 {
+ margin: 0px;
+ padding: 0px;
+ font-family: geneva, arial, helvetica, sans-serif;
+ color: #000;
+ background: #000;
+ height: 100%;
+ text-align: center;
+ }
+
+
+html {
+ height: 100%;
+ margin: 0px;
+ padding: 0px;
+ }
+
+a:link {
+ color: #e5a250;
+ text-decoration: none;
+ }
+
+a:visited {
+ color: #b2906d;
+ text-decoration: none;
+ }
+
+a:hover, a:active {
+ color:#99d0dd;
+ text-decoration: none;
+ }
+
+acronym {
+ cursor: help;
+ }
+
+a acronym {
+ cursor: help;
+ }
+
+p {
+ font-size: 80%;
+}
+
+#container {
+ position: relative;
+ width: 800px;
+ padding: 0px;
+ margin-left: auto;
+ margin-right: auto;
+ text-align: left;
+ background: #fff url(fond.jpg) top left repeat-y;
+ border: 0px;
+ }
+html>body #container {
+ width: 800px; /* ie5win fudge ends */
+ }
+
+/* __________CHAPEAU__________ */
+
+/*==CHAPEAU--pageHeader==*/
+
+#pageHeader {
+ margin-bottom: 5px;
+ text-align: right;
+ }
+
+#pageHeader h1 {
+ width: 800px;
+ height: 216px;
+ background: transparent url(zen.jpg) top right no-repeat;
+ margin: 0px;
+ padding: 0px;
+ }
+
+#pageHeader span, #pageHeader h2 {
+ display: none;
+ }
+
+/*==CHAPEAU--quickSummary==*/
+
+#quickSummary {
+ background: transparent;
+ color: #fff;
+ text-align: center;
+ margin: 20px 80px 40px 295px;
+ }
+
+#quickSummary a, #quickSummary a:visited {
+ color: #99d0dd;
+ }
+
+#quickSummary a:hover, #quickSummary a:active {
+ color: #e5a250;
+ }
+
+
+/*_________________TEXTE____________*/
+
+/*==TEXTE--chapitres==*/
+
+#preamble {
+ margin: 0 29px 0 235px;
+ background: #fff url(fond1.jpg) repeat-y;
+ padding: 0px;
+ width: 536px;
+ padding-bottom: 30px;
+ }
+
+#explanation, #benefits, #requirements, #participation {
+ margin: 0px 29px 0px 235px;
+ padding: 0px;
+ border: 0px;
+ width: 536px;
+ }
+
+#explanation {
+ background: #FFF url(fond2.jpg) top left repeat-y;
+ }
+
+
+#participation {
+ background: #fff url(fond3.jpg) top left repeat-y;
+ }
+
+
+#benefits {
+ background: #fff url(fond4.jpg) top left repeat-y;
+ padding-bottom: 40px;
+
+ }
+
+
+#requirements {
+ background: #fff url(fond5.jpg) top left repeat-y;
+ padding-bottom: 20px;
+ }
+
+
+
+/*==TEXTE--p==*/
+
+#explanation p, #participation p, #benefits p, #requirements p, #preamble p{
+ text-align: justify;
+ }
+
+#preamble p, #participation p, #requirements p{
+ margin: 5px 120px 0px 20px;
+
+ }
+
+
+#explanation p, #benefits p{
+ margin: 5px 20px 0px 120px;
+
+ }
+
+/*==TEXTE--h3==*/
+
+#preamble h3, #explanation h3, #participation h3, #benefits h3, #requirements h3 {
+ margin: 0px;
+ border: 0px;
+ width: 536px;
+ }
+
+#supportingText h3 span, #preamble h3 span {
+ display: none;
+ }
+
+#preamble h3 {
+ background: url(road.jpg) top left no-repeat;
+ height: 106px;
+ }
+
+
+#explanation h3 {
+ background: url(about.jpg) top left no-repeat;
+ height: 168px;
+ }
+
+
+#participation h3 {
+ background: url(particip.jpg) top left no-repeat;
+ height: 154px;
+ width: 565px;
+ }
+
+#benefits h3 {
+ background: url(benef.jpg) top left no-repeat;
+ height: 171px;
+ }
+
+#requirements h3 {
+ background: url(req.jpg) top left no-repeat;
+ height: 125px;
+ }
+
+/*_____________PIED__________________*/
+
+#footer{
+ margin: 0 29px 0 235px;
+ padding: 0px;
+ background: transparent url(fin.jpg) top left no-repeat;
+ width: 536px;
+ height: 223px;
+ text-decoration: underline;
+ color: #fff;
+ }
+
+#footer a {
+ position: relative;
+ top: 120px;
+ left: 40px;
+ padding: 0px;
+ color: #99d0dd;
+ }
+
+#footer a:hover, #footer a:active {
+ color: #e5a250;
+ text-decoration: none;
+ }
+
+#extraDiv1 {
+ height: 119px;
+ width: 800px;
+ margin: 0 auto 30px auto;
+ background: #b2906d url(bas.jpg) no-repeat top left;
+ text-align: left;
+ }
+
+
+/*__________________MENU__________________*/
+
+#linkList {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 215px;
+ margin: 0px;
+ padding: 150px 0px 0px 0px;
+ background: url(chat.jpg) top left no-repeat;
+ font-size: 80%;
+ color: #e5a250;
+ }
+
+
+
+/*==MENU--h3==*/
+
+#linkList h3 {
+ margin: 40px 0px 20px 0px;
+ width: 185px;
+ height: 76px;
+ }
+#linkList h3 span {
+ display:none;
+ }
+
+#linkList h3.select{
+ background: transparent url(select.jpg) no-repeat top left;
+ }
+
+#linkList h3.archives {
+ background: transparent url(archiv.jpg) no-repeat top left;
+ }
+
+#linkList h3.resources {
+ background: transparent url(resou.jpg) no-repeat top left;
+ }
+
+/*==MENU--liste==*/
+
+#linkList ul {
+ margin: 0px 30px 0px 20px;
+ padding: 7px 2px 5px 2px;
+ background: #000;
+ border: 2px solid #b2906d;
+ }
+
+#linkList li {
+ list-style: none;
+ margin: 0px;
+ padding: 0px;
+ }
+
+#linkList a {
+ color: #e5a250;
+ text-decoration: none;
+ font-size: small;
+ }
+
+div#linkList a:hover {
+ color: #99d0dd;
+ }
+
+
+/*==MENU--select==*/
+
+#lselect li {
+ margin: 0 0 10px 0;
+ }
+
+#lselect li a {
+ display: block;
+ }
+
+#lselect li .c {
+ display: inline;
+ }
+/*------------------------------------------------------*/
+#lselect a {
+ text-transform:uppercase;
+ margin: 0px;
+ padding-left: 30px;
+ border: 0px;
+ background: transparent;
+ color: #b2906d;
+ }
+
+#lselect a:hover {
+ background: url(puce.jpg) no-repeat 0px -3px;
+ color: #99d0dd;
+ }
+
+#lselect a:visited {
+ color: #964;
+ }
+/*---------------------------------------------------*/
+#lselect a.c {
+ text-transform:none;
+ margin: 0px;
+ padding-left: 10px;
+ border: 0px;
+ background: transparent;
+ color: #e5a250;
+ }
+
+#lselect a.c:hover {
+ background: transparent;
+ color: #99d0dd;
+ }
+
+
+/*==MENU--archives==*/
+
+#larchives li, #lresources li {
+ margin: 0 0 15px 0;
+ }
+
+ #larchives a, #larchives a:visited {
+ margin: 0px;
+ padding: 10px 0px 0px 20px;
+ border: 0px;
+ background: transparent;
+ }
+
+#larchives a:hover {
+ background: url(puceherbe.jpg) no-repeat 0 4px;
+ }
+
+
+/*==MENU--ressources--a==*/
+
+#lresources a, #lresources a:visited {
+ margin: 0px;
+ padding: 5px 0px 5px 20px;
+ border: 0px;
+ background: transparent;
+ }
+
+#lresources a:hover {
+ background: url(puceparenth.jpg) center left no-repeat;
+ }
+
+
+
+/* css Zen Garden submission 069 - 'Bonsai Sky' by Mike Davidson - http://www.mdavidson.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Mike Davidson */
+/* Added: December 23rd, 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: #000;
+ background-color: #fff;
+ background-image: url(bg_garden2.jpg);
+ background-position: top right;
+ background-repeat: no-repeat;
+ font: normal 11px "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
+ padding: 0;
+ margin: 0;
+}
+
+acronym {
+ border: 0;
+}
+
+h3 {
+ font: bold 16px Georgia, "Times New Roman", Times, serif;
+ color: #003300;
+ background-image: url(bonsai.gif);
+ background-repeat: no-repeat;
+ padding-left: 28px;
+ height: 23px;
+ margin-top: 14px;
+ margin-bottom: -5px;
+}
+
+h3 span {
+ border-bottom: 1px dotted #000000;
+ padding-bottom: 3px;
+}
+
+p {
+ line-height: 165%;
+}
+
+ul {
+ list-style: none;
+ padding: 0 0 0 13px;
+ margin: 10px 0 0 0;
+}
+
+li {
+ line-height: 16px;
+ padding-bottom: 8px;
+}
+
+a:link, a:visited, a:hover, a:active {
+ color: #003300;
+ font-weight: bold;
+}
+
+#linkList a:link, #linkList a:visited {
+ color: #FFFFFF;
+ font-size: 12px;
+ font-style: normal;
+ text-decoration: none;
+ font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
+ text-shadow: 0 0 3px #000000;
+ font-weight: bold;
+ display: block;
+}
+
+#linkList a:hover, #linkList a:active {
+ color: #FFFFFF;
+ font-size: 12px;
+ font-style: normal;
+ text-decoration: underline;
+ font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
+ text-shadow: 0 0 3px #000000;
+ font-weight: bold;
+}
+
+#linkList {
+ position: absolute;
+ width: 200px;
+ top: 300px;
+ right: 7%;
+ color: #FFFFFF;
+ font-style: italic;
+ font-size: 9px;
+ font-family: Georgia, "Times New Roman", Times, serif;
+ text-shadow: 0 0 3px #000000;
+}
+
+#linkList h3 {
+ font: bold 12px Georgia, "Times New Roman", Times, serif;
+ padding: 0;
+ text-align: center;
+ text-transform: lowercase;
+ color: #FFFFFF;
+ background-image: none;
+ height: auto;
+}
+
+#linkList h3 span {
+ background-color: #000000;
+ padding: 4px 20px 4px 20px;
+ position: relative;
+ top: -7px;
+}
+
+#lselect, #larchives, #lresources {
+ background-image: url(bg_black.gif);
+ margin-bottom: 25px;
+ padding-bottom: 3px;
+}
+
+#quickSummary {
+ font-style: italic;
+ font-family: Georgia, "Times New Roman", Times, serif;
+ width: 380px;
+ border-left: 1px dotted #000000;
+ padding-left: 8px;
+}
+
+#pageHeader {
+ top: 29px;
+ position: absolute;
+ height: 116px;
+ text-align: center;
+ width: 92%;
+ background-image: url(header.gif);
+ background-position: center;
+ background-repeat: no-repeat;
+}
+
+#pageHeader h1 {
+ font: normal 85px Georgia, "Times New Roman", Times, serif;
+ text-shadow: 0 0 7px #000000;
+ text-transform: lowercase;
+ margin: 0;
+ padding: 0;
+ color: #111133;
+ display: none;
+}
+
+#pageHeader h2 {
+ font: bold 12px Georgia, "Times New Roman", Times, serif;
+ text-transform: lowercase;
+ position: relative;
+ left: -143px;
+ top: -20px;
+ color: #000000;
+ padding-top: 6px;
+ display: none;
+}
+
+#pageHeader h2 span {
+ border-top: 1px dotted #000000;
+ padding-top: 3px;
+}
+
+#container {
+ width: 92%;
+ margin-left: 40px;
+ padding-bottom: 40px;
+}
+
+#intro {
+ padding-top: 162px;
+}
+
+#explanation, #participation, #benefits, #requirements, #preamble {
+ width: 53%;
+}
+
+#lselect a:link.c , #lselect a:visited.c {
+ color:#EBE2A8;
+ text-decoration: none;
+ display: inline;
+}
+
+#lselect a:hover.c, #lselect a:active.c {
+ text-decoration: underline;
+ display: inline;
+}
+
+#extraDiv1 {
+ background-image: url(platform.png);
+ position: fixed;
+ top: 270px;
+ right: 85px;
+ width: 85px;
+ height: 184px;
+ margin: -85px;
+}
+
+#extraDiv2 {
+ background-image: url(edge_bottom_black.gif);
+ background-repeat: repeat-x;
+ position: fixed;
+ bottom: 0;
+ left: 100%;
+ width: 100%;
+ height: 20px;
+ margin-left: -100%;
+}
+
+#extraDiv3 {
+ background-image: url(edge_top_black.gif);
+ background-repeat: repeat-x;
+ position: fixed;
+ top: 0;
+ left: 100%;
+ width: 100%;
+ height: 20px;
+ margin-left: -100%;
+}
+
+#extraDiv4 {
+ background-image: url(edge_left_black.gif);
+ background-repeat: repeat-y;
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 20px;
+ height: 100%;
+ margin: 0;
+}
+
+#extraDiv5 {
+ background-image: url(edge_right_black.gif);
+ background-repeat: repeat-y;
+ position: fixed;
+ top: 0;
+ right: 0;
+ width: 20px;
+ height: 100%;
+ margin: 0;
+}/* css Zen Garden submission 070 - 'CS(S) Monk' by Cedric Savarese - http://www.4213miles.com/ */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics copyright 2003, Cedric Savarese */
+/* Added: January 2nd, 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 {
+ color: #000000;
+ background: #fff url(BGTile.jpg) repeat left top;
+ margin: 0;
+ padding: 0;
+ font-style:normal;
+ font-variant:normal;
+ font-weight:normal;
+ line-height:normal;
+ font-size: small;
+ font-family:Georgia, "Times New Roman", Times, serif;
+ text-align:center;
+ }
+
+
+a:link {
+ padding: 0 0 1px 0;
+ text-decoration: none;
+ color: #CC3300;
+ background-image: url(underline.gif);
+ background-repeat: repeat-x;
+ background-position: bottom left;
+ }
+a:visited {
+ text-decoration: none;
+ color: #666666;
+ padding: 0 0 2px 0;
+ background-image: url(underline.gif);
+ background-repeat: no-repeat;
+ background-position: bottom left;
+ }
+a:hover, a:active {
+ text-decoration: none;
+ color: #FF0000;
+ background-image: none;
+ }
+acronym {
+ border-bottom: none;
+ }
+
+/* specific divs */
+#container {
+ background: url(ContentBG.gif) repeat-y left top;
+ margin:0px auto;
+ text-align:left;
+ width: 780px;
+ padding: 0px;
+ border-bottom: 1px solid #000;
+ }
+#intro {
+ position: relative;
+}
+#pageHeader {
+ background-image: url(CSZenLogo.gif);
+ background-repeat: no-repeat;
+ background-position: left;
+ height: 444px;
+ z-index:99;
+}
+
+
+#pageHeader h1 {
+ display: none;
+}
+#pageHeader h2 {
+ display: none;
+}
+#preamble {
+ background-image: url(RoadToEnlightmentBG_2.gif);
+ background-repeat: no-repeat;
+ background-position: right bottom;
+ width: 405px;
+ position: absolute;
+ left: 410px;
+ top: 15px;
+
+ margin: 0;
+ padding: 0;
+ font-size: x-small;
+ font-style: italic;
+ letter-spacing: 2px;
+}
+#preamble h3 {
+ display: none;
+}
+#preamble p {
+ padding: 8px 70px 0px 70px;
+ margin: 0;
+}
+#preamble .p1 {
+ background-image: url(RoadToEnlightmentBG_1.gif);
+ background-repeat: no-repeat;
+ background-position: right top;
+ padding-top: 10px;
+
+}
+
+#preamble .p3 {
+ padding-bottom: 20px;
+}
+#quickSummary {
+ position: absolute;
+ font-size: x-small;
+ left: 38px;
+ top: 515px;
+ width: 250px;
+ z-index: 5;
+ text-align: right;
+ letter-spacing: 2px;
+}
+
+#explanation {
+ background-image: url(SoWhatIsThisAbout.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+ margin: 40px 0px 0px 30px ;
+}
+#explanation h3 {
+ display: none;
+}
+#explanation p {
+ margin: 0px 50px 0px 280px ;
+}
+
+#participation {
+ background-image: url(Participation.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+ margin: 20px 0px 0px 150px ;
+}
+#participation h3 {
+ display: none;
+}
+#participation p {
+ margin: 0px 50px 0px 160px ;
+}
+
+#benefits {
+ background-image: url(Benefits.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+ margin: 40px 0px 0px 195px ;
+}
+#benefits h3 {
+ display: none;
+}
+#benefits p {
+ margin: 0px 50px 0px 115px ;
+}
+
+#requirements {
+ background-image: url(Requirements.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+ margin: 40px 0px 0px 140px ;
+}
+#requirements h3 {
+ display: none;
+}
+#requirements p {
+ margin: 0px 50px 0px 170px ;
+}
+#linkList {
+ margin: 40px auto;
+ padding: 0px;
+ background-image: url(NavBG.gif);
+ background-repeat: no-repeat;
+ background-position: left bottom;
+ width: 729px;
+ font-size: xx-small;
+}
+
+#linkList2 {
+ background-image: url(NavBG_top.gif);
+ background-repeat: no-repeat;
+ background-position: left top;
+ width: 729px;
+ padding: 5px 0px;
+}
+#linkList ul {
+ display: block;
+ padding: 0px 60px 0px 120px;
+ margin: 0;
+ line-height: 20px;
+ }
+#linkList li {
+ display: inline;
+ list-style-image: none;
+}
+#linkList li:after {content:url(Bullet.gif); }
+
+#lselect {
+ background-image: url(SelectADesign.gif);
+ background-position: left center;
+ background-repeat: no-repeat;
+ margin: 0 0 0 20px;
+}
+#lselect h3 {
+ display: none;
+}
+#larchives {
+ background-image: url(Archive.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+ margin: 10px 0 10px 20px;
+ padding: 8px 0;
+}
+#larchives h3 {
+ display: none;
+}
+
+#lresources {
+ background-image: url(Resources.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+ margin: 10px 0 10px 20px;
+ padding: 8px 0;
+}
+#lresources h3 {
+ display: none;
+}
+#extraDiv1 {
+ position: relative;
+ top: -225px;
+ left: -360px;
+ margin: 0 auto;
+ width: 96px;
+ height: 206px;
+ background-image: url(Dragon.gif);
+ background-position: left top;
+ background-repeat: no-repeat;
+}
+
+.p5 {
+ padding-top: 30px;
+ font-size: 10px;
+}
+
+#footer {
+ padding-left: 160px;
+ font-size: x-small;
+ margin-top: -13px;
+
+}
+/* css Zen Garden submission 071 - 'Garden Party' by Bobby van der Sluis, http://www.bobbyvandersluis.com */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, Bobby van der Sluis */
+/* Added: January 2nd, 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. */
+
+
+/* Page layout: positioning and backgrounds */
+body {
+ margin: 0;
+ border-top: 15px solid #000;
+ border-bottom: 15px solid #000;
+ padding: 0;
+ background: #fff url(background.gif) center top repeat-y;
+ text-align: center;
+}
+#container {
+ position: relative;
+ margin: 0 auto;
+ width: 750px;
+}
+#intro {
+ background: #00c2ec url(lines.gif) left top repeat-y;
+}
+#pageHeader {
+ padding: 20px 95px 0 395px;
+}
+#pageHeader h1 {
+ position: absolute;
+ top: 0;
+ left: 0;
+ background: transparent url(logo.gif) left top no-repeat;
+ width: 375px;
+ height: 270px;
+}
+#pageHeader h1 span {
+ display: none;
+}
+#pageHeader h2 {
+ padding: 0;
+}
+#quickSummary {
+ padding: 0 95px 0 395px;
+}
+#preamble {
+ background: transparent url(crossing.gif) left bottom no-repeat;
+ padding: 0 95px 230px 395px;
+}
+#supportingText {
+ position: relative;
+ background: #10a2c5 url(lines2.gif) left top repeat-y;
+ width: 750px;
+}
+#explanation {
+ padding: 0 395px 0 95px;
+}
+#participation {
+ padding: 0 395px 180px 95px;
+ background: transparent url(wave.gif) left bottom no-repeat;
+}
+#benefits {
+ position: absolute;
+ top: 0;
+ left: 395px;
+ padding: 0 95px 0 0;
+}
+#requirements {
+ position: absolute;
+ top: 18.5%;
+ left: 395px;
+ padding: 0 95px 0 0;
+}
+#footer {
+ padding: 0 95px 5px 395px;
+ background: transparent url(lines3.gif) left top repeat-y;
+}
+#linkList {
+ position: absolute;
+ top: 270px;
+ left: 0px;
+ margin: 0 95px;
+ width: 260px;
+}
+#larchives {
+ padding: 2em 0 1em 0;
+}
+#extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
+ display: none;
+}
+
+/* Content styling: fonts & text replacement */
+body {
+ font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ text-transform: uppercase;
+}
+h1, h2, h3, p {
+ margin: 0;
+}
+p {
+ padding: 0 0 1em 0;
+}
+a {
+ color: #fff;
+ text-decoration: none;
+}
+a:hover {
+ text-decoration: overline;
+}
+#container {
+ text-align: left;
+}
+#pageHeader h2 {
+ background: transparent url(quickSummary.gif) no-repeat top left;
+ width: 260px;
+ height: 44px;
+}
+#preamble h3 {
+ background: transparent url(preamble.gif) no-repeat top left;
+ width: 260px;
+ height: 44px;
+}
+#explanation h3 {
+ background: transparent url(explanation.gif) no-repeat top left;
+ width: 260px;
+ height: 44px;
+}
+#participation h3 {
+ background: transparent url(participation.gif) no-repeat top left;
+ width: 260px;
+ height: 44px;
+}
+#benefits h3 {
+ background: transparent url(benefits.gif) no-repeat top left;
+ width: 260px;
+ height: 44px;
+}
+#requirements h3 {
+ background: transparent url(requirements.gif) no-repeat top left;
+ width: 260px;
+ height: 44px;
+}
+#pageHeader h2 span, #preamble h3 span, #explanation h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span, #linkList h3 {
+ display: none;
+}
+#linkList ul {
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+}
+#linkList li {
+ margin: 0;
+}
+#linkList a {
+ display: block;
+ font-size: large;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: x-large;
+}
+html>body #linkList a {
+ font-size: x-large;
+}
+#linkList a.c {
+ display: inline;
+ color: #000;
+ font-size: medium;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: large;
+}
+html>body #linkList a.c {
+ font-size: large;
+}
+#larchives a, #lresources a {
+ display: inline;
+ font-size: small;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ font-size: medium;
+}
+html>body #larchives a, html>body #lresources a {
+ font-size: medium;
+}
+#lresources li {
+ background: url(bullet.gif) no-repeat 0 0.5em;
+ padding: 0 0 0 12px;
+}
+/* css Zen Garden submission 072 - 'Outburst' by Chris Vincent - http://dris.webhop.org/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* Flower illustrations derived from a photograph by Seer of sxc.hu - http://www.sxc.hu/browse.phtml?f=profile&l=seer */
+/* Added: January 3rd, 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 Layout and Formatting */
+
+body {
+ font-family: Helvetica, Arial, sans-serif;
+ font-size: 12px;
+ line-height: 20px;
+ margin: 0;
+ padding: 0;
+ text-align: justify;
+ }
+
+#container {
+ position: absolute;
+ left: 0;
+ top: 0;
+ padding: 0 10px 0 10px;
+ background: url(edgeBorder.gif) top right repeat-y rgb(236,149,3);
+ width: 939px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 919px;
+ }
+
+#pageHeader {
+ text-indent: -10000px;
+ width: 800px;
+ height: 388px;
+ background: url(header.gif) no-repeat;
+ margin: 10px 0 0 0;
+ padding: 0;
+ }
+
+h1, h2 {
+ margin: 0;
+ }
+
+/* Content Layout */
+
+#quickSummary {
+ background: white;
+ padding: 10px 35px 10px 335px;
+ margin: 10px 0 0 0;
+ width: 800px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 430px;
+ }
+*>#quickSummary {
+ float: right;
+ width: 155px;
+ padding: 0 20px 10px 17px;
+ margin: 23px 154px 10px 20px;
+ border: 3px double rgb(200,200,200);
+ border-width: 0 0 3px 3px;
+ }
+
+#quickSummary .p2 {
+ padding-bottom: 10px;
+ border-bottom: 3px double rgb(200,200,200);
+ }
+*>#quickSummary .p2 {
+ padding-bottom: 0;
+ border-bottom: 0;
+ }
+
+#preamble h3, #supportingText h3 {
+ text-indent: -10000px;
+ height: 38px;
+ }
+
+#preamble {
+ background: white;
+ padding: 10px 35px 1px 335px;
+ width: 800px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 430px;
+ }
+*>#preamble {
+ margin-top: 8px;
+ padding-top: 1px;
+ }
+
+#preamble h3 { background: url(theRoadToEnlightenmentWide.gif) no-repeat; }
+*>#preamble h3 { background: url(theRoadToEnlightenmentWide.gif) no-repeat; width: 215px; margin-left: 0; margin-right: 0; clear: left; }
+
+#supportingText {
+ background: white url(3dflower.jpg) bottom left no-repeat;
+ margin-bottom: 10px;
+ padding: 1px 35px 0 335px;
+ width: 800px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 430px;
+ }
+
+#supportingText h3 { margin: 22px 0 10px 0; }
+
+#explanation h3 { background: url(soWhatIsThisAbout.gif) no-repeat; margin-top: 22px; }
+#participation h3 { background: url(participation.gif) no-repeat; }
+#benefits h3 { background: url(benefits.gif) no-repeat; }
+#requirements h3 { background: url(requirements.gif) no-repeat; }
+
+*>#explanation h3 { margin-top: 10px; }
+
+/* Sidebar Layout */
+
+#linkList {
+ position: absolute;
+ left: 10px;
+ top: 408px;
+ width: 325px;
+ padding: 1px 0 0 0;
+ line-height: 14px;
+ }
+
+#linkList h3 {
+ color: rgb(255,210,50);
+ padding: 5px 0 0 65px;
+ margin: 10px 0 0 0;
+ font-size: 9px;
+ font-weight: normal;
+ background: url(windowHead.gif) no-repeat rgb(236,149,3);
+ width: 325px;
+ height: 22px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 260px;
+ height: 17px;
+ }
+*>#linkList h3 {
+ padding-top: 6px;
+ margin-bottom: -1px;
+ }
+
+#lselect:hover h3, #larchives:hover h3, #lresources:hover h3 {
+ background: url(flashingWindowHead.gif) no-repeat;
+ }
+
+#linkList ul {
+ background: url(windowBody.gif) repeat-y;
+ margin: 0;
+ padding: 10px 0 15px 40px;
+ width: 325px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ width: 285px;
+ }
+
+#linkList li {
+ list-style: none;
+ background: url(bullet.gif) no-repeat 0 3px;
+ margin: 5px 20px 5px -16px;
+ padding-left: 0px;
+ width: 200px;
+ text-indent: 16px;
+ voice-family: "\"}\"";
+ voice-family: inherit;
+ padding-left: 16px;
+ text-indent: 0;
+ margin-left: 0;
+ }
+
+#linkList li:hover {
+ background: url(hoverBullet.gif) no-repeat 0 3px;
+ }
+
+#lselect, #larchives, #lresources {
+ width: 325px;
+ padding-bottom: 11px;
+ background: url(windowFoot.gif) no-repeat bottom;
+ }
+
+#lselect {
+ font-size: 11px;
+ }
+
+#footer {
+ text-align: center;
+ padding: 3px 0;
+ border-top: 3px double rgb(200,200,200);
+ }
+
+/* Link Formatting */
+
+a:link {
+ color: black;
+ text-decoration: none;
+ border-bottom: 2px rgb(247,202,0) solid;
+ }
+
+a:visited {
+ color: black;
+ text-decoration: none;
+ border-bottom: 1px rgb(247,202,0) solid;
+ }
+
+a:link:hover { border-bottom-width: 3px; }
+a:visited:hover { border-bottom-width: 2px; }
+a:active { border-bottom-width: 1px; }
+
+#linkList a:link, #linkList a:visited, #linkList a:hover, #linkList a:active {
+ border: none;
+ font-weight: bold;
+ display: block;
+ font-size: 12px;
+ }
+
+#linkList a.c:link, #linkList a.c:visited, #linkList a.c:hover, #linkList a.c:active {
+ font-weight: normal;
+ text-decoration: underline;
+ display: inline;
+ font-size: 11px;
+ }
+
+#larchives a:link, #larchives a:visited, #larchives a:hover, #larchives a:active, #lresources a:link, #lresources a:visited, #lresources a:hover, #lresources a:active {
+ display: inline;
+ font-size: 12px;
+ }/* css Zen Garden submission 073 - 'Emmakade' by Alexander Christiaan Jacob (ACJ) - http://acjs.net/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, ACJ */
+/* Added: January 18th, 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. */
+
+
+:link, :visited { background-color: transparent; color: #9296A2; font-weight: bold; text-decoration: underline }
+[title] { border-bottom: 1px dotted; cursor: help }
+:link:hover, :visited:hover { background-color: #9296A2; color: #373B46; text-decoration: none }
+body { font: normal 70% Verdana, Georgia, Times, serif }
+body { background: #9296A2 url(a_img.gif) repeat; color: #000000; margin: 0em; padding: 0em }
+h1, h2, h3, h4 { margin: 0em; overflow: hidden; padding: 0em }
+h1 { background: #9296A2 url(h1_v2.jpg) no-repeat; height: 430px }
+h2 { background: #9296A2 url(h2.gif) no-repeat; height: 360px; margin-left: -62px; position: absolute; top: 0px; width: 60px }
+* > h2 { position: fixed }
+h3 span { margin-left: -2000px }
+p { color: #9296A2; margin: 0em; padding: 0em 0em 1em 0em }
+p:hover { color: #E7E7F1 }
+p * { color: #9296A2 }
+p:hover * { color: #E7E7F1 }
+ul { background-color: transparent; color: #9296A2; margin: 0em; padding: 0em; padding-bottom: 20px }
+ul li { list-style: square; margin: 0em 0em 0em 2em; padding: 0em }
+ul li a { font-weight: normal }
+#container { background: #373B46 url(container.jpg) bottom no-repeat; border: 2px solid #000; border-width: 0px 2px; color: #E7E7F1; margin-left: -321px; padding-bottom: 500px; position: absolute; left: 50%; width: 642px }
+#pageHeader { background-color: #373B46 }
+#pageHeader h1 span { margin-left: -2000px }
+#pageHeader h2 span { margin-left: -2000px }
+#quickSummary { margin-top: -10px }
+#quickSummary, #preamble { margin-left: 290px; text-align: justify; width: 270px }
+#preamble h3 { background: #373B46 url(h3_preamble.gif) no-repeat; height: 60px; width: 330px }
+#supportingText { margin-left: 24px; width: 440px }
+p { border-left: 1px dotted #9296A2; margin-left: 10px; padding-left: 10px; text-align: justify }
+#explanation h3 { background: #373B46 url(h3_explanation.gif) no-repeat; height: 60px; width: 330px }
+#participation h3 { background: #373B46 url(h3_participation.gif) no-repeat; height: 60px; width: 330px }
+#benefits h3 { background: #373B46 url(h3_benefits.gif) no-repeat; height: 60px; width: 330px }
+#requirements h3 { background: #373B46 url(h3_requirements.gif) no-repeat; height: 60px; width: 330px }
+#linkList { left: 12px; position: absolute; top: 400px; width: 256px }
+#linkList h3 { height: 30px; width: 200px }
+#linkList h3.select { background: #373B46 url(h3.select.gif) no-repeat }
+#linkList h3.favorites { background: #373B46 url(h3.favorites.gif) no-repeat }
+#linkList h3.archives { background: #373B46 url(h3.archives.gif) no-repeat }
+#linkList h3.resources { background: #373B46 url(h3.resources.gif) no-repeat }
+#footer { bottom: 400px; position: absolute; right: 36px; text-align: right }
+#extraDiv1 { background: #9296A2 url(thingy.gif) no-repeat; bottom: 0px; float: right; height: 36px; position: fixed; right: 0px; width: 36px }/* css Zen Garden submission 074 - 'Egyptian Dawn' by James Abbott - http://www.ja-consultancy.co.uk/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, James Abbott */
+/* Added: January 18th, 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. */
+
+
+
+/* basic elements */
+body {
+ font-size: 8pt;
+ font-family: verdana, sans-serif;
+ font-style: italic;
+ color: #6B441A;
+ background: #BB8855 url(border.jpg) no-repeat top left;
+ margin: 0px;
+ }
+p {
+ margin-top: 0px;
+ }
+a:link {
+ text-decoration: none;
+ color: #995522;
+ font-weight: bold;
+ }
+a:visited {
+ text-decoration: none;
+ color: #995522;
+ font-weight: bold;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #995522;
+ font-weight: bold;
+ }
+
+
+/* specific divs */
+#container {
+ position: absolute;
+ top: 40px;
+ left: 40px;
+ height: 1900px;
+ width: 1000px;
+ border: 0px solid #000000;
+ padding: 0px 0px 10px 0px;
+ margin: 0px;
+ background: url(container_bg.jpg) no-repeat top left;
+ }
+
+#intro {
+ position: relative;
+ top: 130px;
+ min-width: 400px;
+ border: 0px solid #000000;
+ width: 750px;
+ padding: 0px 0px 0px 0px;
+ margin: 0px;
+ }
+
+#intro h3 {
+ font-size: 10pt;
+ font-family: verdana, sans-serif;
+ color: #FFFB88;
+ padding: 0px;
+ margin: 10px 0px 10px 0px;
+ border: 0px solid #000000;
+ display: none;
+
+}
+
+#pageHeader {
+ position: relative;
+ left: 100px;
+ top: 25px;
+ padding: 0px;
+ border: 0px solid #000000;
+ margin: 0px;
+ }
+
+#pageHeader h1 {
+ margin: 0px;
+ padding: 0px;
+ }
+
+#pageHeader h1 span {
+ display:none
+ }
+
+#pageHeader h2 {
+
+ width: 340px;
+ height: 40px;
+ padding: 0px;
+ border: 0px solid #000000;
+ margin: 0px;
+ }
+#pageHeader h2 span {
+ display:none;
+ }
+
+#quickSummary {
+ position: relative;
+ top: 0px;
+ left: 105px;
+ width: 300px;
+ border: 0px solid #000000;
+ padding: 5px 5px 5px 5px;
+ font-size: 8pt;
+ font-family: verdana, sans-serif;
+ font-weight: bold;
+ font-style: italic;
+ color: #8D663C;
+ margin: 0px;
+ }
+
+#preamble {
+ background: url(preamble.gif) no-repeat top left;
+ padding: 25px 5px 15px 5px;
+ position: relative;
+ top: 20px;
+ left: 105px;
+ width: 370px;
+ margin: 0px 0px 0px 0px;
+ border: 0px solid #000000;
+ }
+
+#supportingText {
+ position: relative;
+ min-width: 350px;
+ top: 160px;
+ border: 0px solid #000000;
+ margin: 0px;
+ padding: 0px;
+ }
+
+#supportingText h3 {
+ font-size: 10pt;
+ font-family: verdana, sans-serif;
+ color: #FFFB88;
+ padding: 0px;
+ margin: 10px 0px 10px 0px;
+ display: none;
+}
+
+#footer {
+ position: relative;
+ top: 20px;
+ left: 100px;
+ width: 370px;
+ border: 0px solid #000000;
+ margin: 0px;
+ padding: 5px;
+ text-align: center;
+ }
+
+
+#explanation {
+ background: url(explanation.gif) no-repeat top left;
+ padding: 25px 5px 15px 5px;
+ margin: 0px 0px 0px 0px;
+ position: relative;
+ top: 0px;
+ left: 105px;
+ width: 370px;
+ border: 0px solid #000000;
+}
+
+#participation {
+ background: url(participation.gif) no-repeat top left;
+ padding: 25px 5px 15px 5px;
+ position: relative;
+ top: 10px;
+ left: 105px;
+ width: 370px;
+ margin: 0px 0px 0px 0px;
+ border: 0px solid #000000;
+}
+
+#benefits {
+ background: url(benefits.gif) no-repeat top left;
+ padding: 25px 5px 15px 5px;
+ position: relative;
+ top: 20px;
+ left: 105px;
+ width: 370px;
+ margin: 0px 0px 0px 0px;
+ border: 0px solid #000000;
+}
+
+#requirements {
+ background: url(requirements.gif) no-repeat top left;
+ padding: 25px 5px 15px 5px;
+ position: relative;
+ top: 30px;
+ left: 105px;
+ width: 370px;
+ margin: 0px 0px 0px 0px;
+ border: 0px solid #000000;
+}
+
+#footer a:link, #footer a:visited {
+ margin-right: 20px;
+ color: #6B441A;
+ }
+
+#linkList {
+ position: absolute;
+ top: 420px;
+ left: 515px;
+ border: 0px solid #000000;
+ width: 180px;
+ margin: 0px;
+ padding: 0px;
+ background: url(listheader.gif) no-repeat top center;
+ }
+
+#linkList2 {
+ position: relative;
+ font-size: 7pt;
+ font-family: verdana, sans-serif;
+ padding: 100px 20px 20px 20px;
+ margin: 0px 0px 0px 0px;
+ text-align: center;
+ width: 140px;
+ height: 750px;
+ border: 0px solid #AA7744;
+ }
+
+
+#lselect {
+ border: 0px solid #000000;
+ padding: 5px 5px 5px 5px;
+ margin: 5px;
+}
+
+#lselect h3 {
+ font-size: 9pt;
+ font-family: verdana, sans-serif;
+ color: #6B441A;
+ font-weight: bold;
+ margin: 0px;
+ padding: 0px;
+}
+
+#lfavorites{
+ border: 0px solid #000000;
+ padding: 5px 5px 5px 5px;
+ margin: 5px;
+}
+
+#lfavorites h3 {
+ font-size: 9pt;
+ font-family: verdana, sans-serif;
+ color: #6B441A;
+ font-weight: bold;
+ margin: 0px;
+ padding: 0px;
+}
+
+
+#larchives {
+ border: 0px solid #000000;
+ padding: 5px 5px 5px 5px;
+ margin: 5px;
+}
+#larchives h3 {
+ font-size: 9pt;
+ font-family: verdana, sans-serif;
+ color: #6B441A;
+ font-weight: bold;
+ margin: 0px;
+ padding: 0px;
+}
+
+
+#lresources {
+ border: 0px solid #000000;
+ padding: 5px 5px 5px 5px;
+ margin: 5px;
+}
+#lresources h3 {
+ font-size: 9pt;
+ font-family: verdana, sans-serif;
+ color: #6B441A;
+ font-weight: bold;
+ padding: 0px;
+ margin: 0px;
+}
+
+
+#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 {
+ font-size: 9pt;
+ font-family: verdana, sans-serif;
+ color: #995522;
+ font-weight: bold;
+ }
+
+#linkList li a:visited {
+ font-size: 8pt;
+ font-family: verdana, sans-serif;
+ color: #995522;
+ font-weight: bold;
+ }
+ /* css Zen Garden submission 075 - 'Lost HighWay' by Julien Roumagnac - http://www.j-roumagnac.net/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2003, Julien Roumagnac */
+/* Added: January 18th, 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. */
+
+
+
+
+/* basic elements ----------------------------------------------------------------------------------------*/
+body {
+ background: #1D1D1D url(main_bg_pattern.gif) repeat center;
+ margin: 0;
+ padding: 0;
+ text-align:center;
+ }
+
+a:link {
+ text-decoration: none;
+ color: #C6C6C6;
+ }
+a:visited {
+ text-decoration: none;
+ color: #C6C6C6;
+ }
+a:hover, a:active {
+ text-decoration: none;
+ color: #FFFFFF;
+ }
+acronym {
+ border-bottom: 0px dotted; /* Override for netscape that still want to display a dotted underline */
+ cursor:help;
+ font-weight: bold;
+ }
+
+/* Content ----------------------------------------------------------------------------------------*/
+/* Main Container */
+#container {
+ position: absolute;
+ width: 638px;
+ top: 18px;
+ left: 50%;
+ text-align: left;
+ margin-left: -319px;
+ background: url(container_bg.gif) repeat-y -4px;
+ z-index: 0;
+ }
+
+/* Main Container Cap */
+#extraDiv2 {
+ position: absolute;
+ width: 638px;
+ height: 18px;
+ top: 0px;
+ left: 50%;
+ margin-left: -319px;
+ background: url(container_top.gif) no-repeat -4px;
+ z-index: 0;
+ }
+
+/* Main CSS ZEN GARDEN Title */
+#extraDiv1 {
+ position: absolute;
+ width: 50%;
+ height: 301px;
+ bottom: 15px;
+ left: 0px;
+ background: url(main_title.gif) no-repeat right bottom;
+ margin-left: -317px;
+ z-index: 1;
+ }
+
+/* Hide titles : css Zen Garden, The Beauty of CSS Design, The Road to Enlightenment */
+h1 span, h2 span, h3 span {
+ display: none;
+}
+
+/* Photo Container */
+#intro {
+ position: absolute;
+ width: 600px;
+ height: 533px;
+ top: 0px;
+ left: 50%;
+ margin-left: -304px;
+ background: url(main_bg_photo.jpg) no-repeat;
+ }
+
+/* A Demonstration ... Summary */
+#quickSummary {
+ font-size: 9px;
+ font-family: Verdana;
+ color: #E12525;
+ width: 250px;
+ margin-left: 14px;
+ margin-top: 12px;
+ }
+
+/* The Road Enlightenment Title */
+#preamble {
+ font-size: 12px;
+ font-family: Verdana;
+ color: #AFAFAF;
+ width: 588px;
+ height: 100px;
+ font-style: italic;
+ text-align: right;
+ background: url(title_preamble.gif) no-repeat top right;
+ padding-top: 35px;
+ margin-top: 245px;
+ }
+
+/* the 3 Paragraphs margin */
+#preamble p.p1, #preamble p.p2, #preamble p.p3 {
+ position: absolute;
+ right: 10px;
+ }
+
+/* "Stairs texte effect */
+#preamble p.p1 {
+ width: 370px;
+}
+#preamble p.p2 {
+ width: 470px;
+ margin-top: 60px;
+}
+#preamble p.p3 {
+ width: 520px;
+ margin-top: 120px;
+}
+
+/* Main 4 sections beginning */
+#supportingText p {
+ text-indent: 24px;
+ }
+
+/* Links color */
+#supportingText a:link, #supportingText a:visited {
+ color: #FF2A2A;
+}
+#supportingText a:hover, #supportingText a:active {
+ color: #FF5A5A;
+}
+
+/* Fonts settings */
+#explanation , #participation, #benefits, #requirements {
+ margin-left: 15px;
+ width: 600px;
+ font-size: 11px;
+ font-family: Verdana;
+ color: #AFAFAF;
+ font-style: italic;
+ }
+
+/* Interval for gif tiltes */
+#explanation h3, #participation h3, #benefits h3, #requirements h3 {
+ height: 22px;
+ }
+
+/* Paragraphs Settings*/
+#explanation p, #participation p, #benefits p, #requirements p {
+ margin-left: 12px;
+ width: 580px;
+ margin-bottom: 12px;
+ }
+
+/* Blocks and Titles positioning */
+#explanation {
+ margin-top: 533px;
+ background: url(title_explanation.gif) no-repeat;
+}
+#participation {
+ background: url(title_participation.gif) no-repeat;
+}
+#benefits {
+ background: url(title_benefits.gif) no-repeat;
+}
+#requirements {
+ background: url(title_requirements.gif) no-repeat;
+}
+
+#footer {
+ margin-left: 15px;
+ width: 600px;
+ height: 15px;
+ font-size: 9px;
+ font-family: Verdana;
+ text-align: center;
+ word-spacing: 20px;
+ background: #320000;
+ padding-top: 2px;
+ border-bottom: 1px solid #A12727;
+ border-top: 1px solid #730000;
+ }
+
+/* LISTS ----------------------------------------------------------------------------------------*/
+/* List Select a Design **************************************************/
+/* Main positioning and Gif Title */
+#lselect {
+ position: absolute;
+ top: 16px;
+ right: 23px;
+ background: url(list_title_design.gif) no-repeat top right;
+ z-index: 2;
+}
+
+/* Hide non Gif Title */
+#lselect h3 {display:none}
+
+/* Background */
+#lselect ul {
+ width: 187px;
+ height: 261px;
+ background: url(list_bg_design.gif) no-repeat top right;
+ margin: 19px 0px;
+ padding-top: 5px;
+ }
+
+/* Put a Fake Transparent dot to have the same line height in IE and NS */
+/* Use a Background Dot to improve positioning possibility */
+#lselect li {
+ font-family: Verdana;
+ font-size: 9px;
+ color: #E12525;
+ padding: 0px 0px 8px 33px;
+ list-style: none url(list_fake_dot.gif);
+ background: url(list_dot.gif) no-repeat 10px;
+ }
+
+/* Force carriage return before 'by' */
+#lselect li a:link, #lselect li a:visited {display: block;}
+#linkList li a.c:link, #linkList li a.c:visited {display: inline;}
+
+/* List Archives **************************************************/
+/* Main positioning and Gif Title */
+#larchives {
+ position: absolute;
+ top: 130px;
+ left: 15px;
+ background: url(list_title_archives.gif) no-repeat top left;
+ z-index: 2;
+ }
+/* Hide non Gif Title */
+#larchives h3 {display:none}
+
+/* Background */
+#larchives ul {
+ width: 169px;
+ height: 79px;
+ background: url(list_bg_archives.gif) no-repeat top left;
+ margin: 19px 0px 0px 0px;
+ padding-top: 5px;
+ padding-left: 0px;
+ }
+
+/* Put a Fake Transparent dot to have the same line height in IE and NS */
+#larchives li {
+ font-family: Verdana;
+ font-size: 9px;
+ color: #E12525;
+ padding: 0px 0px 6px 10px;
+ list-style: none url(list_fake_dot.gif);
+ }
+
+/* List Resources **************************************************/
+/* Main positioning and Gif Title */
+#lresources {
+ position: absolute;
+ top: 212px;
+ left: 15px;
+ background: url(list_title_resources.gif) no-repeat bottom left;
+ z-index: 2;
+ }
+/* Hide non Gif Title */
+#lresources h3 {display:none}
+
+/* Background */
+#lresources ul {
+ width: 169px;
+ height: 109px;
+ background: url(list_bg_resources.gif) no-repeat top left;
+ margin: 0px 0px 0px 0px;
+ padding-top: 5px;
+ padding-left: 0px;
+ }
+
+/* Put a Fake Transparent dot to have the same line height in IE and NS */
+#lresources li {
+ font-family: Verdana;
+ font-size: 9px;
+ color: #E12525;
+ padding: 0px 0px 6px 10px;
+ list-style: none url(list_fake_dot.gif);
+ }/* css Zen Garden submission 076 - 'Lotus' by Chika */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2004, Chika */
+/* Added: February 3rd, 2004 */
+
+/* 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 {
+ margin: 0px;
+ padding: 0px;
+ background-color: #ffffff;
+ font-size: 12px;
+ line-height: 133%;
+ color: #333333;
+ font-family: arial, helvetica, sans-serif;
+ text-align: center;
+}
+
+a {
+ color: #996699;
+ text-decoration: none;
+}
+
+a:hover, a:active {
+ text-decoration: underline;
+}
+
+/* frame */
+#container {
+ background: transparent url(body_bg.gif) repeat-y top left;
+ margin: 0px auto;
+ padding: 0px;
+ width: 752px;
+ text-align: left;
+}
+
+/* header */
+#pageHeader {
+ margin: 0px 12px;
+ padding: 107px 0px 0px 0px;
+}
+
+#pageHeader h1 {
+ position: relative;
+ background: transparent url(title.gif) no-repeat top left;
+ margin: 0px;
+ padding: 0px;
+ width: 728px;
+ height: 37px;
+ z-index: 2;
+}
+
+#pageHeader h1 span {
+ display: none;
+}
+
+#pageHeader h2 {
+ position: absolute;
+ background: transparent url(catch.gif) no-repeat top left;
+ margin: 5px 0px 0px 9px;
+ padding: 0px;
+ width: 162px;
+ height: 17px;
+ z-index: 2;
+}
+
+#pageHeader h2 span {
+ display: none;
+}
+
+#quickSummary {
+ position: relative;
+ margin: 6px 0px 0px 428px;
+ width: 300px;
+ height: 97px;
+ z-index: 2;
+}
+
+#quickSummary p {
+ margin: 0px;
+ padding: 0px;
+ font-size: 11px;
+ line-height: 125%;
+}
+
+/* contents */
+#preamble {
+ position: relative;
+ margin: 0px 0px 25px 262px;
+ padding: 0px;
+ width: 466px;
+ z-index: 1;
+}
+
+#supportingText {
+ background: transparent url(footer_bg.gif) no-repeat bottom left;
+ margin: 0px 12px;
+ padding: 0px;
+}
+
+#explanation, #participation, #benefits, #requirements {
+ position: relative;
+ margin: 0px 0px 0px 250px;
+ padding: 0px 0px 20px 0px;
+ width: 466px;
+ z-index: 1;
+}
+
+#participation, #requirements {
+ padding: 0px 0px 10px 0px;
+}
+
+#benefits {
+ padding: 10px 0px 30px 0px;
+}
+
+#explanation {
+ background: transparent url(contents_txt_bg_02.gif) no-repeat center center;
+}
+
+#participation {
+ background: transparent url(contents_txt_bg_03.gif) no-repeat center center;
+}
+
+#benefits {
+ background: transparent url(contents_txt_bg_04.gif) no-repeat center center;
+}
+
+#requirements {
+ background: transparent url(contents_txt_bg_05.gif) no-repeat center center;
+}
+
+#preamble h3, #explanation h3, #participation h3, #benefits h3, #requirements h3 {
+ margin: 0px;
+ padding: 0px;
+}
+
+#preamble h3 {
+ background: transparent url(head_preamble.gif) no-repeat top left;
+ width: 202px;
+ height: 35px;
+}
+
+#explanation h3 {
+ background: transparent url(head_explanation.gif) no-repeat top left;
+ width: 173px;
+ height: 35px;
+}
+
+#participation h3 {
+ background: transparent url(head_participation.gif) no-repeat top left;
+ width: 95px;
+ height: 35px;
+}
+
+#benefits h3 {
+ background: transparent url(head_benefits.gif) no-repeat top left;
+ width: 65px;
+ height: 35px;
+}
+
+#requirements h3 {
+ position: relative;
+ background: transparent url(head_requirements.gif) no-repeat top left;
+ width: 106px;
+ height: 35px;
+ bottom:10px;
+}
+
+#preamble h3 span, #explanation h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span {
+ display: none;
+}
+
+#preamble p, #explanation p, #participation p, #benefits p, #requirements p {
+ margin: 0px;
+ padding: 4px 0px;
+}
+
+#requirements p {
+ position: relative;
+ bottom:10px;
+}
+
+#footer {
+ margin: 0px 0px 0px 250px;
+ padding: 0px 0px 26px 0px;
+ width: 466px;
+ text-align: right;
+}
+
+#footer a {
+ color: #666666;
+ text-decoration: underline;
+}
+
+/* link */
+#linkList {
+ background: transparent url(link_bg.gif) no-repeat top left;
+ position: absolute;
+ margin: 0px 0px 0px 20px;
+ top: 247px;
+ width: 242px;
+ z-index: 1;
+}
+
+#linkList2 {
+ padding: 0px 0px 8px 0px;
+ background: transparent url(link_footer_bg.gif) no-repeat bottom left;
+}
+
+#linkList ul {
+ margin: 0px 6px;
+ padding: 0px;
+ list-style-type: none;
+}
+
+#linkList li {
+ margin: 0px;
+ padding: 1px 0px;
+}
+
+#lselect , #larchives , #lresources {
+ margin: 9px 0px 0px 7px;
+ padding: 0px 0px 12px 0px;
+ width: 219px;
+}
+
+#lselect , #larchives {
+ background: transparent url(link_line.gif) no-repeat bottom left;
+}
+
+#lselect h3, #larchives h3, #lresources h3 {
+ margin: 0px 0px 1px 0px;
+ padding: 0px;
+}
+
+#lselect h3 {
+ background: transparent url(head_select.gif) no-repeat top left;
+ width: 219px;
+ height: 21px;
+}
+
+#larchives h3 {
+ background: transparent url(head_archives.gif) no-repeat top left;
+ width: 219px;
+ height: 21px;
+}
+
+#lresources h3 {
+ background: transparent url(head_resources.gif) no-repeat top left;
+ width: 219px;
+ height: 21px;
+}
+
+#lselect h3 span, #larchives h3 span, #lresources h3 span {
+ display: none;
+}
+
+#lselect a {
+ font-size: 11px;
+ font-weight: bold;
+ color: #336666;
+}
+
+#lselect a.c {
+ font-weight: normal;
+ color: #996699;
+}
+
+#larchives a , #lresources a {
+ color: #333333;
+}
+
+/* images */
+#extraDiv1 {
+ position: absolute;
+ top: 20px;
+ left: 0px;
+ text-align: center;
+ width: 100%;
+ z-index: 0;
+}
+
+#extraDiv1 span {
+ background: transparent url(header_bg.jpg) no-repeat top left;
+ margin: 0px auto;
+ padding: 0px;
+ width: 728px;
+ height: 207px;
+ display: block;
+}
+
+#extraDiv2 {
+ position: absolute;
+ top: 227px;
+ left: 0px;
+ text-align: center;
+ width: 100%;
+ z-index: 0;
+}
+
+#extraDiv2 span {
+ background: transparent url(contents_bg.gif) no-repeat top left;
+ margin: 0px auto;
+ padding: 0px;
+ width: 728px;
+ height: 273px;
+ display: block;
+}
+
+#sampleextraDiv3, #sampleextraDiv4, #sampleextraDiv5, #sampleextraDiv6 {
+ display: none;
+}/* css Zen Garden submission 077 - 'Hop' by Guillaume L. */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2004, Guillaume L. */
+/* Added: February 3rd, 2004 */
+
+/* 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. */
+
+
+
+a:link {
+ text-decoration: none;
+ color: #8B008B;
+ }
+a:visited {
+ text-decoration: none;
+ color: #2F4F4F;
+ }
+a:hover, a:active {
+ text-decoration: underline;
+ color: #FF1493;
+ }
+acronym {
+ border-bottom: 0px dotted;
+ cursor:help;
+ font-weight: bold;
+ }
+body {
+ background: #F2C9FF url(fond.jpg) repeat-x;
+ margin: 0 0 0 0;
+ padding: 0 0 0;
+
+
+ }
+h3 {
+ font-family: Arial, sans-serif; font-size: 18px;color: #6E66A2;
+ font-style: italic;
+}
+h1 span, h2 span{
+ display: none;
+
+ }
+#container {
+ position: absolute;
+ width: 779px;
+ top: 0px;
+ left: 50%;
+ text-align: left;
+ margin-left: -380px;
+ background-image: url(back.jpg);
+ background-repeat: no-repeat;
+ height: 808px;
+ }
+
+#pageHeader {
+ display: none;
+ }
+#quickSummary {
+ position: absolute;
+ top: 12px;
+ width: 500px;
+ margin-left: 245px;
+ margin-right: 0px;
+ line-height: 10px;margin-bottom: 0px;
+ padding-bottom: 0px;
+ margin-top: 0px;
+ padding-top: 0px;
+
+}
+#quickSummary p {
+ margin-bottom: 0px;
+ padding-bottom: 0px;
+ margin-top: 0px;
+ padding-top: 0px;
+ text-align: right;
+ color: #585959;
+ font-size: 12px;
+ line-height: 12px;
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+
+ }
+#preamble {
+ position: absolute;
+ top: 235px;
+ left: 40%;
+ overflow: auto;
+ height: 230px;
+ width: 435px;
+ margin-top: 0px;
+ padding-top: 0px;
+ text-align: justify;
+ }
+#preamble h3 {
+ margin-top: 18px;
+}
+#preamble p.p1 {
+ line-height: 12px;
+ font-size: 12px;
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ color: #2F4F4F;
+ font-style: italic;
+ margin-bottom: 10px;
+ padding-bottom: 0px;
+ }
+#preamble p.p2 {
+ font-size: 12px;
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ color: #2F4F4F;
+ font-style: italic;
+ line-height: 12px;
+ margin-bottom: 10px;
+ margin-top: 0px;
+ }
+#preamble p.p3 {
+font-size: 12px;
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ color: #2F4F4F;
+ font-style: italic;
+ text-align: center;
+ line-height: 12px;margin-top: 0px;
+
+
+ }
+
+#supportingText {
+ position: absolute;
+ top: 460px;
+ left: 40%;
+ overflow: auto;
+ height: 270px;
+ width: 450px;
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ font-size: 12px;
+ margin-bottom: 0px;
+ padding-bottom: 0px;
+ margin-top: 0px;
+ padding-top: 0px;
+
+ padding-left: 0px;
+ padding-right: 0px;
+ margin-left: 0px;
+ margin-right: 0px;
+ border: 1px dashed #ECBFF6;
+ }
+
+#explanation , #participation, #benefits, #requirements {
+
+ width: 425px;
+ font: medium;
+ color: #666666;
+ margin-top: 0px;
+ margin-left: 0px;
+ margin-bottom: 0px;
+ padding-top: 0px;
+ padding-bottom: 0px;
+ margin-right: 0px;
+ }
+
+#explanation p, #participation p, #benefits p, #requirements p {
+ margin-left: 15px;
+ margin-right: 15px;
+ margin-top: 15px;
+font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ line-height: 16px;
+
+ padding: 10px 10px 10px 10px;
+ text-align: justify;
+
+ }
+#requirements p {
+
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+
+}
+#benefits p{
+
+ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+}
+#explanation {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; text-align: left; }
+
+#participation {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ padding-top: 30px;
+ text-align: right;
+ padding-bottom: 0px;
+ margin-top: 0px;
+ margin-bottom: 0px;
+ }
+#benefits {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ padding-top: 30px;
+ text-align: left;
+ }
+#requirements {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
+ padding-top: 30px;
+
+ margin-bottom: 40px;
+ text-align: right;
+ }
+#lselect {
+ position: absolute;
+ top: 360px;
+ left: 60px;
+
+ }
+#lselect h3 {
+ font-family: sans-serif;
+ font-size: small;
+ color: #2F4F4F;
+ margin: 0;
+ padding-left: 0px;
+ }
+#lselect ul {
+ width: 200px;
+ display: block;
+ margin-left: 0px;
+ list-style: none;margin-top: 0px;
+ margin-bottom: 0px;padding-left: 0px;
+ }
+#lselect li {
+ font-family: Verdana;
+ font-size: 10px;
+ color: Black;
+ text-align: left;
+ line-height: 12px;
+ margin: 0 20px 3px 5px;
+ padding-left: 0px;
+ }
+#lselect li a:link, #lselect li a:visited ,
+#linkList li a.c:link, #linkList li a.c:visited {display: inline;}
+#larchives {
+ position: absolute;
+ top: 560px;
+ left: 60px;
+ }
+#larchives h3 {
+ font-family: sans-serif;
+ font-size: small;
+ color: #2F4F4F;
+ text-align: justify;
+ margin: 0;
+ padding-left: 0px;
+}
+#larchives ul {
+ width: 220px;
+ display: block;
+ margin-left: 0px;
+ list-style: none;
+ margin-top: 0px;
+ margin-bottom: 0px;
+ padding-left: 0px;
+ }
+#larchives li {
+ font-family: Verdana;
+ font-size: 10px;
+ color: black;
+ text-align: justify;
+ line-height: 12px;
+ margin: 0 20px 3px 5px;
+ padding-left: 0px;
+ }
+#lresources {
+ position: absolute;
+ top: 620px;
+ left: 60px;
+ }
+#lresources h3 {
+ font-family: sans-serif;
+ font-size: small;
+ color: #2F4F4F;
+ text-align: left;
+ margin: 0;
+ padding-left: 0px;
+ }
+#lresources ul {
+ width: 220px;
+ display: block;
+ margin-left: 0px;
+ list-style: none;margin-top: 0px;
+ margin-bottom: 0px;padding-left: 0px;
+ }
+#lresources li {
+ font-family: Verdana;
+ font-size: 10px;
+ color: Black;
+ text-align: left;
+ line-height: 12px;
+ margin: 0 20px 3px 5px;
+ padding-left: 0px;
+ }
+#footer {
+ width: 240px;
+ text-align: center;
+ font-family: Verdana;
+ font-size: small;
+ font-weight: bolder;
+ margin-left: 100px;
+ padding-bottom: 0px;
+ margin-bottom: 0px;
+ margin-top: 0px;
+ background: url(bas-menu.jpg);
+ z-index: 10;
+ padding-top: 210px;
+ }
+#extraDiv1 {
+ display: none;
+ }/* css Zen Garden submission 078 - 'Muto Verde' by Alex Taylor , http://www.alextaylor.org */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics and photos copyright 2004, Alex Taylor */
+/* Added: February 15th, 2004 */
+
+/* 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. */
+
+
+
+/* HTML */
+body {
+ margin: 0 auto;
+ padding: 0;
+ font: 12px Arial,Sans-Serif;
+ text-align: center;
+ background: url(bg.jpg);
+ voice-family: "\"}\""; voice-family:inherit;
+ }
+
+h1, h2, h3 {
+ margin: 0;
+ }
+
+ul {
+ margin: 0px;
+ }
+
+ li {
+ /*list-style: square outside url(semicolon_bullet.jpg);*/
+ margin: 3px 0px 6px -20px;
+ }
+
+p {
+ line-height: 1.3;
+ }
+
+a:link {
+ color: #003300;
+}
+
+a:active{
+ color: #003300;
+}
+
+a:visited {
+ color: #003300;
+}
+
+a:hover {
+ color: #336633;
+}
+
+/* CLASSES */
+
+
+/* IDs */
+#container {
+ position: relative;
+ width: 760px;
+ margin: 0 auto;
+ text-align: left;
+ }
+
+#intro {
+ margin: 0;
+ }
+
+#pageHeader {
+ font: normal 12px Georgia,Serif;
+ height: 135px;
+ margin: 0;
+ background: transparent url(csszen_header.jpg) no-repeat top right;
+ }
+
+ #pageHeader h1, h2 {
+ margin: 0;
+ display: none;
+ }
+
+#quickSummary {
+ font: italic 12px Georgia,Serif;
+ padding: 3px;
+ margin: 0;
+ background: url(introbg.jpg) repeat-y 99px;
+ }
+
+ #quickSummary p.p1 {
+ position: relative;
+ left: 210px;
+ width: 530px;
+ margin: 0;
+ }
+
+ #quickSummary p.p2 {
+ position: relative;
+ left: 210px;
+ width: 345px;
+ padding: 4px 0px 0px 0px;
+ margin: 0;
+ }
+
+#supportingText {
+ position: relative;
+ width: 410px;
+ height: auto;
+ /*background: url(introbg.jpg) repeat-y 99px;*/
+ }
+
+ #supportingText h3 {
+ width: 758px;
+ height: 25px;
+ background: transparent url(header_explanation.png) no-repeat;
+ }
+
+ #supportingText h3 span {
+ display: none;
+ }
+
+ #supportingText p {
+ padding: 3px;
+ position: relative;
+ left: 210px;
+ width: 345px;
+ margin: 0;
+ }
+
+#preamble {
+ position: relative;
+ width: 410px;
+ height: auto;
+ background: url(roadbg.jpg) repeat-y 227px;
+/* background-repeat: repeat-y;*/
+ text-align: justify;
+ }
+
+ #preamble h3 {
+ width: 750px;
+ height: 25px;
+ background: transparent url(header_enlightenment.gif) no-repeat;
+ }
+
+ #preamble h3 span {
+ display: none;
+ }
+
+ #preamble p {
+ padding: 3px;
+ position: relative;
+ left: 335px;
+ width: 410px;
+ margin: 0;
+ }
+
+#explanation {
+ position: relative;
+ width: 410px;
+ height: auto;
+ background: url(explanationbg.jpg) repeat-y 227px;
+ background-repeat: repeat-y;
+ text-align: justify;
+ }
+
+ #explanation h3 {
+ width: 758px;
+ height: 25px;
+ background: transparent url(header_sowhatisthisabout.gif) no-repeat;
+ }
+
+ #explanation h3 span {
+ display: none;
+ }
+
+ #explanation p {
+ padding: 3px;
+ position: relative;
+ left: 335px;
+ width: 410px;
+ margin: 0;
+ }
+
+#participation {
+ position: relative;
+ width: 410px;
+ height: auto;
+ background: url(dockbg.jpg) repeat-y 227px;
+ background-repeat: repeat-y;
+ text-align: justify;
+ }
+
+ #participation h3 {
+ width: 758px;
+ height: 25px;
+ background: transparent url(header_participation.gif) no-repeat;
+ }
+
+ #participation h3 span {
+ display: none;
+ }
+
+ #participation p {
+ padding: 3px;
+ position: relative;
+ left: 335px;
+ width: 410px;
+ margin: 0;
+ }
+
+#benefits {
+ position: relative;
+ width: 410px;
+ height: auto;
+ background: url(benefitsbg.jpg) repeat-y 227px;
+ background-repeat: repeat-y;
+ text-align: justify;
+ }
+
+ #benefits h3 {
+ width: 758px;
+ height: 25px;
+ background: transparent url(header_benefits.gif) no-repeat;
+ }
+
+ #benefits h3 span {
+ display: none;
+ }
+
+ #benefits p {
+ padding: 3px;
+ position: relative;
+ left: 335px;
+ width: 410px;
+ margin: 0;
+ }
+
+#requirements {
+ position: relative;
+ width: 410px;
+ height: auto;
+ background: url(lockbg.jpg) repeat-y 227px;
+ background-repeat: repeat-y;
+ text-align: justify;
+ }
+
+ #requirements h3 {
+ width: 758px;
+ height: 25px;
+ background: transparent url(header_requirements.gif) no-repeat;
+ }
+
+ #requirements h3 span {
+ display: none;
+ }
+
+ #requirements p {
+ padding: 3px;
+ position: relative;
+ left: 335px;
+ width: 410px;
+ margin: 0;
+ }
+
+#linkList {
+ text-align: right;
+
+ position: absolute;
+ top: 196px;
+ left: -10px;
+ width: 220px;
+ }
+
+#lselect h3 {
+ margin: 8px 20px;
+ width: 198px;
+ height: 25px;
+ background: transparent url(selectdesign.jpg) no-repeat;
+ }
+
+ #lselect h3 span { display: none; }
+
+ #lselect li {
+ font-size: 10px;
+ padding: 0px 0px 5px 20px;
+ list-style: none;
+ /*background: url(semicolon_bullet.jpg) no-repeat 0px 50%;*/
+ background-repeat: no-repeat;
+ }
+
+ #lselect a {
+ font-size: 12px;
+ }
+
+ #lselect a.c, #lselect a:link.c , #lselect a:visited.c{
+ font-size: 10px;
+ font-weight: normal;
+ }
+
+#larchives h3 {
+ margin: 8px 20px;
+ width: 198px;
+ height: 25px;
+ background: transparent url(archives.jpg) no-repeat;
+ }
+
+ #larchives h3 span { display: none; }
+
+ #larchives li {
+ padding: 0px 0px 2px 20px;
+ list-style: none;
+ /*background: url(arrow_bullet.jpg) no-repeat 2px 0%;*/
+ }
+
+#lresources h3 {
+ margin: 8px 20px;
+ width: 198px;
+ height: 25px;
+ background: transparent url(resources.jpg) no-repeat;
+ }
+
+ #lresources h3 span { display: none; }
+
+ #lresources li {
+ padding: 0px 0px 2px 20px;
+ list-style: none;
+ /*background: url(arrow_bullet.jpg) no-repeat 2px 0%;*/
+ }
+
+/*Thanks to Douglas Bowman of stopdesign.com for this
+little trick with the links*/
+#linkList #lselect a:link, #linkList #lselect a:visited {display:block;}
+
+#linkList #lselect a.c:link, #linkList #lselect a.c:visited {
+display:inline;}
+
+#footer {
+ position: relative;
+ width: 758px;
+ height: 50px;
+ padding: 4px 40px 0px 0px;
+ text-align: right;
+ background: transparent url(header_footer.gif) no-repeat;
+}
+
+ #footer a {
+ font-weight: bold;
+ }/* css Zen Garden submission 079 - 'Green Tea' by Amy Rae Som, http://www.avisualmind.com */
+/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
+/* All associated graphics and photos copyright 2004, Amy Rae Som */
+/* Added: February 15th, 2004 */
+
+/* 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:#a2c4a3 url(flower_bg.jpg) repeat-x;font-family:"Trebuchet MS", Arial, Geneva, sans-serif;font-size:70%;color:#030;}
+#pageHeader {position:absolute;left:20px;top:39px;width:222px;height:63px;background:url(cssZenGarden.gif) no-repeat;}
+#pageHeader span {margin-left:-1000px;}
+#quickSummary .p1 {position:absolute;left:0;top:114px;width:750px;height:16px;background:url(an_example.gif) no-repeat;}
+#quickSummary .p1 span {margin-left:-1000em;}
+#quickSummary .p2 {position:absolute;left:116px;top:528px;width:88px;height:42px;font-weight:bold;}
+#preamble {position:absolute;left:20px;top:145px;width:222px;height:298px;overflow:auto;}
+h3 {background:transparent;font:italic normal 1.4em "Times New Roman",Times,serif;margin:0;border-bottom:1px solid #a2c4a3;color:#603;}
+p {margin:0 0 6px 0; line-height:1.5em;}
+div {margin:0;}
+a {background:transparent;color:#060;}
+#supportingText {position:absolute;left:268px;top:145px;width:63%;height:297px;padding-right:4px;overflow:auto;}
+#linkList {position:absolute;left:268px;top:459px;width:63%;}
+#linkList a {color:#030;}
+#linkList a.c {text-decoration:none;}
+#linkList a.c:hover {text-decoration:underline;}
+#linkList h3 {background:transparent;font-size:1.3em;margin:0.6em 0 0;border-bottom:1px solid #82B084;}
+#linkList ul {margin:0;padding:0.2em 0;}
+#linkList li {list-style-type:none;display:inline;background:url(greenarrow.gif) 0% 50% no-repeat;margin:0;padding:0 0 0 1.3em;}/* css Zen Garden submission 080 - 'Zen Pool', by Clinton Barth http://www.516media.com/ */ /* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */ /* All associated graphics copyright 2004, Clinton Barth */ /* Added: February 15th, 2004 */ /* 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. */ /* common styles ----------------------------------------------- */ body { background: #474747; font-family: "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, helvetica, sans-serif; margin: 0px; padding: 0px; color: #000; } /* layout ----------------------------------------------- */ #container { position: relative; background: #9cf; margin: 20px auto; padding: 0px; width: 700px; border: 5px solid #fff; } #quickSummary { position: absolute; top: 205px; left: 0px; width: 166px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; } #preamble, #explanation, #participation, #benefits, #requirements { margin: 0px 0 0 192px; width: 480px; background: transparent; } #footer { margin: 25px 0 0 0; background: transparent url(footer.jpg) top left no-repeat; height: 1.5em; text-align: right; border-top: 1px solid #fff; } #linkList { position: absolute; width: 166px; top: 26em; left: 0px; border-top: 1px solid #fff; } /* header ----------------------------------------------- */ #pageHeader { background: url(header.jpg) top left no-repeat; height: 200px; margin: 0; border-bottom: 5px solid #fff; } #pageHeader h1 { display: none; } #pageHeader h2 { display: none; } /* text ----------------------------------------------- */ p { font-size: 12px; padding: 5px 5px 10px 5px; margin: 0; line-height: 16px; } #quickSummary p.p1 { margin: 0; padding: 40px 35px 25px 28px; font-size: 11px; } #quickSummary p.p2 { margin-top: 48em; padding: 30px 30px 20px 28px; font-size: 11px; } /* headings ----------------------------------------------- */ #quickSummary { background: transparent url(h3_quickSummary.gif) top left no-repeat; margin: 0px; } #intro h3 { margin: 10px 0 0 0; padding: 0; width: 480px; height: 35px; border: 1px solid #fff; } #supportingText h3 { margin: 10px 0 0 0; padding: 0; width: 480px; height: 25px; border: 1px solid #fff; } #linkList h3 { height: 25px; margin: 0px 0 0 0; padding: 0px; } h3 span { display: none; } #preamble h3 { background: transparent url(h3_preamble.jpg) no-repeat top left; } #explanation h3 { background: transparent url(h3_explanation.jpg) no-repeat top left; } #participation h3 { background: transparent url(h3_participation.jpg) no-repeat top left; } #benefits h3 { background: transparent url(h3_benefits.jpg) no-repeat top left; } #requirements h3 { background: transparent url(h3_requirements.jpg) no-repeat top left; } #lselect h3 { background: transparent url(h3_lselect.gif) no-repeat top left; margin: 15px 0 0 5px; } #lfavorites h3 { background: transparent url(h3_lfavorites.gif) no-repeat top left; margin: 15px 0 0 5px; } #larchives h3 { background: transparent url(h3_larchives.gif) no-repeat top left; margin: 15px 0 0 5px; } #lresources h3 { background: transparent url(h3_lresources.gif) no-repeat top left; margin: 15px 0 0 5px; } /* lists ----------------------------------------------- */ #linkList ul { font-size: 10px; list-style: none; margin: 2px 0 0 0px; padding: 0 0 0 0; } #linkList ul li { background: transparent; margin: 0; padding: 0 0 0 27px; line-height: 14px; color: #369; } #linkList #lselect { border-bottom: 1px solid #fff; padding-bottom: 25px; } #linkList #lfavorites { border-bottom: 1px solid #fff; padding-bottom: 25px; } #linkList #larchives { border-bottom: 1px solid #fff; padding-bottom: 25px; } #linkList #lresources { border-bottom: 1px solid #fff; padding-bottom: 25px; } #linkList #lselect a:link, #linkList #lselect a:visited { display: block; } #linkList #lselect a.c:link, #linkList #lselect a.c:visited { display:inline; } /* links ----------------------------------------------- */ a, a:link, a:visited { color: #369; text-decoration: underline; font-weight: normal; } a:hover { color: #fff; text-decoration: none; font-weight: normal; } #quickSummary a, #quickSummary a:link, #quickSummary a:visited { font-weight: bold; text-decoration: underline; color: #369; } #quickSummary a:hover { font-weight: bold; text-decoration: none; color: #fff; } #linkList a, #linkList a:link, #linkList a:visited { color: #000; text-decoration: none; } #linkList a:hover { text-decoration: none; color: #fff; } #linkList a.c, #linkList a.c:link, #linkList a.c:visited { color: #369; text-decoration: none; } #linkList a.c:hover { text-decoration: none; color: #fff; } #footer a, #footer a:link, #footer a:visited { text-decoration: none; color: #fff; font-size: 12px; padding: 0 20px 0 0; } #footer a:hover { text-decoration: none; color: #9cf; } /* css Zen Garden submission 081 - 'seashore', by Christine Kirchmeier, http://www.sightdesign.de/ */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* All associated graphics copyright 2004, Christine Kirchmeier */
+/* Added: February 15th, 2004 */
+
+/* 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. */
+
+
+
+
+/* Tag Definitions */
+
+body {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ text-align: left;
+
+ background: #FFFFFF url(bg.gif);
+ background-attachment:fixed;
+ font: 11px Verdana, Arial,sans-serif;
+ color: #233A54;
+
+ }
+
+h3 {
+ margin: 0;
+ padding: 0;
+ }
+
+acronym {
+ border-bottom: 1px dotted #4C83AE;
+ }
+
+a acronym {
+ border: 0;
+ }
+
+a:link {
+ font-weight: 900;
+ color: #4C83AE;
+ text-decoration: none;
+ }
+
+a:visited {
+ font-weight: 900;
+ color: #999999;
+ text-decoration: none;
+ }
+
+a:hover,a:active {
+ font-weight: 900;
+ color: #9B3F17;
+ }
+
+/* ID Definitions */
+
+#container {
+ position: relative;
+ top: 0;
+ margin: 0 auto;
+ padding: 0;
+ text-align: left;
+ border-left: 4px solid #FFFFFF;
+ border-right: 4px solid #FFFFFF;
+ border-bottom: 4px solid #000000;
+ background-color: #EBEBEB;
+ width: 750px;
+ }
+
+/************** INTRO *************************/
+
+#intro {
+ background:#EBB692 url(summarybg.gif) repeat-x;
+ width:749px;
+ }
+
+#pageHeader {
+ position: absolute;
+ margin: 0;
+ padding: 0px;
+ top: 0px;
+ left: 0px;
+ display: block;
+ width: 366px;
+ height: 474px;
+ background: transparent url(csszengarden.jpg) no-repeat;
+ border-right: 1px dashed #000000;
+ }
+
+#pageHeader h1,h2{
+ display:none;
+ }
+
+#quickSummary {
+ position: relative;
+ top: 8px;
+ left:378px;
+ width: 364px;
+ height:140px;
+ margin: 0;
+ padding: 30px;
+ overflow: auto;
+ background: transparent url(quicksumbg.gif) no-repeat;
+ }
+
+#quickSummary p.p1 {
+ position: relative;
+ padding: 0px;
+ margin: 0px;
+ width: 300px;
+ text-align: left;
+ font: 11px Verdana, Arial, serif;
+ color: #FFFFFF;
+ line-height: 1.2;
+ }
+
+#quickSummary p.p1:first-letter {
+ font: bold 18px Verdana, Arial, sans-serif;
+ color: #2F3F56;
+ }
+
+#quickSummary p.p2 {
+ position: relative;
+ padding: 0;
+ margin: 10px 0 0 0;
+ width: 300px;
+ text-align: left;
+ font: 11px Verdana,Arial, sans-serif;
+ color: #FFFFFF;
+ }
+
+#quickSummary p.p2:first-letter {
+ font: bold 18px Verdana, Arial, sans-serif;
+ color: #2F3F56;
+ }
+
+#preamble {
+ position: absolute;
+ top: 152px;
+ left: 367px;
+ width: 382px;
+ height:300px;
+ padding: 0 0 0 0;
+ margin: 0 0 0 0;
+ display: block;
+ overflow: auto;
+ background: transparent url(divbg.gif) repeat-x;
+ color: #233A54;
+ }
+
+
+#preamble h3 {
+ background: transparent url(roadtoenlightenment.gif) no-repeat;
+ width: 340px;
+ height: 29px;
+ padding:0px;
+ margin: 20px 0px 0px 15px;
+ display: block;
+ }
+
+#preamble h3 span {
+ display:none;
+ }
+
+#preamble p {
+ position: relative;
+ top: 0;
+ left: 15px;
+ width: 340px;
+ font: 11px/7px Verdana, Arial, sans-serif;
+ line-height: 1.2;
+ color: #233A54;
+ text-align: justify;
+ margin:15px 0 0 0;
+ }
+
+/************** MAIN ************/
+#supportingText {
+ position: relative;
+ top: 258px;
+ left: 366px;
+ width: 383px;
+ margin: 0;
+ padding: 0;
+ padding-bottom:260px; /* opera fix */
+}
+
+#supportingText p {
+ font: x-small Verdana, Arial, sans-serif;
+ color: #333333;
+ text-align: justify;
+ }
+
+#explanation {
+ position: relative;
+ top: 0;
+ left: 0;
+ width: 382px;
+ padding: 0 0 20px 0;
+ margin: 0;
+ display: block;
+ overflow: auto;
+ background: #EBEBEB url(divbg.gif) repeat-x;
+ color: #233A54;
+ border-left:1px dashed #000000;
+ }
+
+#explanation p {
+ position: relative;
+ top: 0;
+ left: 15px;
+ width: 340px;
+ font: 11px/7px Verdana, Arial, sans-serif;
+ line-height: 1.2;
+ color: #233A54;
+ margin:15px 0 0 0;
+}
+
+#explanation h3 {
+ background: transparent url(sowhat.gif) no-repeat;
+ width: 340px;
+ height: 29px;
+ padding:0;
+ margin: 20px 0px 0px 15px;
+ display: block;
+ }
+
+#explanation h3 span{
+ display: none;
+ }
+
+#participation {
+ position: relative;
+ top: 0;
+ left: 0;
+ width: 382px;
+ padding: 0 0 20px 0;
+ margin: 0;
+ display: block;
+ overflow: auto;
+ background: #EBEBEB url(divbg.gif) repeat-x;
+ color: #233A54;
+ border-left:1px dashed #000000;
+ }
+
+#participation p {
+ position: relative;
+ top: 0;
+ left: 15px;
+ width: 340px;
+ font: 11px/7px Verdana, Arial, sans-serif;
+ line-height: 1.2;
+ color: #233A54;
+ margin:15px 0 0 0;
+}
+
+#participation h3 {
+ background: transparent url(participation.gif) no-repeat;
+ width: 340px;
+ height: 29px;
+ padding:0px;
+ margin: 20px 0px 0px 15px;
+ display: block;
+ }
+
+#participation h3 span{
+ display: none;
+ }
+
+#benefits {
+ position: relative;
+ top: 0;
+ left: 0;
+ width: 382px;
+ padding: 0 0 20px 0;
+ margin: 0;
+ display: block;
+ overflow: auto;
+ background: #EBEBEB url(divbg.gif) repeat-x;
+ color: #233A54;
+ border-left:1px dashed #000000;
+ }
+
+#benefits h3 {
+ background: transparent url(benefits.gif) no-repeat;
+ width: 340px;
+ height: 29px;
+ padding: 0;
+ margin: 20px 0px 0px 15px;
+ display: block;
+ }
+
+#benefits h3 span {
+ display: none;
+ }
+
+#benefits p {
+ position: relative;
+ top: 0;
+ left: 15px;
+ width: 340px;
+ font: 11px/7px Verdana, Arial, sans-serif;
+ line-height: 1.2;
+ color: #233A54;
+ margin:15px 0 0 0;
+}
+
+#requirements {
+ position: relative;
+ top: 0;
+ left: 0;
+ width: 382px;
+ padding: 0 0 0 0;
+ height: 520px;
+ margin:0;
+ display: block;
+ overflow: auto;
+ background: #EBEBEB url(divbg.gif) repeat-x;
+ color: #233A54;
+ border-left:1px dashed #000000;
+ }
+
+#requirements h3 {
+ background: transparent url(requirements.gif) no-repeat;
+ width: 340px;
+ height: 29px;
+ padding: 0;
+ margin: 20px 0px 0px 15px;
+ display:block;
+ }
+
+#requirements h3 span {
+ display: none;
+ }
+
+#requirements p {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ top: 0;
+ left: 15px;
+ width: 340px;
+ font: 11px/7px Verdana, Arial, sans-serif;
+ line-height: 1.2;
+ color: #233A54;
+ margin:15px 0 0 0;
+}
+
+#footer {
+ position: absolute;
+ left: -360px;
+ top: 550px;
+ text-align: left;
+ width: 350px;
+ border-top: 1px dashed #FFF;
+ border-bottom: 1px dashed #FFF;
+ padding: 2px;
+ text-align: center;
+ }
+
+#footer a {
+ font: 9px Verdana, sans-serif;
+ font-weight: 900;
+ color: #72AAD1;
+ }
+
+/***************** Links and Subsections ********************/
+#linkList {
+ position: absolute;
+ top: 260px;
+ left: 40px;
+ width: 240px;
+ height: 66%;
+}
+
+#linkList div {
+ padding-bottom: 10px;
+ }
+
+#linkList ul {
+ margin: 0 0 0 50px;
+ list-style-type: none;
+ color: #FFFFFF;
+ border: 1px solid #FFFFFF;
+ padding: 3px;
+ }
+
+#linkList ul li {
+ background: transparent url(listbg1.jpg);
+ border: 1px solid #FFFFFF;
+ margin-bottom: 2px;
+ margin-top: 2px;
+ padding: 2px;
+ width: 176px;
+ }
+
+#linkList ul li:hover {
+ background: transparent url(listbg2.jpg);
+ border: 1px solid #FFFFFF;
+ margin-bottom: 2px;
+ margin-top: 2px;
+ padding: 2px;
+ width: 176px;
+ }
+
+#linkList ul li a:link {
+ font-weight: 900;
+ color: #FFFFFF;
+ }
+
+#linkList ul li a:visited {
+ font-weight: 900;
+ color: #FFFFFF;
+ }
+
+#linkList ul li a:hover,
+#linkList ul li a:active {
+ font-weight: 900;
+ color: #9B3F17;
+ }
+
+#linkList ul li a.c {
+ display: block;
+ margin-bottom: -1px;
+ }
+
+#linkList ul li a.c:link {
+ font-weight: 900;
+ color: #4C83AE;
+ }
+
+#linkList ul li a.c:visited {
+ font-weight: 900;
+ color: #4C83AE;
+ }
+
+#linkList ul li a.c:hover,
+#linkList ul li a.c:active {
+ font-weight: 900;
+ color: #9B3F17;
+ }
+
+#lselect h3 {
+ background: transparent url(select.gif) no-repeat;
+ width: 340px;
+ height: 40px;
+ padding:0;
+ margin: 20px 0 0 40px;
+ display: block;
+ }
+
+#larchives h3 {
+ background: transparent url(archives.gif) no-repeat;
+ width: 340px;
+ height: 40px;
+ padding: 0;
+ margin: 20px 0 0 40px;
+ }
+
+#lfavorites h3 {
+ background: transparent url(archives.gif) no-repeat;
+ }
+
+#lresources h3 {
+ background: transparent url(resources.gif) no-repeat;
+ width: 340px;
+ height: 40px;
+ padding: 0;
+ margin: 20px 0 0 40px;
+ }
+
+#lresources h3 span, #larchives h3 span, #lselect h3 span {
+ display: none;
+}
+
+
+#extraDiv1 {
+ position: relative;
+ width: 300px;
+ height: 89px;
+ margin: 0 auto;
+ left: 0;
+ top: 0;
+ background: transparent url(sub.gif) no-repeat;
+ text-align: center;
+}/* css Zen Garden submission 082 - 'Miracle Cure' by Joseph Pearson, http://www.make-believe.org */
+/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
+/* Some associated graphics and photos copyright 2004, Joseph Pearson */
+/* Added: February 15th, 2004 */
+
+/* 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. */
+
+
+
+
+/*========================================================================
+ CSS Stylesheet - Miracle Cure.
+
+ A MIRACLE CURE? This Zen Garden is based on old, turn of the century
+ swap cards for advertising health potions. Everything from hair
+ restoratives to laudanum. I got the