/* css Zen Garden submission 126 - 'C-Note', by Brian Williams, http://www.ploughdeep.com/ */
/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */
/* All associated graphics copyright 2004, Brian Williams */
/* Added: Sept. 16th, 2004 */
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the
designer's written permission. However, feel free to study the CSS and use
techniques you learn from it elsewhere. */
/*Portrait of Benjamin Franklin adapted from the U.S. 100 dollar bill;
the intaglio for which was originally made by Thomas Hipschen, Master
Engraver for the U.S. Bureau of Engraving and Printing.*/
/*---------------------------------------
GRID
---------------------------------------*/
body {
margin:0;
padding:0;}
#container {
position:absolute;
width:100%;}
#pageHeader {
width:918px;
height:320px;}
#quickSummary {
position:absolute;
top:202px;
left:296px;
width:246px;
height:118px;}
#quickSummary p.p2 {
position:absolute;
top:-28px;
left:324px;
width:150px;
padding:63px 0 50px 0;
z-index:3;}
#preamble {padding-top:35px;}
#preamble, #supportingText {
margin-left:185px;
width:410px;
position:relative;
/*\*/left:185px;
margin-left:0;/**/}
#preamble p.p1 {
position:absolute;
top:35px;
left:-170px;
float:left;}
#footer {
padding:80px 0;
text-align:center;}
#linkList {
position:absolute;
top:238px;
left:620px;
width:480px;
z-index:1;}
#linkList2 {
width:155px;
position:relative;
top:116px;}
/*---------------------------------------
IMAGES
---------------------------------------*/
body {background:url(images/cnote/masthead.jpg) repeat-x;}
#container {background:url(images/cnote/sidebody.gif) repeat-y;}
#intro {background:url(images/cnote/logo-on-sunburst.jpg) no-repeat;}
#pageHeader {background:url(images/cnote/PoorRichard.jpg) no-repeat;}
#quickSummary {background:url(images/cnote/quickSummary.gif) no-repeat;}
#quickSummary p.p2 {background:url(images/cnote/serial.gif) no-repeat;}
#preamble h3 {background:url(images/cnote/preamble-h3.gif) no-repeat;}
#preamble p.p1 {background:url(images/cnote/preamble-p1.gif) no-repeat;}
#explanation h3 {background:url(images/cnote/explanation-h3.gif) no-repeat;}
#participation h3 {background:url(images/cnote/participation-h3.gif) no-repeat;}
#benefits h3 {background:url(images/cnote/benefits-h3.gif) no-repeat;}
#requirements h3 {background:url(images/cnote/requirements-h3.gif) no-repeat;}
#linkList {background:url(images/cnote/watermark.png) top right no-repeat;}
#lselect h3 {background:url(images/cnote/lselect-h3.gif) no-repeat;}
#larchives h3 {background:url(images/cnote/larchives-h3.gif) no-repeat;}
#lresources h3 {background:url(images/cnote/lresources-h3.gif) no-repeat;}
/*---------------------------------------
TYPOGRAPHY
---------------------------------------*/
body {
font:76% Arial, Helvetica, sans-serif;
color:#6C7A70;}
h1, h2, h3, h4, h5, h6, p, ol, ul, dl, dt, dd {
margin:0;
padding:0;
list-style-type:none;}
h3 {overflow:hidden;}
h3 span, #preamble p.p1 span {visibility:hidden;}
h1, h2, #quickSummary p.p1{
position:absolute;
top:-500px;}
p {
line-height:2em;
text-indent:1em;
text-align:justify;}
a {
text-decoration:underline;
color:#728569;}
a:hover {
text-decoration:underline;
color:#900 !important;}
a:visited {
text-decoration:underline;
color:#6C7A70;}
#quickSummary p.p2 {
line-height:normal;
text-indent:0;
text-align:left;
letter-spacing:1px;
text-transform:lowercase;
font-variant:small-caps;
font-size:10px;
voice-family: "\"}\"";
voice-family:inherit;
font-size:12px;}
#supportingText p {margin:5px 0;}
#preamble p.p1 {
height:0;
padding-top:200px;
width:155px;}
#preamble h3, #supportingText h3 {
height:20px;
margin-bottom:8px;
voice-family: "\"}\"";
voice-family:inherit;
height:0;
padding-top:20px;}
#explanation h3 {
height:0;
padding-top:25px;}
#supportingText div {margin-top:20px;}
#linkList2 div {margin-top:10px;}
#linkList2 ul {
margin-top:-110px;
/*\*/margin-top:0;/**/}
#linkList li {
padding:10px 0;
color:#909989;
letter-spacing:1px;}
#linkList2 h3 {
height:10px;
h\eight:0;
padding-top:10px;}
#lselect {
font-variant:small-caps;
text-align:right;}
#lselect a {
display:block;
text-align:left;
font:1.1em Georgia, serif;
font-variant:normal;}
#lselect a.c, #larchives, #lresources, #footer {
display:inline;
font-family:Arial, Helvetica, sans-serif;
text-transform:lowercase;
font-variant:small-caps;
text-decoration:none;
font-size:.8em;
voice-family: "\"}\"";
voice-family:inherit;
font-size:1.0em;}
#larchives, #lresources, #footer {
display:block;
letter-spacing:0px;}
|
Download
