@import url(nonn4.css);

/* this is hidden from NN4 */

body {
	margin: 0;
		/* kills default margins on NN4 */
		/* additional killing in nonn4.css */
	padding-top: 80px;
	padding-right: 12%;
	padding-bottom: 70px;
	padding-left: 25%;
		/* sets the gutters and "margins" of a page, */
		/* imitating a left-hand book page           */
	background:	white
			url(http://feeds.wubi.org/ugcs/css/tianjin_baby_bg2.gif)
			no-repeat fixed top right;
	color: black;
}


/* leave default look on links */
a:link { color: navy; }
a:visited { color: #04597A; }
a:hover { background: #ddd; }
a:active { /* cornflowerblue */ color: #6495ED; }
img { border-width: 0px; }
ins { text-decoration: none; font-style: italic; }

/* A list of links */
#Header dd, #Personal dd { 
	margin:		0 .2em 0 0;
	padding:	0;
	font-size: .9em;
	font-family: "Times New Roman", Times, serif;
	display: inline;
}
#Header dt, #Personal dt {
	/* this is the title of the list */
	margin: 0 .3em 0 0;
	/* for the sake of NN4 */
	font-weight: normal;
	font-size: 1em;
	font-style: normal;
	display: inline;
}
#Header dl, #Personal dl {
	margin: .2em 0 .2em 2em;
	text-indent:	-2em;
}



.lynx {
	display: none;
	/* purely decorational stuff for text browsers */
}
.whitepic {
	border: 1px solid #bbb;
	/* for pictures that blend in with the background */
}

/* Google/Yahoo cache box eliminator */
table[border="1"], table[bgcolor] {
	display: none;
}
hr {
	display: none;
}

#Content, #Personal, #Footer { max-width: 620px; }
#Header { max-width: 650px; }
#Header {
	width: 100%;
	padding-top: 64px;
		/* pad the top with the height of the image */
	padding-left: 2px;
		/* for good looks */
	margin-bottom: 1.5em;
		/* white space */
	/* now taken care of by header_switch.cgi */
}
#Header h1 {
	margin-top: 0px;
	margin-bottom: .5em;
	font-size: 2em;
	font-style: normal;
	font-family: "Calisto MT", "Bookman Old Style", "Book Antiqua", Palatino, serif;
	/* Calisto is a cool font */
	font-weight: normal;
	font-variant: small-caps;
}
#Header #Title {
	display: block;
	position: absolute;
	/* The Header Title serves as a running header */
	top: 25px;
	left: 7%;
	/* at the top-left of the page */
	color: black;
	text-decoration: none;
	font-size: .4em;
}
#Header #Title, #Footer {
	font-weight: normal;
	font-variant: normal;
	/* sets the font style for running header and footer */
}
#Header h2 {
	display: none;
	/* implied by style in css-capable browsers */
}



#Personal, #Content {
	border-top: 1px solid #bbb;
	/* decorative line to seperate sections */
	clear: both;
	/* no floating worries! */
}
#Content {
	font-family: Georgia, Palatino, Times, "Times New Roman", serif;
	font-size: .9em;
}
#Content h2 {
	display: none;
	/* implied by style in css-capable browsers */
}
#Content.special h2 {
	display: block;
	/* bring it back for hierarchy purposes */
	font-weight: normal;
	text-align: center;
	/* on non-webloggy pages, style headers differently*/
}
#Content.special h2 span {
	display: block;
	/* bring down the subtitle */
	margin: .5em 0;
	/* space it properly */
	padding-bottom: 1.2em;
	background: url("squiggle.gif") no-repeat scroll center bottom;
	/* add a squiggle below to give it status as a header */
	font-style: italic;
	font-size: .8em;
	line-height: 1;
}
#Content .entry {
	clear: both;
	padding-top: .1em;
}
#Content .entry h3 {
	padding-left: 28px;
	/* to make way for...*/
	background: transparent url("leaf14.gif") no-repeat scroll left;
	background-image: url("leaf14.gif");
	/* a decorative header-marker */
	font-weight: normal;
}
#Content.special h3 {
	margin-bottom: .5em;
	/* to make the title closer to its section */
}
#Content .entry h3 span {
	display: block;
}
#Content h4 {
	font-style: italic;
	font-weight: normal;
	clear: both;
	margin-top: 1.6em;
	margin-bottom: 1em;
}
#Content .permalink {
	font-size: .7em;
	text-align: right;
	margin: .5em 0em;
	/* so the last permalink doesn't jut against the bottom border of Content*/
}
#Content p+p {
	text-indent: 2em;
	margin-top: 0px;
	/* the first paragraph is not indented, all others are */
	/* except for... */
}
#Content p, #Content ul {
	line-height: 1.5em;
	margin-bottom: 0px;
}
#Content ul li p, #Content ol li p, #Content blockquote li {
	margin: 0;
}
#Content p.leader, #Content blockquote+p, #Content .block p {
	text-indent: 0px;
	/* non-contiguous paragraphs! ideally h3+p */
	/* and also paragraphs right after blockquotes */
	margin-top: 1.4em;
	/* which also receive a new section space */
}
#Content blockquote+p {
	margin-top: 1em;
}
#Content blockquote {
	margin: 1.5em 5em .5em 3em;
}
#Content blockquote p {
	text-indent: 0;
	margin-top: 1em;
	line-height: 1.2em;
	font-size: 90%;
}
#Content blockquote[lang] p {
	font-size: 1em;
}
#Content .block p {
	margin-top: 1em;
}
#Content .non-prose p {
	text-indent: 0;
	margin: 1em 0;
}
#Content dl.non-prose p {
	text-indent: 0;
	margin: 0;
}
#Content table p {
	margin: .3em;
	}

