libcss-w3d
Version:
CSS parser and selection library with w3d properties.
2,356 lines (2,104 loc) • 1.18 MB
CSS
/* css Zen Garden default style - 'Tranquille' by Dave Shea - http://www.mezzoblue.com/ */
/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
/* All associated graphics copyright 2003, Dave Shea */
/* Added: May 7th, 2003 */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the
designer's written permission. However, feel free to study the CSS and use
techniques you learn from it elsewhere. */
/* The Zen Garden default was the first I put together, and almost didn't make the cut. I briefly flirted with using
'Salmon Cream Cheese' as the main style for the Garden, but switched back to this one before launch.
All graphics in this design were illustrated by me in Photoshop. Google Image Search provided inspiration for
some of the elements. I did a bit of research on Kanji to come up with the characters on the top left. Anyone who
can read that will most likely tell you it makes no sense, but the best I could do was putting together the
characters for 'beginning' 'complete' and 'skill' to roughly say something like 'we're breaking fresh ground.'
It's a stretch. */
/* basic elements */
html {
margin: 0;
padding: 0;
}
body {
font: 75% georgia, sans-serif;
line-height: 1.88889;
color: #555753;
background: #fff url(/001/blossoms.jpg) no-repeat bottom right;
margin: 0;
padding: 0;
}
p {
margin-top: 0;
text-align: justify;
}
h3 {
font: italic normal 1.4em georgia, sans-serif;
letter-spacing: 1px;
margin-bottom: 0;
color: #7D775C;
}
a:link {
font-weight: bold;
text-decoration: none;
color: #B7A5DF;
}
a:visited {
font-weight: bold;
text-decoration: none;
color: #D4CDDC;
}
a:hover, a:active {
text-decoration: underline;
color: #9685BA;
}
acronym {
border-bottom: none;
}
/* specific divs */
#container {
background: url(/001/zen-bg.jpg) no-repeat top left;
padding: 0 175px 0 110px;
margin: 0;
position: relative;
}
#intro {
min-width: 470px;
width: 100%;
}
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader h1 {
background: transparent url(/001/h1.gif) no-repeat top left;
margin-top: 10px;
display: block;
width: 219px;
height: 87px;
float: left;
}
#pageHeader h1 span {
display:none
}
#pageHeader h2 {
background: transparent url(/001/h2.gif) no-repeat top left;
margin-top: 58px;
margin-bottom: 40px;
width: 200px;
height: 18px;
float: right;
}
#pageHeader h2 span {
display:none
}
#pageHeader {
padding-top: 20px;
height: 87px;
}
#quickSummary {
clear: both;
margin: 20px 20px 20px 10px;
width: 160px;
float: left;
}
#quickSummary p {
font: italic 1.1em/2.2 georgia;
text-align: center;
}
#preamble {
clear: right;
padding: 0px 10px 0 10px;
}
#supportingText {
padding-left: 10px;
margin-bottom: 40px;
}
#footer {
text-align: center;
}
#footer a:link, #footer a:visited {
margin-right: 20px;
}
#linkList {
margin-left: 600px;
position: absolute;
top: 0;
right: 0;
}
#linkList2 {
font: 10px verdana, sans-serif;
background: transparent url(/001/paper-bg.jpg) top left repeat-y;
padding: 10px;
margin-top: 150px;
width: 130px;
}
#linkList h3.select {
background: transparent url(/001/h3.gif) no-repeat top left;
margin: 10px 0 5px 0;
width: 97px;
height: 16px;
}
#linkList h3.select span {
display:none
}
#linkList h3.favorites {
background: transparent url(/001/h4.gif) no-repeat top left;
margin: 25px 0 5px 0;
width: 60px;
height: 18px;
}
#linkList h3.favorites span {
display:none
}
#linkList h3.archives {
background: transparent url(/001/h5.gif) no-repeat top left;
margin: 25px 0 5px 0;
width:57px;
height: 14px;
}
#linkList h3.archives span {
display:none
}
#linkList h3.resources {
background: transparent url(/001/h6.gif) no-repeat top left;
margin: 25px 0 5px 0;
width:63px;
height: 10px;
}
#linkList h3.resources span {
display:none
}
#linkList ul {
margin: 0;
padding: 0;
}
#linkList li {
line-height: 1.3em;
background: transparent url(/001/cr1.gif) no-repeat top center;
display: block;
padding-top: 5px;
margin-bottom: 5px;
list-style-type: none;
}
#linkList li a:link {
color: #988F5E;
}
#linkList li a:visited {
color: #B3AE94;
}
#extraDiv1 {
background: transparent url(/001/cr2.gif) top left no-repeat;
position: absolute;
top: 40px;
right: 0;
width: 148px;
height: 110px;
}
.accesskey {
text-decoration: underline;
}/* css Zen Garden submission 002 - 'Salmon Cream Cheese' by Dave Shea - http://www.mezzoblue.com/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Dave Shea */
/* Added: May 7th, 2003 */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* If you're familiar with the life cycle of salmon, you'll know that at the end of their lives they fight their way upstream to
the rivers where they were born, to spawn and then die. Growing up close to one of these so-called 'salmon runs', I
once had a class field trip to the river for the afternoon to learn about the process. The funny thing about a bunch of
dead salmon is that they stink. Quite bad. The second worst memory of that day was the smell of the fish.
The worst memory of the day was opening my lunch to find my considerate mother had packed bagels. With, as you
have guessed by now, salmon cream cheese. I rarely hear the word 'salmon' anymore without the 'cream cheese'
playing in my head as an afterthought. Hence, this style is Salmon Cream Cheese. */
/* basic elements */
body {
font: 11px/14px verdana, sans-serif;
color: #AD7C77;
background: #FFD7C4 url(/002/bg1.gif) top left repeat-x;
padding: 65px 0px 0px 224px;
margin: 0px;
}
p {
font: 11px/14px verdana, sans-serif;
text-align: justify;
margin-top: 0px;
}
h3 {
font: bold 16px 'arial narrow', sans-serif;
text-transform: lowercase;
margin-bottom: 0px;
}
acronym {
border-bottom: dotted 1px #B27F66;
}
a:link {
font-weight: bold;
text-decoration: none;
color: #E98376;
}
a:visited {
font-weight: bold;
text-decoration: none;
color: #AD7C77;
}
a:active, a:hover {
text-decoration: underline;
}
/* specific divs */
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader {
position: absolute;
top: 0px;
left: 0px;
width: 770px;
}
#pageHeader h1 {
background: transparent url(/002/h1.gif) no-repeat top left;
width: 258px;
height: 61px;
float: left;
margin: 1px 0px 0px 3px;
}
#pageHeader h1 span {
display: none;
}
#pageHeader h2 {
background: transparent url(/002/h2.gif) no-repeat top left;
width: 206px;
height: 28px;
float: right;
margin: 22px 15px 0px 0px;
}
#pageHeader h2 span {
display: none;
}
/* sets up our floating area on the right. Kind of a hack, since there's a physical separation between
two divs, filled in by tricky margins and compensated for with tricky padding, but it seems to hold up okay. */
#intro {
background: #FFC5A9 url(/002/bg2.gif) top left repeat-x;
}
#preamble {
padding: 0px 40px 0px 40px;
}
#preamble .p3 {
margin-bottom: 0px;
}
#supportingText {
background-color: #FFC5A9;
margin: 0px;
padding: 0px 40px 0px 40px;
}
#supportingText #explanation h3 {
margin-top: 0px;
padding-top: 20px;
}
#quickSummary {
padding-top: 47px;
}
#quickSummary .p1 {
width: 430px;
height: 195px;
background: transparent url(/002/splash.jpg) top left no-repeat;
padding: 182px 0px 0px 10px;
position: absolute;
top: 93px;
left: 244px;
}
#quickSummary .p1 span {
display: none;
}
#quickSummary .p2 {
font-size: 9px;
line-height: 22px;
text-align: left;
color: #B27F66;
background-color: #FFD7C4;
display: block;
border: solid 1px #FFBEA1;
padding: 40px 15px 0px 419px;
margin: 0px 10px 0px 40px;
height: 140px;
}
#quickSummary .p2 a:link {
color: #B27F66;
}
#footer {
text-align: right;
border-top: solid 1px #FFCDB5;
padding-top: 10px;
}
#footer a:link, #footer a:visited {
padding: 2px 6px 2px 6px;
}
#footer a:hover {
background-color: #FFD7BF;
text-decoration: none;
}
#linkList {
background: transparent url(/002/cr1.gif) bottom right no-repeat;
padding-bottom: 76px;
position: absolute;
top: 65px;
left: 0px;
}
#linkList2 {
padding: 40px 0px 10px 0px;
width: 200px;
}
#linkList2 h3 span {
display: none;
}
#linkList2 h3.select {
background: transparent url(/002/h3.gif) no-repeat top left;
width: 195px;
height: 21px;
}
#linkList2 h3.favorites{
background: transparent url(/002/h4.gif) no-repeat top left;
width: 195px;
height: 21px;
}
#linkList2 h3.archives{
background: transparent url(/002/h5.gif) no-repeat top left;
width: 195px;
height: 21px;
}
#linkList2 h3.resources{
background: transparent url(/002/h6.gif) no-repeat top left;
width: 195px;
height: 21px;
}
#linkList .iL, #linkList li {
font-size: 10px;
line-height: 2.5ex;
display: block;
padding: 2px 0px 0px 25px;
margin-bottom: 5px;
}
#linkList #lresources li {
margin-bottom: 0px;
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
list-style-type: none;
}
/* css Zen Garden submission 003 - 'Stormweather' by Dave Shea - http://www.mezzoblue.com/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Dave Shea */
/* Added: May 7th, 2003 */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* Credit to Phillipe Wittenbergh at http://www.l-c-n.com/ for Mac testing */
/* The photos in this design come from my digital library. All were taken in Vancouver, BC. The car is on the
Granville St. Bridge, the leaves are West 6th Ave, and the snow/tree is West 10th Ave. Guess which
part of town I live in...
I'm still rather fond of this design. I'm glad Phillipe was able to iron out the various CSS bugs */
/* basic elements */
body {
font: 11px/15px georgia, serif;
text-align: center;
color: #fff;
background: #748A9B url(bg2.gif) 0 0 repeat-y;
margin: 0px;
}
p {
/*font: 11px/15px georgia, serif;*/
text-align: justify;
margin-top: 0;
}
h3 {
font: bold 14px georgia, serif;
text-transform: lowercase;
margin-bottom: 0;
}
acronym {
border-bottom: dotted 1px #fff;
}
a:link {
font-weight: bold;
text-decoration: underline;
color: #A7D3F6;
}
a:visited {
font-weight: bold;
text-decoration: underline;
color: #D1E9FC;
}
a:active, a:hover {
text-decoration: underline;
color: #fff;
}
/* specific divs */
#container {
background: #849AA9 url(bg1.gif) top left repeat-y;
text-align: left;
width: 750px; margin: 0px auto;
position: relative;
}
#supportingText {
/*position: relative; top: -120px;*/
padding: 0px 40px 0px 0;
/*clear:right;*/
float:right;
width:430px;
}
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader h1 {
background: transparent url(h1.jpg) no-repeat top left;
width: 750px;
height: 152px;
margin: 0px;
}
#pageHeader h1 span {
display: none;
}
#pageHeader h2 span {
display: none;
}
#quickSummary {
width: 685px;
margin: 0px auto;
position: relative;
top: -50px;
}
html>body #quickSummary {
margin-top:-50px;
top: 0;
}
#quickSummary .p1 {
font-size: 1px;
color: white;
background: transparent url(panel1-2.jpg) no-repeat top left;
width: 449px;
padding: 10px 0px 0px 5px; float: left;
height: 268px;
voice-family: "\"}\"";
voice-family:inherit;
height: 258px;
}
#quickSummary .p1 span {
display: none;
}
#quickSummary .p2 {
color: #7593A7;
background: transparent url(panel3.jpg) no-repeat 0 0;
padding: 90px 45px 0px 45px;
float: right;
width: 214px;
height: 338px;
voice-family: "\"}\"";
voice-family:inherit;
width: 124px;
height: 178px;
}
#quickSummary .p2 span {
letter-spacing: -1px;
line-height: 26px;
display: block;
}
#quickSummary .p2 a:link, #quickSummary .p2 a:visited {
color: #7593A7;
}
#quickSummary .p2 a:hover {
color: #85ABC5;
}
#preamble {
/*position: relative; top: -120px; */
padding: 0px 0px 70px 33px;
margin: 0px 0 20px 0px;
width: 210px;
float: left;
background: transparent url(tag.gif) 50% 100% no-repeat;
}
#preamble h2 {
font: bold 14px georgia, serif;
margin-top: 0px;
padding: 0px;
}
#preamble p {
font: italic 12px/20px georgia, serif;
}
#footer {
text-align: right;
clear: both;
}
#footer a {
font-weight: normal;
text-decoration: none;
margin-right: 10px;
border: solid 1px #859BAA;
padding: 6px;
}
#footer a:hover {
color: #7E868D;
background-color: #fff;
border-right: solid 1px #6F818D;
border-bottom: solid 1px #6F818D;
}
#lselect {
position: absolute;
top: 15px;
left: 0px;
padding-left: 350px;
margin: 0px auto;
width: 730px;
voice-family: "\"}\"";
voice-family:inherit;
width: 380px;
}
#linkList h3 {
display: inline;
margin-right: 5px;
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
font-size: 10px;
margin-right: 5px;
list-style-type: none;
display: inline;
}
#linkList li a {
font-weight: normal;
}
#lselect h3 {
font: bold 11px georgia;
letter-spacing: -1px;
}
#lselect li {
font: 11px/12px georgia;
letter-spacing: -1px;
color: #758C9B;
}
#lselect li a:link, #lselect li a:visited {
font-weight: normal;
color: #fff;
text-decoration: none;
}
#lselect li a:hover {
color: #D1E9FC;
text-decoration: underline;
}
#lresources, #larchives, #lfavorites {
padding: 0px 40px 0px 266px;
clear: both;
/*position: relative; top: -20px;*/
}/* css Zen Garden submission 004 - 'arch4.20' by Dave Shea - http://www.mezzoblue.com/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Dave Shea */
/* Added: May 7th, 2003 */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* The photo was taken inside the Vancouver Public Library. It has been mentioned the colours have a vaguely
MetaFilter-like feel. I suppose they do... Unintentional. */
/* basic elements */
body {
font: 11px tahoma, verdana, sans-serif;
color: #fff;
background: #005D87 url(bg1.gif) top left repeat-x;
margin: 0px;
}
p {
font: 11px/14px verdana, sans-serif;
text-align: justify;
margin-top: 0px;
}
h3 {
font: bold 13px verdana, sans-serif;
margin-bottom: 0px;
}
acronym {
border-bottom: dotted 1px #fff;
}
a:link {
font-weight: bold;
text-decoration: none;
color: #8AF44F;
}
a:visited {
font-weight: bold;
text-decoration: none;
color: #55AB26;
}
a:active, a:hover {
color: #8AF44F;
text-decoration: underline;
}
/* specific divs */
#preamble {
padding: 0px 180px 0px 25px;
}
#supportingText {
padding: 0px 180px 0px 25px;
}
#pageHeader {
width: 100%;
height: 217px;
background: #fff url(cr1.jpg) top left no-repeat;
margin-top: 47px;
}
#pageHeader h1 {
background: transparent url(h1.gif) no-repeat top left;
width: 296px;
height: 46px;
position: absolute;
top: 185px;
right: 10px;
}
#pageHeader h1 span {
display: none;
}
#pageHeader h2 {
background: transparent url(h2.gif) no-repeat top left;
width: 229px;
height: 16px;
position: absolute;
top: 230px;
right: 12px;
}
#pageHeader h2 span {
display: none;
}
#quickSummary .p1 {
font: 11px tahoma, verdana, sans-serif;
line-height: 18px;
color: #7799AC;
background-color: #fff;
padding: 2px;
position: absolute;
top: 65px;
right: 10px;
width: 150px;
}
#quickSummary .p2 {
font: 10px tahoma, verdana, sans-serif;
color: #7799AC;
position: absolute;
top: 32px;
right: 5px;
}
#quickSummary .p2 a:link, #quickSummary .p2 a:visited {
color: #7799AC;
text-decoration: underline;
}
#quickSummary .p2 a:active, #quickSummary .p2 a:hover {
color: #8AF44F;
}
#linkList{
font: 11px tahoma, verdana, sans-serif;
line-height: 18px;
color: #7799AC;
position: absolute;
top: 285px;
right: 0px;
width: 150px;
}
#linkList2 h3 span {
display: none;
}
#linkList2 h3.select {
background: transparent url(h3.gif) no-repeat top left;
width: 157px;
height: 14px;
}
#linkList2 h3.favorites{
background: transparent url(h5.gif) no-repeat top left;
width: 157px;
height: 14px;
}
#linkList2 h3.archives{
background: transparent url(h6.gif) no-repeat top left;
width: 157px;
height: 14px;
}
#linkList2 h3.resources{
background: transparent url(h4.gif) no-repeat top left;
width: 157px;
height: 14px;
}
#linkList li {
font-size: 10px;
line-height: 2.5ex;
display: block;
padding: 2px 10px 0px 0px;
margin-bottom: 5px;
}
#linkList #lresources li {
margin-bottom: 0px;
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
list-style-type: none;
}
#footer {
text-align: right; border-top: solid 1px #1E5E82;
padding-top: 10px;
}
#footer a:link, #footer a:visited {
padding: 2px 6px 2px 6px;
}
#footer a:hover {
background: transparent url(bg2.gif) top left repeat-x;
text-decoration: none;
}/* css Zen Garden submission 005 - 'Blood Lust' by Dave Shea - http://www.mezzoblue.com/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Dave Shea */
/* Added: May 7th, 2003 */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* love it or hate it. This one is one of my favourites because I don't generally design this way. It reaches into the past
for a vaguely Futurist style, complete with duotone for that screenprint feel, combined with modern GIF
patterned-dithering to really mess with tradition.
You may find it challenging, silly, visually stimulating, or a mess. I didn't do it for you, I did it for me. */
/* basic elements */
body {
font: 12px/13px courier, monospace;
color: #000;
background-color: #fff;
margin: 0px;
}
p {
font: 12px/13px courier, monospace;
text-align: justify;
}
h3 {
font:bold 14px courier, monospace;
letter-spacing: 1px;
margin-bottom: 0px;
color: #000;
}
a:link {
font-weight: bold;
text-decoration: underline;
color: #FF4F3E;
}
a:visited {
font-weight: bold;
text-decoration: underline;
color: #FF4F3E;
}
a:hover, a:active {
text-decoration: underline;
color: #000;
}
acronym {
border-bottom: none;
}
/* specific divs */
#container {
background: #fff url(bloodlust.gif) no-repeat top left;
margin: 50px 0px 0px 0px;
padding: 150px 0px 0px 200px;
}
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader h1 {
background: transparent url(h1.gif) no-repeat top left;
margin-top: 10px;
width: 461px;
height: 116px;
position: absolute;
top: 20px;
left: 305px;
}
#pageHeader h1 span {
display: none;
}
#pageHeader h2 {
background: transparent url(h2.gif) no-repeat top left;
width: 253px;
height: 34px;
position: absolute;
top: 150px;
left: 216px;
}
#pageHeader h2 span {
display: none;
}
#quickSummary .p1 {
font: 400 18px/16px 'arial black', sans-serif;
text-align: right;
width: 340px;
float: left;
margin: 40px 20px 20px 0px;
}
#quickSummary .p2 {
font: 9px verdana, sans-serif;
text-align: left;
line-height: 24px;
width: 295px;
position: absolute;
top: 20px;
left: 25px;
}
#preamble {
width: 170px;
float: right;
margin-top: 50px;
clear: left;
position: relative;
top: -270px;
}
#preamble h3 {
font: bold 12pt/10pt 'trebuchet ms', sans-serif;
text-align: right;
}
#preamble p {
font: bold 10pt/11pt arial, sans-serif;
text-align: right;
}
#supportingText {
clear: left;
}
#explanation h3 {
font: bold 18px courier, monospace;
}
#explanation .p1 {
font: 18px courier, monospace;
line-height: 5ex;
}
#explanation .p2 {
font: 11px/16px courier, monospace;
width: 220px;
float: left;
margin-right: 10px;
}
#explanation .p3 {
font: 14px/14px courier, monospace;
margin-top: 30px;
}
#participation h3 {
background: transparent url(h3.gif) no-repeat top left;
width: 174px;
height: 66px;
margin: 0px;
float: left;
}
#participation h3 span {
display: none;
}
#participation .p1:first-line {
font: 16px 'arial black', sans-serif;
}
#participation .p2 {
line-height: 16px;
text-align: right;
float: left;
width: 200px;
margin: 0px 5px 15px 0px;
}
#participation .p3 {
font-family: arial, sans-serif;
}
#benefits h3 {
background: transparent url(h4.gif) no-repeat top left;
width: 107px;
height: 26px;
margin: 0px;
float: left;
}
#benefits h3 span {
display: none;
}
#requirements h3 {
font: bold 18px 'arial black', sans-serif;
clear: left;
float: right;
}
#requirements .p1 {
font: bold 11px/16px trebuchet ms, sans-serif;
float: left;
width: 300px;
margin-right: 10px;
}
#requirements .p3 {
font: 12px/11px arial, sans-serif;
}
#linkList {
position: absolute;
top: 0px;
left: 20px;
}
#linkList2 {
font: 12px courier, monospace;
padding: 10px;
margin-top: 115px;
width: 130px;
}
#linkList li {
line-height: 2.5ex;
display: block;
padding-top: 5px;
margin-bottom: 5px;
list-style-type: none;
}
#linkList ul {
margin: 0px;
padding: 0px;
}/* css Zen Garden submission 006 - 'Wicked Grove' by D. Keith Robinson, http://www.7nights.com/asterisk/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, D. Keith Robinson */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* basic elements */
body {
font: 10pt/14pt "Trebuchet MS", sans-serif;
color: #000033;
background: #69f;
margin: 0px;
}
p {
font: 10pt/16pt "Trebuchet MS", sans-serif;
margin-top: 0px;
text-align: justify;
}
h3 {
font: bold normal 12pt "Trebuchet MS", sans-serif;
letter-spacing: 3px;
margin-bottom: 2px;
color: #333333;
text-align: left;
}
a:link {
font-weight: bold;
text-decoration: none;
color: #FF6600;
}
a:visited {
font-weight: bold;
text-decoration: none;
color: #CC0000;
}
a:hover, a:active {
text-decoration: underline;
color: #FF6600;
}
/* specific divs */
#container {
background: #9cf url(trees.jpg) no-repeat left top;
padding: 200px 0px 0px 0px;
margin: 0px auto;
width:800px;
border-left: 2px dashed #fff;
border-right: 2px dashed #fff;
}
#pageHeader {
margin-bottom: 10px;
}
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader h1 {
background: transparent;
margin-top: -180px;
width: 500px;
height: 87px;
float: left;
color:#fff;
}
#pageHeader h1 span {
display:none;
}
#pageHeader h2 {
background: transparent url(tag.gif) no-repeat top left;
width: 300px;
margin-top:-60px;
margin-left:-190px;
height: 100px;
float: right;
}
#pageHeader h2 span {
display:none;
}
#quickSummary {
width: 130px;
float: left;
padding:5px;
margin-right:15px;
background:#0099FF;
}
#quickSummary p {
font: bold 8pt/12pt verdana, sans-serif;
text-align:right;
color:#fff;
}
#quickSummary a:link {
font-weight: bold;
text-decoration: none;
color: #003;
}
#quickSummary a:visited {
font-weight: bold;
text-decoration: none;
color: #006;
}
#quickSummary a:hover, #quickSummary a:active {
text-decoration: underline;
color: #FF6600;
}
#preamble, #supporting text, #explanation, #participation, #benefits, #requirements {
padding: 0px 170px 0px 30px;
}
#footer {
text-align: center;
}
#footer a:link, #footer a:visited {
margin-right: 20px;
}
#linkList {
background: transparent url(menu.gif) top left no-repeat;
position: absolute;
top: 0px;
padding: 15px;
margin-top: 200px;
margin-left: 650px;
width: 130px;
}
#linkList2 {
font: 10px verdana, sans-serif;
padding-top:35px;
}
#linkList h3.select {
background: transparent url(select.gif) top left no-repeat;
width: 130px;
height: 25px;
margin-left:-8px;
}
#linkList h3.select span {
display:none
}
#linkList h3.favorites {
background: transparent url(favorites.gif) top left no-repeat;
width: 130px;
height: 25px;
margin-left:-8px;
}
#linkList h3.favorites span {
display:none
}
#linkList h3.archives {
background: transparent url(archives.gif) top left no-repeat;
width: 130px;
height: 25px;
margin-left:-8px;
}
#linkList h3.archives span {
display:none
}
#linkList h3.resources {
background: transparent url(resources.gif) top left no-repeat;
width: 130px;
height: 25px;
margin-left:-8px;
}
#linkList h3.resources span {
display:none
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
line-height: 2.5ex;
background: transparent;
display: block;
padding-top: 5px;
margin-bottom: 5px;
list-style-type: none;
}
#linkList li a:link {
color: #FF3300;
}
#linkList li a:visited {
color: #FF0000;
}
#extraDiv1 {
background: transparent;
position: absolute;
top: 40px;
right: 0px;
width: 148px;
height: 110px;
}
/* css Zen Garden submission 007 - 'deep thought' by Jason Estes, http://www.bewb.org/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Jason Estes */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* basic elements */
body#css-zen-garden {
background-color:#424242;
font-size:75%;
font-family:arial, verdana, sans-serif;
margin:0;
padding:0;
color:#fff;
background-image:url(background.jpg);
background-repeat:no-repeat;
background-position:150px 50px;
}
a:link {
color:#FF9638;
background-color:transparent;
}
a:visited {
color:#FF9638;
background-color:transparent;
}
a:hover, a:active {
color:#FF9638;
background-color:transparent;
}
/* specific divs */
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader h1 {
margin:10px 15px;
background-image:url(logo.gif);
height:83px;
background-color:transparent;
width:480px;
background-repeat:no-repeat;
background-position:top right;
color:#000;
}
#pageHeader h1 span {
display:none
}
#pageHeader h2 {
display:none;
}
#pageHeader h2 span {
display:none;
}
#quickSummary {
display:block;
}
#quickSummary .p1 {
display:none;
}
#quickSummary .p2 {
position:absolute;
top:0px;
left:300px;
padding:0;margin:0;
}
#preamble {
border-top:1px solid #fff;
background-image:url(halfscreen-gray.gif);
width:250px;
margin-left:30px;
position:absolute;
top:18px;
right:10px;
}
#preamble p{
margin:10px;
}
#preamble h3{
font-style:oblique;
margin:10px;
}
#supportingText {
margin:350px auto 0 auto;
width:90%;
}
#supportingText div {
/*background-image:url(halfscreen-gray.gif);*/
border-top:1px solid #fff;
clear:both;
}
#supportingText h3 span{
display:none;
}
#supportingText p {
padding:5px 10px;
line-height:150%;
}
#explanation h3{
Float:left;
background-image:url(about.gif);
width:46px;
height:234px;
padding:0;
margin:0 10px 0px 0px;
border-right:1px solid white;
}
#explanation p{
margin:0px 0px 0px 43px;
}
#supportingText div#explanation {
margin:20px 10px 0 200px;
background:url(about_background.gif) no-repeat 100% 100%;
min-height:234px;
height:234px;
clear:none;
}
#supportingText #explanation[id] {
height:auto;
}
#participation h3{
Float:right;
background-image:url(participation.gif);
width:46px;
height:234px;
padding:0;
margin:0 0px 0px 10px;
border-left:1px solid white;
}
#supportingText #participation {
margin:20px 200px 0 10px;
min-height:234px;
height:234px;
background:url(participation_back.gif) no-repeat 0 100%;
}
#participation p{
margin:0px 43px 0px 0px;
}
#supportingText #participation[id] {
height:auto;
}
#benefits h3{
Float:left;
background-image:url(benefits.gif);
width:46px;
height:133px;
padding:0;
margin:0 10px 0px 0px;
border-right:1px solid white;
}
#benefits p{
margin:0px 0px 0px 43px;
}
#supportingText #benefits {
margin:20px 10px 0 200px;
min-height:133px;
height:133px;
background:url(benefits_back.gif) no-repeat 100% 100%;
}
#supportingText #benefits[id] {
height:auto;
}
#requirements h3{
Float:right;
background-image:url(Requirements.gif);
width:46px;
height:234px;
padding:0;
margin:0 0px 0px 10px;
border-left:1px solid white;
}
#requirements p{
margin:0px 43px 0px 0px;
}
#supportingText #requirements {
margin:20px 200px 30px 10px;
min-height:234px;
height:234px ;
background:url(requirements_back.gif) no-repeat 0 100%;
}
#supportingText #requirements[id] {
height:auto;
}
#supportingText #footer {
text-align:center;
padding-top:3px;
}
#footer a:link, #footer a:visited {
font-weight:bold;
text-decoration:none;
}
#linkList {
position:absolute;
top:98px;
left:30px;
width:198px;
}
#linkList h3.select {
height:53px;
background-image:url(select.gif);
margin:0px;
padding:0px;
}
#linkList h3.select span {
display:none
}
#linkList h3.favorites {
height:53px;
background-image:url(favorites.gif);
margin:0px;
padding:0px;
}
#linkList h3.favorites span {
display:none
}
#linkList h3.archives {
height:53px;
background-image:url(archives.gif);
margin:0px;
padding:0px;
}
#linkList h3.archives span {
display:none
}
#linkList h3.resources {
height:53px;
background-image:url(resources.gif);
margin:0px;
padding:0px;
}
#linkList h3.resources span {
display:none
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
display:block;
background-image:url(halfscreen-gray.gif);
padding:3px;
margin:1px 0;
list-style-type: none;
}
#linkList li a:link, #linkList li a:visited {
color:#fff;
background-color:transparent;
}
#extraDiv1 {
clear:both;
}
acronym {
color:#FF9638;
background-color:transparent;
border:0;
cursor:help;
}/* css Zen Garden submission 008 - 'RPM' by Bruno Cunha, http://www.kaosboy.net/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* Main image from http://www.karborn.com/FinalV6Old/Series/RPM/RPMImages.htm */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
body {
background-image:url(bg.jpg);
background-color:#fff;
font-family:arial, sans serif;
font-size:11px;
line-height:15px;
color:#fff;
margin:0px;
}
#container {
margin-left:0px;
margin-top:0px;
padding:0px;
width:684px;
z-index:1;
}
#intro {
width:275px;
position:absolute;
left:88px;
top:902px;
z-index:2;
}
#supportingText {
width:450px;
position:absolute;
left:411px;
top:535px;
z-index:2;
}
#explanation, #participation, #requirements, #benefits, #footer, #quickSummary, #preamble, #lselect, #lfavorites, #lresources, #larchives {
padding:7px;
margin:5px;
border-left:1px solid #aaa;
border-top:1px solid #aaa;
border-right:1px solid #333;
border-bottom:1px solid #333;
background-image:url(transparent.gif);
}
#linkList2 {
width:275px;
position:absolute;
left:88px;
top:1244px;
z-index:2;
}
#extraDiv1 {
background-image:url(tunami2.jpg);
position:absolute;
left:0px;
top:0px;
width:684px;
height:1515px;
z-index:1;
}
#pageHeader {
display:none;
}
h3 {
font-family:arial, sans serif;
color:#fff;
font-size:11px;
font-weight:bold;
margin-top:3px;
margin-bottom:0px;
}
p {
margin:6px;
}
a {
color:#e2e2e2;
text-decoration:underline;
}
a:link {
color:#e2e2e2;
text-decoration:underline;
}
a:hover {
color:#fff;
font-weight:bold;
text-decoration:underline;
}
a:visited {
color:#e2e2e2;
text-decoration:underline;
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
list-style-type: none;
display: inline;
}
/* css Zen Garden submission 009 - 'Dead or Alive' by Michael Pick, http://www.mikepick.com/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Michael Pick */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/* basic elements */
body {
color: #000;
background: #fff url(body-bg.png);
margin: 0px auto;
}
p {
font: 12px/15px georgia, serif;
text-align: justify;
margin-top: 0;
}
a:link {
font-weight: bold;
text-decoration: none;
color: #000;
}
a:visited {
font-weight: bold;
text-decoration: none;
color: #333;
}
a:hover, a:active {
text-decoration: underline;
}
/* specific divs */
#container {
background: url(frill-bg.png) repeat-x;
border-right: 1px solid #333;
width: 800px;
margin: 0px;
}
#intro {
min-width: 470px;
}
#pageHeader {
width: 280px;
float: left;
margin-top: 40px;
}
#pageHeader h1 {
background: transparent url(pageheader-bg.png) no-repeat;
margin-left: 40px;
width: 240px;
height: 220px;
}
#pageHeader h1 span {
display:none
}
#pageHeader h2 span {
display:none;
}
#quickSummary {
clear:both;
width: 280px;
float: left;
margin-bottom: 20px;
}
#quickSummary p {
font-family: georgia, times, serif;
font-size: 10px;
text-transform: uppercase;
text-align:center;
padding-left: 60px;
padding-right: 20px;
}
#preamble {
margin-left: 280px;
width: 460px;
padding-top: 90px;
}
#preamble h3 {
background: transparent url(preamble.png) no-repeat;
width: 460px;
height: 70px;
}
#preamble h3 span {
display: none;
}
#preamble a:link {
color: #600;
}
#preamble p {
line-height: 150%;
}
#supportingText {
margin-left: 0px;
}
#supportingText a:link {
color: #600;
}
#explanation {
margin-left: 280px;
width: 460px;
}
#explanation h3 {
background: transparent url(sowhat.png) no-repeat;
width: 460px;
height: 50px;
margin-bottom: 20px;
}
#explanation h3 span {
display: none;
}
#explanation p {
line-height: 150%;
}
#participation {
width: 460px;
}
#participation h3 {
background: transparent url(participation.png) no-repeat;
width: 460px;
height: 50px;
margin-bottom: 20px;
}
#participation h3 span {
display: none;
}
#participation p {
line-height: 150%;
}
#benefits {
width: 460px;
}
#benefits h3 {
background: transparent url(benefits.png) no-repeat;
width: 460px;
height: 50px;
margin-bottom: 20px;
}
#benefits h3 span {
display: none;
}
#benefits p {
line-height: 140%;
}
#requirements {
width: 460px;
}
#requirements h3 {
background: transparent url(requirements.png) no-repeat;
width: 460px;
height: 50px;
margin-bottom: 20px;
}
#requirements h3 span {
display: none;
}
#requirements p {
line-height: 140%;
}
#footer {
margin-top: 40px;
background: transparent url(footer.png) repeat-x;
height: 58px;
width: 800px;
text-align: center;
margin-left: -280px;
}
#linkList {
position: absolute;
top: 28em;
left: 40px;
width: 240px;
}
#linkList2 {
font: 10px georgia, times, serif;
text-transform: uppercase;
}
#linkList h3.select {
background: transparent url(select.png) no-repeat top left;
margin: 10px 0px 5px 0px;
width: 240px;
height: 50px;
margin-bottom: 10px;
}
#lselect {
padding-bottom: 20px;
}
#linkList h3.select span {
display:none
}
#linkList h3.favorites {
background: transparent url(favorites.png) no-repeat top left;
width: 240px;
height: 50px;
margin-bottom: 10px;
}
#linkList h3.favorites span {
display:none
}
#linkList h3.archives {
background: transparent url(archives.png) no-repeat top left;
width: 240px;
height: 50px;
margin-bottom: 10px;
}
#linkList h3.archives span {
display:none
}
#linkList h3.resources {
background: transparent url(resources.png) no-repeat top left;
width: 250px;
height: 50px;
margin-bottom: 10px;
}
#linkList h3.resources span {
display:none
}
#linkList ul {
margin: 0px;
padding: 0px;
}
#linkList li {
line-height: 2.5ex;
display: block;
text-align: center;
padding-top: 5px;
padding-left: 20px;
padding-right: 20px;
margin-bottom: 5px;
list-style-type: none;
}
#linkList li a:link {
color: #000;
}
#linkList li a:visited {
color: #333;
}
#extraDiv1 {
background: transparent url(certified.png) top left no-repeat;
position: absolute;
top: 160px;
left: 0px;
width: 100px;
height: 110px;
z-index: 0;
}
/* hidden from IE 5 mac */
@media all {
#explanation {
margin-left: 280px;
}
#participation {
margin-left: 280px;
}
#benefits {
margin-left: 280px;
}
#requirements {
margin-left: 280px;
}
#footer {
margin-left: 0px;
}
}/* css Zen Garden submission 010 - 'A Garden Apart' by Dan Cederholm, http://www.simplebits.com/ */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* All associated graphics copyright 2003, Dan Cederholm */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
body
{
font-family: trebuchet ms, verdana, sans-serif;
font-size: 12px;
line-height: 1.5em;
color: #333;
background: #cccc99;
margin: 0;
padding: 0;
text-align: center;
}
p
{
margin-top: 0px;
}
h3
{
font: bold 140% trebuchet ms;
letter-spacing: -1px;
margin-bottom: 0;
color: #c96;
}
a:link
{
text-decoration: none;
border-bottom: 1px dotted #369;
color: #369;
}
a:visited
{
text-decoration: none;
border-bottom: 1px dotted #369;
color: #369;
}
a:hover, a:active
{
text-decoration: none;
border-bottom: 1px solid #036;
color: #036;
}
/* ---( specific divs )----------------------------- */
#container
{
position: relative;
background: #FFFBDF url(fade.gif) no-repeat 0 92px;
margin: 0 auto 10px auto;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
text-align: left;
width: 800px;
}
#pageHeader
{
height: 92px;
background: url(top.gif) no-repeat top left;
}
/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#pageHeader h1, #pageHeader h2 span
{
margin: 0;
padding: 0;
display: none;
}
#pageHeader h2
{
position: absolute;
top: 110px;
left: 20px;
padding: 0;
margin: 0;
background: url(tagline.gif) no-repeat top left;
width: 528px;
height: 74px;
}
/* ---( quick summary)---------------------------- */
#quickSummary
{
position: absolute;
top: 92px;
right: 0;
left: auto;
z-index: 2;
width: 298px;
voice-family: "\"}\"";
voice-family:inherit;
width: 300px;
}
html>body #quickSummary
{
width: 300px;
}
#quickSummary p
{
margin: 15px 15px 15px 15px;
font-style: italic;
font-size: 140%;
font-family: "trebuchet ms";
font-weight: bold;
line-height: 1.5em;
color: #444;
}
#quickSummary p.p2
{
font-style: normal;
font-weight: normal;
font-size: 100%;
margin-top: 0;
}
#preamble
{
margin: 104px 340px 0px 20px;
}
#supportingText
{
padding-left: 20px;
margin: 0 350px 40px 0;
}
#footer
{
border-top: 1px dotted #CDC4AC;
padding-top: 6px;
text-align: center;
}
#footer a:link, #footer a:visited
{
margin-right: 6px;
}
/* ---( right side nav)----------------------------- */
#linkList
{
position: absolute;
top: 92px;
right: 0;
left: auto;
width: 300px;
padding: 0;
border-left: 1px solid #CDC4AC;
border-bottom: 1px solid #CDC4AC;
background: #E5E0D4 url(zen.gif) no-repeat;
z-index: 1;
}
#linkList2
{
margin: 190px 15px 15px 15px;
}
#linkList h3
{
color: #635F57;
font-family: trebuchet ms;
font-size: 120%;
margin: 0 0 6px 0;
padding: 0;
}
#linkList ul
{
margin: 0px;
padding: 0px;
}
#linkList li
{
display: block;
margin-bottom: 2px;
padding-left: 14px;
background: url(arrow.gif) no-repeat 0 5px;
list-style-type: none;
}
#linkList li a:link
{
color: #c96;
border-bottom: none;
}
#linkList li a:visited
{
color: #c96;
border-bottom: none;
}
#linkList li a:hover
{
color: #963;
}
#lselect
{
padding: 12px 0 12px 0;
border-top: 1px dashed #CDC4AC;
border-bottom: 1px dashed #CDC4AC;
}
#lresources
{
margin-top: 12px;
}/* css Zen Garden submission 011 - 'meliorism' by Brett J. Gilbert - www.paragraphic.co.uk */
/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
/* 'tree' graphic adapted from 'Bending Tree' by Robert Priseman, used with permission */
/* All other graphics copyright 2003, Brett J. Gilbert */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
/*----------------------------------------*
** Global
**----------------------------------------*/
body {
margin: 0;
padding: 0;
text-align: center;
color: #000;
background: #f1f8f3 url(gradSky.jpg) repeat-x;
}
div,p,h1,h2,h3,ul,li {
margin: 0;
padding: 0;
}
h1 span,h2 span,h3 span {
display: none;
}
/*----------------------------------------*
** Layout
**----------------------------------------*/
#container {
position: relative;
width: 760px;
margin: 0 auto;
text-align: left;
}
#intro {
position: absolute;
top: 28px;
left: 0;
width: 310px;
}
#supportingText {
width: 690px;
}
#linkList {
position: absolute;
top: 40px;
left: 585px;
width: 235px;
}
/*----------------------------------------*
** Links
**----------------------------------------*/
a:link,
a:visited { color: #49f; background-color: transparent; text-decoration: none; }
a:hover { color: #f00; background-color: transparent; text-decoration: none; }
#quickSummary p.p2 a:link,
#quickSummary p.p2 a:visited { color: #348633; background-color: transparent; }
#quickSummary p.p2 a:hover { color: #f00; background-color: transparent; }
#footer a:link,
#footer a:visited { color: #348633; background-color: transparent; }
#footer a:hover { color: #f00; background-color: transparent; }
#linkList a.c:link,
#linkList a.c:visited { color: #fa5; background-color: transparent; }
#linkList a.c:hover { color: #f00; background-color: transparent; }
/*----------------------------------------*
** #intro
**----------------------------------------*/
#intro {
font: italic 11px/150% Georgia, Times, "Times New Roman", serif;
color: #888;
background-color: transparent;
}
#pageHeader h1 {
margin-left: 4px;
background: transparent url(introGarden.gif) no-repeat 0 0;
width: 115px;
height: 12px;
}
#pageHeader h2 {
margin-top: 80px;
background: transparent url(introBeauty.gif) no-repeat 0 0;
width: 195px;
height: 73px;
}
#quickSummary p.p1 {
margin: 5px 0 55px 4px;
color: #fa0;
background-color: transparent;
line-height: 160%;
}
#quickSummary p.p2 {
margin: 0 150px 0 4px;
padding: 5px 25px 5px 10px;
background: transparent url(gradGreen.jpg) repeat-y;
border-left: 1px solid #a7d9a8;
color: #888;
line-height: 130%;
}
#preamble {
margin-left: 4px;
padding: 20px 0 0 15px;
border-left: 1px solid #a7d9a8;
}
#preamble h3 {
background: transparent url(introEnlightenment.gif) no-repeat 0 0;
width: 138px;
height: 37px;
}
#preamble p {
margin: 10px 140px 0 0;
}
/*----------------------------------------*
** #supportingText
**----------------------------------------*/
#supportingText {
padding: 430px 0 40px 0;
font: 13px/140% Georgia, Times, "Times New Roman", serif;
color: #888;
background: transparent url(textBack.jpg) no-repeat 0 40px;
}
#supportingText p {
margin: 0 125px 10px 221px;
}
#supportingText h3 {
margin: 25px 0 6px 220px;
width: 206px;
height: 21px;
}
#explanation h3 { background: transparent url(textAbout.gif) no-repeat 0 0; margin-top: 0; }
#participation h3 { background: transparent url(textParticipation.gif) no-repeat 0 0; }
#benefits h3 { background: transparent url(textBenefits.gif) no-repeat 0 0; }
/*----------------------------------------*
** #supportingText > #requirements
**----------------------------------------*/
#requirements {
margin: 30px 0 0 221px;
padding: 0 0 15px 0;
border-left: 1px solid #a7d9a8;
font: italic 11px/150% Georgia, Times, "Times New Roman", serif;
color: #888;
background-color: transparent;
}
#requirements h3 {
margin: 0 0 13px 0;
background: transparent url(textRequirements.jpg) no-repeat 0 0;
width: 175px;
height: 25px;
}
#requirements p {
margin: 9px 0 0 15px;
}
/*----------------------------------------*
** #supportingText > #footer
**----------------------------------------*/
#footer {
margin: 0 0 0 221px;
padding: 4px 0 5px 15px;
background: transparent url(