body { background:#ffd; padding-left:24px; padding-right:24px; font-family:Verdana,sans-serif; }
body, small, big, td, ul, input, p, cite, span, div, dl { font-size:11px; color:#333; line-height:140%; }
body#darkpage { background-color: #001; }
body#darkpage p, body#darkpage #content li { color:#aaa; }
body#darkpage h1 { color:#669; }

#content { width: 540px; margin: 28px auto 0; } /* used for Processing sketches */

h1, h2, h3, h4 { color:#336; }
h1 { font-size:20px; margin-top:12px; margin-bottom:0; }
h2 { font-size:18px; margin-top:14px; margin-bottom:6px; }
h3 { font-size:14px; margin-top:10px; margin-bottom:4px; }
h4 { font-size:11px; margin-top:4px;  margin-bottom:2px; }
h1.subpage     { font-size:1.5em; margin-bottom:1em; }
h1.breadcrumbs { padding-bottom:1em; border-bottom:#333 solid 1px; }
img { border:none }
sup { font-size:8px; color:#336; }
dfn { font-style:italic; }
dfn.info { border-bottom:1px #666 dotted; cursor:help; font-style:normal; }
p { line-height:1.6em; }
p + ul { margin-top: 0; }
ul + p { clear: left; }
dl ul { padding-left: 0; }

.centred { text-align: center; }
.spacetop { margin-top:1em; }
.nospacetop { margin-top:0; padding-top:0; }
.bigspacetop { margin-top:4em; }
.nospace { margin-top:10px; margin-bottom:0px; }
.story { font-family:Times New Roman,Times,Palatino; letter-spacing:0.02em; font-size:1.6em; line-height:1.65em; }
.story cite { font-family:Times New Roman,Times,Palatino; font-size:1em; }
.caption { color:#999; font-size:0.9em; }
.quotebox { clear: both; background: #fefeee; padding: 0 1em; border: 1px #999 solid; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
div.quotebox { padding: 1em 1em 0.5em; margin-bottom: 1em; }
.quotebox > p:first-child { margin-top: 1em; }
.quotelist { padding-bottom: 1em; } /* /graphic-programming */

.rightcolrt p { font-size:90%; margin-top:0; }
.rightcolrt p cite { font-size:inherit; }
.leftcolrt p { margin-top:0; }
.updated { font-size:smaller; margin-top:1.5em; text-align:right; }

#slogans { padding-top: 4px; margin-top: 1em; border-top: 1px solid #999; text-align: center; }

h1 a:link, h2 a:link, h3 a:link, h4 a:link, dl a:link { color: #336; }
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, dl a:visited { color: #669; }
dt { font-size:1.2em; margin-top:1em; }
dd { margin-right:60px; }
dt a { font-weight:bold; }
dt { font-weight:bold; }


.rightcolrt h2:first-child, /* (replace #top) H2s to align if at the top of a right div */
#top { margin-top:4px; }

.floatright {float:right; margin:0 0 1em 1em; }
.floatleft  {float:left; margin:0 1em 1em 0; }

.smalltext { font-size:9px; color:#333; }
.smalltext cite { font-size:9px; }
.smalltextauthor { font-size:9px; margin-top:0; text-align:right; }

.indented70 { margin-left:70px; margin-right:70px; }

/* ------------ GALLERIES ------------ */
#gallery { text-align:center; background:#aaa; }
#gallery #thumbs a:hover { background:transparent; }
#gallery #thumbs a img { margin:10px 20px; border:2px #ccc solid; }
#gallery #thumbs a img:hover { border-color:#999; }
#gallery p a.here { background:#ccc; }

/* ------------ /cube-app/magic-cube.html ------------ */
.thumbnails { margin: 2em auto 0; padding: 0; width: 844px; list-style-type: none; }
.thumbnails li { display: inline-block; padding: 8px 0; background-color: white; margin: 0 8px; width: 84px; text-align: center; border: 1px solid #ccc; }
.thumbnails li:hover { background-color: #ffc; border-color: #666; }
.thumbnails li span { display: block; font-weight: bold; }
.thumbnails li span a:link,
.thumbnails li span a:visited { color: #333; text-decoration: none; }
.thumbnails li span a:hover { background-color: transparent; }

/* ------------ /cube-app/order*.html ------------ */
#container { width: 960px; margin: 1em auto 0; } /* in 2col.css? */
#leftcol { width: 480px; float: left; }
#rightcol { width: 480px; float: left; padding-top: 5em; }
.darkpage { background:#000 url(/images/stars.jpg); }
.darkpage #container p { font-size: 1.25em; }
.darkpage #container p,
.darkpage #container a:link,
.darkpage #container a:visited { color: #666; }
.darkpage #container a:hover { background: transparent; color: #999; }
#leftcol applet span { font-weight: bold; }
