<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
  <head profile="http://www.w3.org/2005/10/profile">
    <title>Diagonal Grid
</title>
    <meta name="author" content="Joseph Brenner">
    <LINK REL="stylesheet" TYPE="text/css" HREF="http://diagonalgrid.com/sf/dg.css">
    <LINK REL="icon" TYPE="image/png" href="http://diagonalgrid.com/images/favicon.png">
  </head>
  <body>


<P>

<TABLE WIDTH="100%">
<TR VALIGN="top">
<TD WIDTH="70%">
<H3>
San Francisco: an idiosyncratic guide<BR>for the goth-geek-freak-hipster-nerd

</H3>
</TD>
<TD WIDTH="30%" ALIGN="right">
<BR>
<!-- TODO search box? -->
<A HREF="http://diagonalgrid.com/sf/single/introduction.html"><TABLE><TR><TD>Print</TD><!-- <TR><TD>(single page)</TD> --></TABLE></A>

</TD>
</TR>
</TABLE>







/* dg.css, August 20, 2008 */

/* this works... */
HTML {
  color:      #99FF99;  /* light green */
  background: #000000;  /* like my soul */
  font-family: helvetica, verdana, arial, sans-serif;
}

/* but for some reason this stopped working:               September 20, 2008 */
BODY {
  color:      #99FF99;  /* light green */
  background: #000000;  /* like my soul */
  font-family: helvetica, verdana, arial, sans-serif;
}

/* links need a little more room for that underline */
A { line-height: 120%; }

A:link    {color: #CCBBFF; }  /*light cobalt blue*/
A:visited {color: #FF99FF;}   /*light reddish purple*/
A:active  {color: red; }

.wrap {
    max-width: 40em;
}

.ad {
    position: float;
    float:    right;
    padding: 4px 4px 4px 4px;
/*    border: 1px solid #DD0000;*/
}

.left {
    position: float;
    float:    left;
    padding: 4px 32px 4px 4px;
/*    border: 1px solid #DD0000;*/
}

.right {
    position: float;
    float:    right;
    padding: 32px 4px 4px 4px;
/*    border: 1px solid #DD0000;*/
}

.linkcell {
    position: float;
    float:    right;
    padding: 4px 4px 4px 4px;
    border: 1px solid #DD0000;
}

.linkcell_left {
    position: float;
    float:    left;
    padding: 4px 4px 4px 4px;
    border: 1px solid #DD0000;
}

.words_left {
    max-width: 40em;
}

.words_right {
    max-width: 40em;
}

.words {
    max-width: 40em;
}

.img_left {
    position: float;
    float:    left;
    padding: 4px 32px 4px 4px;
/*    border: 1px solid #DD0000;*/
}

.img_right {
    position: float;
    float:    right;
    padding: 32px 4px 4px 4px;
/*    border: 1px solid #DD0000;*/
}


.adsense_right {
    position: float;
    float:    right;
    padding: 4px 4px 4px 4px;
/*    border: 1px solid #DD0000;*/
}

.adsense_left {
    position: float;
    float:    left;
    padding: 4px 4px 4px 4px;
/*    border: 1px solid #DD0000;*/
}

.exp {
    position: relative;
    left: 25%;

}


.indented {
    position: relative;
    left: 5%;
}


<P>

Next:
<A HREF="wharf.html">Don't go there</A>
</P>





    <hr>
    <address>
      <a href="mailto:doom@kzsu.stanford.edu">Joseph Brenner</a>,
      13 Jul 2008
    </address>
  </body>
</html>