#Content .sidenote {
	float: left;
	width: 90px;
	margin-top: -1.5em;
	/* for some reason, it drops a line.  raise it */
	margin-left: -55px;
	/* bring it out left a ways */
	text-align: right;
	font-size: .9em;
	line-height: 1.5em;
}
body>#Content .sidenote {
	/* for Mozilla, IE 5 mac */
	padding-right: 20px;
	/* IE 5 Mac draws the p line out, so pad it in */
	margin-left: -110px;
	/* and adjust the margin accordingly */
}
#Content.special .entry .sidenote {
	position: relative;
	left: -225px;
	/* for Sinoblog, to draw the sidenotes out past the thumbnails */
}
body>#Content.special .entry .sidenote {
	/* for Mozilla, IE 5 mac */
	left: -163px;
}
#Content.special .entry img {
	float: left;
	margin-top: 0em;
	margin-right: 30px;
	margin-bottom: 1em;
	margin-left: 0em; 
	/* NN4 likes these seperate */
}
#Content .entry img {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
}
#Content .entry .IEcenter {
	margin: 1em auto;
	text-align: center;
}
#Content .entry .IEcenter img {
	float: none;
	margin: 0em auto;
	text-align: center;
}
#Content div.IEcenter p {
	text-align: center;
	margin-top: .3em;
}


#Personal {
	margin-top: 1em;
	padding-top: 1em;
	/* decorative */
}
#Personal .email {
	font-size: 1em;
	line-height: 1em;
	font-style: italic;
}
#Personal h2, #Personal h3 {
	display: none;
}

#Footer {
	 position: relative;
	 top: 20px;
	 left: -16%;
	 /* draw the running footer out to resemble a book */
}

/* VANITY CSS */
.pro { color: green; }
.con { color: red; }
.title, .book, .magazine, .movie, .show, .song { font-style: italic; }
.performance { text-decoration: underline; }
span[lang], em[lang], a[lang] { font-style: italic; }
em > em { font-weight: bold; font-style: normal; }
code { color: maroon; }
abbr, acronym { font-style: normal; border-bottom: 1px dotted black; }
/*acronym { text-transform: lowercase; font-variant: small-caps; } */
acronym a:link, abbr a:link { text-decoration: none; }
acronym a:hover, abbr a:hover { text-decoration: underline; }


q:before {	content:	"\201C"; }
q:after {	content:	"\201D"; }
*[lang=zh] q:before, q[lang=zh]:before { content:	"\3010"; }
*[lang=zh] q:after,  q[lang=zh]:after  { content:	"\3011"; }

span[lang], em[lang], a[lang] { font-style: italic; }
span[lang=ja], em[lang=ja], a[lang=ja] { font-style: normal; }
span[lang=zh], em[lang=zh], a[lang=zh] { font-style: normal; }
span[lang=zh].pinyin, span[lang=ja].romaji { font-style: italic; }
span.info { border-bottom: 1px dashed blue; }
/* IE 6 */
span.pinyin { font-style: italic; }
em em { font-style: normal; font-weight: bold; }
ins { font-style: normal; }

/* One time hacks */
.largenumbers {
	border-collapse: collapse; 
	}
.largenumbers td, .largenumbers tr {
	border: 1px solid black;
	}
.largenumbers td {
	padding: 3px;
	}
.pre p {
	font-family:	"courier new", courier, mono;
	font-size:	1em;
	color:		maroon;
	}

table.maglev { width: 50%; margin: 1em auto; border-collapse: collapse; border: 1px solid #bbb; }
table.maglev td, table.maglev th { border: 1px solid #bbb; padding: 0px; }
html body #Content table.maglev p { line-height: 1em; }