From 1ca72c1cb5924f2568f0513da60c06d08e3d6faa Mon Sep 17 00:00:00 2001 From: Dave Shea Date: Thu, 23 May 2013 15:08:14 -0700 Subject: [PATCH] Restoring original CSS files for 041-060 --- 041/legacy.css | 214 +++++++++++++++++++ 042/legacy.css | 496 +++++++++++++++++++++++++++++++++++++++++++ 043/legacy.css | 557 +++++++++++++++++++++++++++++++++++++++++++++++++ 044/legacy.css | 313 +++++++++++++++++++++++++++ 045/legacy.css | 252 ++++++++++++++++++++++ 046/legacy.css | 265 +++++++++++++++++++++++ 047/legacy.css | 183 ++++++++++++++++ 048/legacy.css | 226 ++++++++++++++++++++ 049/legacy.css | 249 ++++++++++++++++++++++ 050/legacy.css | 479 ++++++++++++++++++++++++++++++++++++++++++ 051/legacy.css | 444 +++++++++++++++++++++++++++++++++++++++ 052/legacy.css | 466 +++++++++++++++++++++++++++++++++++++++++ 053/legacy.css | 272 ++++++++++++++++++++++++ 054/legacy.css | 395 +++++++++++++++++++++++++++++++++++ 055/legacy.css | 247 ++++++++++++++++++++++ 056/legacy.css | 283 +++++++++++++++++++++++++ 057/legacy.css | 271 ++++++++++++++++++++++++ 058/legacy.css | 481 ++++++++++++++++++++++++++++++++++++++++++ 059/legacy.css | 322 ++++++++++++++++++++++++++++ 060/legacy.css | 252 ++++++++++++++++++++++ 20 files changed, 6667 insertions(+) create mode 100644 041/legacy.css create mode 100644 042/legacy.css create mode 100644 043/legacy.css create mode 100644 044/legacy.css create mode 100644 045/legacy.css create mode 100755 046/legacy.css create mode 100644 047/legacy.css create mode 100644 048/legacy.css create mode 100644 049/legacy.css create mode 100644 050/legacy.css create mode 100644 051/legacy.css create mode 100644 052/legacy.css create mode 100644 053/legacy.css create mode 100644 054/legacy.css create mode 100644 055/legacy.css create mode 100644 056/legacy.css create mode 100644 057/legacy.css create mode 100644 058/legacy.css create mode 100644 059/legacy.css create mode 100644 060/legacy.css diff --git a/041/legacy.css b/041/legacy.css new file mode 100644 index 00000000..7757ad47 --- /dev/null +++ b/041/legacy.css @@ -0,0 +1,214 @@ +/* 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; +} \ No newline at end of file diff --git a/042/legacy.css b/042/legacy.css new file mode 100644 index 00000000..ce0c1d40 --- /dev/null +++ b/042/legacy.css @@ -0,0 +1,496 @@ +/* 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 ]---------------------------- */ + diff --git a/043/legacy.css b/043/legacy.css new file mode 100644 index 00000000..af34403b --- /dev/null +++ b/043/legacy.css @@ -0,0 +1,557 @@ +/* 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; } \ No newline at end of file diff --git a/044/legacy.css b/044/legacy.css new file mode 100644 index 00000000..f83f613b --- /dev/null +++ b/044/legacy.css @@ -0,0 +1,313 @@ +/* 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 */ +* 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 */ +* 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 */ +* 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; } */ \ No newline at end of file diff --git a/045/legacy.css b/045/legacy.css new file mode 100644 index 00000000..d0c2cf26 --- /dev/null +++ b/045/legacy.css @@ -0,0 +1,252 @@ +/* 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; +} diff --git a/046/legacy.css b/046/legacy.css new file mode 100755 index 00000000..4f926162 --- /dev/null +++ b/046/legacy.css @@ -0,0 +1,265 @@ +/* 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; +} + + + diff --git a/047/legacy.css b/047/legacy.css new file mode 100644 index 00000000..a6a3c5fb --- /dev/null +++ b/047/legacy.css @@ -0,0 +1,183 @@ +/* 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; +} diff --git a/048/legacy.css b/048/legacy.css new file mode 100644 index 00000000..d191871e --- /dev/null +++ b/048/legacy.css @@ -0,0 +1,226 @@ +/* css Zen Garden submission 048 - 'HoriZental' by Clément 'fastclemmy' Hardouin, http://www.fastclemmy.com/ */ +/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */ +/* All associated graphics copyright 2003, Clément Hardouin */ +/* Added: October 18th, 2003 */ + + +/* IMPORTANT */ +/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */ +/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */ +/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */ + + +body { +background-image:url("fond_body.gif"); +background-repeat:repeat-x; +background-position:top left; +background-color:#fff; +color:#666; +font-family:Trebuchet MS,Verdana,Arial,Helvetica,sans-serif; +margin:0; +padding:0; +height:550px; +width:4000px; +} + +html > body { +border-bottom:1px solid black; +} + +h1, h2, h3, h4 { +margin:0; +padding:0; +} + +div#intro { +background-image:url("header.jpg"); +background-repeat:no-repeat; +background-position:left top; +height:550px; +} + +div#intro p { +width:350px; +} + +h1 span, h3 span, #extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 { +display:none; +} + +#explanation h3 span, #preamble h3 span, #participation h3 span, #benefits h3 span, #requirements h3 span { +display:block; +font-family:Century Gothic, AvantGarde, Verdana, Arial, sans-serif; +font-weight:normal; +font-size:1.5em; +color:#c9380b; +} + +h2 { +color:#ccc; +padding-top:325px; +font-size:0.8em; +font-weight:normal; +letter-spacing:0.4em; +padding-left:3em; +} + +div#quickSummary { +margin-left:0.8em; +} + +div#quickSummary a, div#footer a, p a { +color:#c9380b; +text-decoration:none; +font-weight:bold; +} + +div#quickSummary a:hover, p a:hover, div#footer a:hover { +text-decoration:underline; +} + +div#linkList2, div#lresources { +background-image:url("fond_bande_milieu.gif"); +background-repeat:repeat-y; +width:255px; +height:550px; +position:absolute; +top:0px; +left:375px; +} + +div#lresources { +background-image:url("fond_bande_droite.gif"); +width:298px; +left:3200px; +} + +h3.select { +background-image:url("selectadesign.gif"); +background-repeat:no-repeat; +width:255px; +height:145px; +} + +h3.resources { +background-image:url("browseresources.gif"); +background-repeat:no-repeat; +width:298px; +height:138px; +} + +div#lselect ul, div#larchives ul, div#lresources ul { +color:#000; +font-size:0.9em; +margin:0px; +padding:0px; +width:90%; +padding-left:35px; +} + +div#lresources ul { +padding-left:50px; +} + +div#lselect li, div#larchives li, div#lresources li { +background-image: url("puce_blanche.gif"); +background-repeat: no-repeat; +background-position: left center; +list-style-type: none; +margin: 0px 0px 0px 0px; +padding: 0px 0px 0px 15px; +width: 90%; +font-size:0.8em; +} + +div#lselect a, div#larchives a, div#lresources a { +color:#666; +text-decoration:none; +font-weight:bold; +} + +div#lselect a.c { +color:#fff; +font-weight:normal; +} + +div#lselect a:hover, div#larchives a:hover, div#lresources a:hover { +text-decoration:underline; +} + +h3.archives { +margin-top:70px; +background-image:url("viewarchives.gif"); +background-repeat:no-repeat; +width:255px; +height:100px; +} + +div#preamble, div#explanation, div#participation, div#benefits, div#requirements { +position:absolute; +background-repeat:no-repeat; +top:0px; +font-size:75%; +height:550px; +} + +div#preamble { +left:628px; +background-image:url("theroad.jpg"); +width:379px; +} + +div#preamble h3, div#requirements h3, div#participation h3 { +padding-top:280px; +} + +div#preamble p, div#requirements p, div#participation p, div#explanation p, div#benefits p, div#preamble h3, div#requirements h3, div#participation h3, div#explanation h3, div#benefits h3, div#requirements p, div#requirements h3 { +padding-left:8px; +padding-right:8px; +text-align:justify; +} + +div#explanation { +left:1007px; +background-image:url("sowhat.jpg"); +width:398px; +} + +div#explanation h3, div#benefits h3 { +padding-top:15px; +} + +div#participation { +left:1405px; +background-image:url("participation.jpg"); +width:656px; +} + +div#benefits { +left:2061px; +background-image:url("benefits.jpg"); +width:390px; +} + +div#requirements { +left:2451px; +width:1050px; +} + +div#footer { +position:absolute; +top:470px; +left:0.8em; +} + +div#footer a:before { +content: url("puce_rouge.gif"); +} + +p { +font-size:0.9em; +} + +#requirements .p5 { +margin-top:15px; +color:#ccc; +} \ No newline at end of file diff --git a/049/legacy.css b/049/legacy.css new file mode 100644 index 00000000..179a53a2 --- /dev/null +++ b/049/legacy.css @@ -0,0 +1,249 @@ +/* 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; + } + diff --git a/050/legacy.css b/050/legacy.css new file mode 100644 index 00000000..40b26452 --- /dev/null +++ b/050/legacy.css @@ -0,0 +1,479 @@ +/* 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; +} + + + + + diff --git a/051/legacy.css b/051/legacy.css new file mode 100644 index 00000000..6273210a --- /dev/null +++ b/051/legacy.css @@ -0,0 +1,444 @@ +/* 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; +} +/* */ \ No newline at end of file diff --git a/052/legacy.css b/052/legacy.css new file mode 100644 index 00000000..5de684bd --- /dev/null +++ b/052/legacy.css @@ -0,0 +1,466 @@ +/* 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 */ diff --git a/053/legacy.css b/053/legacy.css new file mode 100644 index 00000000..20ae83f7 --- /dev/null +++ b/053/legacy.css @@ -0,0 +1,272 @@ +/* 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; +} \ No newline at end of file diff --git a/054/legacy.css b/054/legacy.css new file mode 100644 index 00000000..ec208ee5 --- /dev/null +++ b/054/legacy.css @@ -0,0 +1,395 @@ +/* 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; + } diff --git a/055/legacy.css b/055/legacy.css new file mode 100644 index 00000000..e40b4bb1 --- /dev/null +++ b/055/legacy.css @@ -0,0 +1,247 @@ +/* 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; +} diff --git a/056/legacy.css b/056/legacy.css new file mode 100644 index 00000000..67f40aae --- /dev/null +++ b/056/legacy.css @@ -0,0 +1,283 @@ +/* --------- 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! */ + diff --git a/057/legacy.css b/057/legacy.css new file mode 100644 index 00000000..5d926bbc --- /dev/null +++ b/057/legacy.css @@ -0,0 +1,271 @@ +/* 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; } diff --git a/058/legacy.css b/058/legacy.css new file mode 100644 index 00000000..cf7ab87e --- /dev/null +++ b/058/legacy.css @@ -0,0 +1,481 @@ +/* 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; + } diff --git a/059/legacy.css b/059/legacy.css new file mode 100644 index 00000000..4fdcd546 --- /dev/null +++ b/059/legacy.css @@ -0,0 +1,322 @@ +/* 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%; +} \ No newline at end of file diff --git a/060/legacy.css b/060/legacy.css new file mode 100644 index 00000000..f92cd6ca --- /dev/null +++ b/060/legacy.css @@ -0,0 +1,252 @@ +/* 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; + } + + + \ No newline at end of file