/*
http://www.bjbjxy.cn
*/


/* Basic Font Styling ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */

html, .project-list h2, #secondary h2 { 
	font-family: chaparral-pro, palatino, georgia, serif; 
	font-size: 62.5%;
	}
	
h2, .entry-meta, .entry-content .aside, #comments ol, input, .wp-paginate, #secondary h4, a.comment-count, .date {
	font-family: "微软雅黑";
	font-size: 15px;
}
	
h1, h3, h4, h5, strong {
	color: #000000;
	text-align: left;
	font-size: 16px;
	font-family: "微软雅黑";
}

h1 {
	font-family: "微软雅黑";
	font-size: 34px;
	font-size: x-large;
	line-height: 1em;
	color: #006600;
}
h2 {
	font-family: "微软雅黑";
	font-size: 20px;
	font-weight: 500;
	line-height: 1.5em;
	text-align: left;
	color: #0099CC;
	font-style: normal;
	
}
h3 { text-transform: uppercase; letter-spacing: .2em; font-style: italic; }

body {
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 0.5em;
	-webkit-transition: all .25s linear;
	transition: all .25s linear;
	background-color: #FFFFFF;
	}
	
p {
	margin: 1.5em 0;
	text-align: left;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
	-webkit-hyphen: auto;
	-moz-hyphen: auto;
	hyphen: auto;
	font: 14px/1.8 "Times New Roman", Times, serif;
	color: #000000;
	font-family: "微软雅黑";
	font-size: medium;
}

.aside { text-align: left; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; -webkit-hyphen: auto; -moz-hyphen: auto; hyphen: auto; }

em {
	text-align: left;

}

blockquote { font-style: italic; font-size: 18px; font-size: 1.8rem; line-height: 1.4em; }
blockquote + em { font-style: normal; }

a {
	-webkit-transition: all .25s linear;
	transition: all .25s linear;
	text-align: center;
}

sup { font-size: 8px; font-size: .8rem; position: relative; top: -1em; }

abbr { text-transform: lowercase; font-variant: small-caps; font-size: 1.1em; }

/* Main Menu & Logo Lockup ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#branding { overflow: hidden; padding-bottom: 97px; -webkit-transition: margin-top .25s; transition: margin-top .25s; }
h1#site-title { float: left; }
h1#site-title a { 
	background: url('images/strange-native-logo.png') no-repeat left top;
	display: block;
	font-size: 16px;
	font-size: 1.6rem;
	margin-right: 30px;
	height: 24px;
	line-height: 1.5em;
	text-indent: -9999px;
	width: 70px;
	}
#menu-main-menu-container { overflow: hidden; }
#menu-main-menu, #colophon nav { overflow: hidden; }
#menu-main-menu li, #colophon nav li { float: left; }
#menu-main-menu li a, #colophon nav li a {
	color: black;
	color : silver\9;
	text-decoration: none;
	opacity: .2;
	font-size: 24px;
	font-size: 2.4rem;
	padding: 0 20px;
	}
#menu-main-menu li a:hover {
	color: black\9;
	}
#menu-main-menu li.current-menu-item a, #menu-main-menu li a:hover, #colophon nav li a:hover { opacity: 1; }
#menu-toggle { display: none; }

/* Main Content Styling ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#primary {
	background: #FFFFFF;
	border-color: #FFF;
	font: large/2.4rem "黑体";
	color: #066;
	padding-top: 1.5em;
	padding-right: 8.33333%;
	padding-bottom: 1.5em;
	padding-left: 8.33333%;
}
#primary a {
	color: #006699;
	font-family: "黑体";
	text-align: center;
	background-color: #FFF;
	font-size: large;
}
#primary .post a, #primary .post-list a { 
	color: #d23939;
	text-decoration: none;
	background-color: none;
	}
#primary .post a:hover, #primary .post-list a:hover { color: #000; background-color: #ffdf1f; }
#primary #post-nav, #primary #prev-next-nav { display: none; overflow: hidden; border-bottom: 1px solid #d2d2d2; margin-bottom: 30px; }
#primary #prev-next-nav { padding-bottom: 20px; display: none; text-align: center; border: none; font-size: 24px; font-size: 2.4rem; }
#prev-next-nav .divider { opacity: .2; }
#primary .post-link { padding: 0 0 20px; }
#primary .post-link a {
	text-decoration: none;
	opacity: .2;
	font-weight: bold;
	font-style: italic;
	display: block;
	font-size: 18px;
	font-size: 1.8rem;
	}
#primary .post-link a:hover { opacity: 1; }
#primary #prev-next-nav .post-link a { display: inline; }
#primary .previous-post-link { float: left; }
#primary .next-post-link { float: right; }

#main-content, .entry-content, .news-content { margin-bottom: 3em; }

#single-post h2 { margin-top: 10px; }
h3 {
	margin: 2em 0 1em;
	font-family: "微软雅黑";
	font-style: normal;
	font-size: 20px;
	text-align: center;
}
h3.page-title { margin-top: 0; }
.post .entry-header { margin-bottom: 60px; margin-top: 10px; }
.kicker { display: block; font-size: 21px; font-size: 2.1rem; line-height: 1.4em; margin: 1em 0; }
#single-post { position: relative; }
#single-post .entry-content { margin-left: 20%; }
#single-post .entry-content ul { list-style-type: disc; }
#single-post .entry-content ol { list-style-type: decimal-leading-zero; }
#single-post .content-wrapper { position: relative; }
#single-post .entry-meta { position: absolute; left: 0; top: 25px; width: 20%; padding-top: 5px; font-size: 14px; font-size: 1.4rem; overflow: hidden; }
#single-post .date { 
	opacity: .5;
	padding-left: 25px;
	background: url(images/cal-ico.png) no-repeat left 2px;
	position: absolute;
	left: 0;
	top: 5px;
	width: 20%;
	}
.single-post h4.toggle-comments, .home h4.toggle-comments { display: none; }
#primary .entry-meta .comment-count a {
	padding-left: 25px; 
	background: url(images/bubble-ico.png) no-repeat left top;
	}
#primary .entry-meta .comment-count a:hover {
	background: url(images/bubble-ico.png) no-repeat left top;
	}
#primary .entry-meta a {
	color: #000;
	text-decoration: none;
	opacity: .5;
	}
#primary .entry-meta a:hover { opacity: 1; background: none; }
#primary .entry-meta .tags { margin-top: 20px; }
#primary .entry-meta .tags a { padding: 2px 0 2px 25px; background: url(images/tag-ico.png) no-repeat left center; }
#single-post .entry-meta .edit-link { display: block; margin-top: 20px; font-weight: bold; font-style: italic; }
#single-post .entry-content .aside { 
	position: absolute;
	right: 0;
	width: 20%;
	opacity: .5;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.7em;
	padding-top: 3px;
	}
#single-post .entry-content p, #single-post .entry-content ul, #single-post .entry-content ol { margin-right: 35%; }
#single-post .entry-content p.kicker, #single-post .entry-content .kicker { margin-right: 0; }
#single-post .entry-content img, #single-post .entry-content iframe, #project-post .entry-content img, #project-post .entry-content iframe { max-width: 100%; }
body .f .w, body .f .v { background: #f6f6f6; }

#comments {
	border-top: 1px solid #d2d2d2;
	padding-top: 20px;
	font: 16px/1.8em "黑体";
	text-align: left;
	color: #006699;
}
#comments h3 { 
	font-size: 24px;
	font-size: 2.4rem;
	text-transform: lowercase;
	opacity: .5;
	font-weight: normal;
	float: left;
	letter-spacing: 0;
	margin-top: 5px;
	}
h3.comments-toggle {
	font-size: 24px;
	font-size: 2.4rem;
	font-weight: normal;
	margin: 0;
	margin-top: -3em;
	margin-bottom: 2em; 
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
	z-index: 100;
	position: relative;
	color: gray;
	opacity: .5;
	-webkit-transition: all .25s linear;
	transition: all .25s linear;
	}
h3.comments-toggle img{ position: relative; top: 5px; }
h3.comments-toggle:hover { opacity: 1; color: black; }
#comments ol.commentlist { 
	margin: -2.5em 0 0 20%;
	position: relative;
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1.5em;
	margin-bottom: 40px;
	}
#comments ol.commentlist li.comment .comment { padding: 20px 0; border-bottom: 1px solid #d2d2d2; padding-right: 35%; opacity: .5; }
#comments ol.commentlist li.comment footer { width: 20%; position: absolute; right: 0; margin-top: 18px; }
#comments #respond { margin-left: 20%; }
#comments #respond form p { margin: 8px 0; }
#comments #respond label, #respond .required { display: none; }
#comments #respond input { 
	width: 37.5%;
	height: 40px;
	outline: none;
	border: none;
	opacity: .4;
	font-size: 16px;
	font-size: 1.6rem;
	border-top: 1px solid gray;
	padding: 0px 10px;
	border-radius: 0;
	-webkit-appearance: none;
	}
#comments #respond input.empty, #comments #respond textarea.empty { color: silver; }
#comments #respond input:focus { -webkit-box-shadow: 0 0 5px #ffdf1f; -moz-box-shadow: 0 0 5px #ffdf1f; box-shadow: 0 0 5px #ffdf1f; opacity: 1; }
#comments #respond textarea { 
	border: none;
	outline: none;
	opacity: .4;
	border-top: 1px solid gray;
	width: 65%; padding: 10px;
	font-size: 16px;
	font-size: 1.6rem;
	border-radius: 0;
	-webkit-appearance: none;
	}
#comments #respond textarea:focus { 
	-webkit-box-shadow: 0 0 5px #ffdf1f;
	-moz-box-shadow: 0 0 5px #ffdf1f;
	box-shadow: 0 0 5px #ffdf1f;
	opacity: 1;
	}
#comments #respond input[type="submit"] {
	border-top: none;
	border-bottom: 1px solid gray;
	width: 160px;
	cursor: pointer;
	border-radius: 0;
	-webkit-appearance: none;
	background-color: #C0C0C0;
	}
#comments #repond input[type="submit"]:hover {
	background-color: #ffdf1f;
	}
#comments .comment-author { text-transform: capitalize; }
.caption { display: block; font-size: 14px; font-size: 1.4rem; opacity: .5; } 
.bibliography {
	font-size: 14px;
	font-size: 1.4rem;
	}
#single-post ol.bibliography {
	list-style-type: decimal;
	}
#single-post ul.bibliography {
	list-style-type: none;
	}


/* Category/Search/Tags Page ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
.category #primary h1, .archive #primary h1, .search-results h1 { font-size: 36px; font-size: 3.6rem; line-height: 1.15em; }
.category-work #primary .project-list h1 { padding: .5em 0 0; }
.category-news #primary .post-list h1 { margin-bottom: .5em; }
.category #primary .post-list h1 a, .archive #primary .post-list h1 a, .search-results #primary .post-list h1 a {
	color: #000; 
	text-decoration: none;
	background-color: transparent;
	}
.category #primary .post-list h1 a:hover, .archive #primary .post-list h1 a:hover, .search-results #primary .post-list h1 a:hover { 
	background-color: #ffdf1f;
	}
.category #primary h2 { font-size: 18px; font-size: 1.8rem; margin: 1em 0; margin-left: 20%; }
.category-work #primary h2 {
	margin-left: 0;
	font-family: "黑体";
	font-size: medium;
} 
#primary ol.post-list li { padding: 30px 0 40px; border-top: 1px solid #d2d2d2; position: relative; }
#primary ol.post-list li:first-child { border: none; padding-top: 0; }
#primary ol.post-list li .entry-meta li { padding: 0; border: none; }
.news-content, .ideas-content, .search-content, .tag-content { margin-right: 28%; margin-left: 20%; }
#primary ol.post-list li h1 { margin-left: 20%; }

.category #primary ol.post-list .entry-meta, .archive #primary ol.post-list .entry-meta, .search-results #primary ol.post-list .entry-meta { 
	position: absolute; 
	left: 0; 
	top: 60px; 
	font-size: 14px;
	font-size: 1.4rem;
	width: 18%;
	overflow: hidden;
	}
.category #primary ol.post-list li:first-child .entry-meta, .archive #primary ol.post-list li:first-child .entry-meta, .search-results #primary ol.post-list li:first-child .entry-meta {
	top: 25px;
	}
.category #primary ol.post-list .date, .archive #primary ol.post-list .date, .search-results #primary ol.post-list .date	{
	padding-left: 25px; 
	background: url(images/cal-ico.png) no-repeat left 2px;
	opacity: .5;
	position: absolute;
	left: 0;
	top: 35px;
	}
.category #primary ol.post-list li:first-child .date, .archive #primary ol.post-list li:first-child .date, .search-results #primary ol.post-list li:first-child .date {
	top: 0;
	}
ol.wp-paginate li a, ol.wp-paginate li .current, ol.wp-paginate li .gap {
	width: 40px;
	height: 32px;
	padding-top: 8px;
	float: left;
	margin: 0 1px;
	text-align: center;
	background: #d2d2d2;
	text-decoration: none;
	opacity: .5;
	}
ol.wp-paginate li a:hover, ol.wp-paginate li .current {
	opacity: 1;
	}
.entry-content img { -webkit-box-shadow: 0 1px 1px gray; -moz-box-shadow: 0 1px 1px gray; box-shadow: 0 1px 1px gray; }
.entry-content img.alignleft, #primary .news-content img.alignleft { float: left; margin-right: 2.5%; }


/* About Me ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
.page h3 { border-bottom: 1px solid #d2d2d2; padding-bottom: 10px; }
.page #primary .entry-content a {
	color: #d23939;
	text-decoration: none;
	background: transparent;
	}
.page #primary .entry-content a:hover { color: #000; background: #ffdf1f; }
.about-me {
	position: relative;
	margin-bottom: 4em;
	font-size: large;
}
#portrait { border-radius: 500px; width: 50%; max-width: 580px; float: right; margin-left: 10%; margin-bottom: 2em; z-index: 100; position: relative; }
.about-me p { max-width: 40%; }
.hobbies p { max-width: 60%; }
.hobbies { position: relative; margin-bottom: 4em; }
.speaking ul { overflow: hidden; }
.speaking li h4 { font-size: 18px; font-size: 1.8rem; margin-bottom: -10px; }
.speaking li { width: 46.5%; overflow: hidden; float: left; padding-right: 3.5%; position: relative; margin: 1em 0; }
.speaking li img { 
	width: 30%; 
	margin-right: 4%; 
	margin-bottom: 1em; 
	float: left; 
	-webkit-box-shadow: 0 1px 1px black; 
	-moz-box-shadow: 0 1px 1px black; 
	box-shadow: 0 1px 1px black; 
	}
.speaking li p { text-align: left; margin-left: 34%; }
.contact {
	overflow: hidden;
	font: 16px "黑体";
}
.contact p.why { width: 40%; float: left; }
.contact p.how { font-size: 24px; font-size: 2.4rem; line-height: 1.5em; width: 50%; float: right; margin: .75em 0; }
.writing { margin-bottom: 3em; }
.writing li { margin: .5em 0; }
.writing h4 { display: inline; }
.writing h4 cite { font-style: italic; }
.writing h4 + p { display: inline; }
.page #primary .entry-content .writing h4 a { color: black; }


/* News Page ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#primary .news-content ol { list-style-type: decimal-leading-zero; }
#primary .news-content ol li, #primary .news-content ul li { border: none; padding: 0; margin: .5em 0; }
#primary .news-content ul { list-style-type: disc; }
#primary .news-content img, #primary .news-content iframe, #primary .news-content object { 
	max-width: 100%; 
	margin: .5em 0; 
	-webkit-box-shadow: 0 1px 1px gray; 
	-moz-box-shadow: 0 1px 1px gray; 
	box-shadow: 0 1px 1px gray; 
	}
.news-content .kicker { font-size: 16px; font-size: 1.6rem; line-height: 1.5em; }
#primary .comment-toggle {
	font-weight: bold;
	font-style: italic;
	letter-spacing: .07em;
	margin-top: 3em;
	}
#primary .comment-toggle a {
	color: #000;
	opacity: .5;
	}
#primary .comment-toggle a:hover { opacity: 1; }
#primary .post-list #comments li { padding: 0; border-top: none; }
.post-list #comments { display: none; }
.post-list #comments h3 { cursor: pointer; }
.toggle-comments { 
	cursor: pointer; 
	margin-left: 20%; 
	opacity: .5;
	}
.toggle-comments:hover { opacity: 1; }


/* Project Page ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
.project-list h1 { width: 35%; border-top: 1px solid #d2d2d2; padding-top: .75em; }
.project-list h2 { font-size: 18px; font-size: 1.8rem; line-height: 1.5em; margin: 1em 0 1.5em; }
.project-list li { position: relative; overflow: hidden; margin: 1.5em 0; }
.project-list .about-project { width: 35%; }
.project-list li img { 
	max-width: 100%; 
	-webkit-box-shadow: inset 0 1px 0 black; 
	-moz-box-shadow: inset 0 1px 0 black; 
	box-shadow: inset 0 1px 0 black; 
	}
.ongoing-image { width: 60%; float: right; }
.project-list li a { 
	font-size: 16px; 
	font-size: 1.6rem; 
	text-decoration: none; 
	font-style: italic; 
	opacity: .5;
	}
.project-list li a:hover { opacity: 1; background: #ffdf1f; }


/* New Project Page ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#facebook {
	overflow: hidden;
	text-align: left;
	}
#facebook #description {
	border-top: 1px solid #d2d2d2;
	width: 30%;
	margin-right: 3.333%;
	float: left;
	}
#facebook img {
	width: 63.333%;
	margin-right: 3.333%;
	float: left;
	}
#project-list li {
	float: left;
	margin-right: 3.333%;
	width: 30%;
	}
#project-list h1 {
	margin: .5em 0;
	text-align: left;
	font: normal 14px/1.8 "Times New Roman", Times, serif;
	color: #000;
	font-family: "宋体";
	font-size: medium;
	}
#secondary #project-list h2 {
	font-size: 18px;
	font-size: 24px;
	font-style: normal;
	font-weight: bold;
	letter-spacing: normal;
	margin-bottom: 3em;
	text-transform: none;
	text-align: center;
	font-family: "黑体";
	color: #000000;
	}
img.catalog-image {
	max-width: 100%;
	box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
	}
#project-list li a:hover {
	background: #ffdf1f;
	opacity: 1;
	text-align: left;
	}
#secondary .third {
	clear: both;
	
	}
#secondary .second {
	clear: none;
	}
#secondary .third.second {
	clear: both;
	font: 14px/1.8rem "Times New Roman", Times, serif;
	}

	
/* Work Single Page ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#project-post h1 {
	font-size: 36px;
	font-size: 3.6rem;
	}
#project-post .left {
	float: left;
	}
#project-post .right {
	float: right;
	}
#project-post .right.two-col {
	float: right;
	width: 50%;
	margin-right: 0;
	}
#project-post .one-col {
	width: 21%;
	margin-right: 4%;
	}
#project-post .two-col {
	width: 46%;
	margin-right: 4%;
	}
#project-post .three-col {
	width: 71%;
	margin-right: 4%;
	}
#project-post .entry-content {
	margin-top: 2em;
	overflow: hidden;
	}
#project-post img {
	max-width: 100%;
	}


/* Secondary ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#secondary {
	overflow: hidden;
	padding-top: 0.5em;
	padding-right: 8.33333%;
	padding-bottom: 0.75em;
	padding-left: 8.33333%;
	background-color: #FFFFFF;
	background-image: url(images/gray-shadow.jpg);
	background-repeat: repeat-x;
	background-position: top;
}
#secondary h2 { 
	font-size: 14px; 
	font-size: 1.4rem; 
	text-transform: uppercase; 
	font-weight: bold; 
	font-style: italic; 
	letter-spacing: .2em;
	margin-bottom: 1.5em;
	opacity: .3;
	}
#secondary .blogroll { list-style-type: none; width: 30%; margin-right: 3.3333333%; float: left; }
.blogroll li { border-top: 1px solid #d2d2d2; font-size: 14px; font-size: 1.4rem; margin-top: 1em; }
.blogroll li a { 
	display: block; 
	text-decoration: none; 
	color: #000; 
	text-transform: uppercase; 
	margin-top: .5em;
	font-weight: bold;
	letter-spacing: .2em;
	}
.blogroll li a:hover { background: #ffdf1f; }
#secondary #crp_related h2.related-intro { width: 30%; margin-right: 3.33333333%; float: left; margin-bottom: .5em; }
#secondary #crp_related ul { overflow: hidden; margin-top: -.5em; clear: both; }
#secondary #crp_related li { width: 30%; margin-right: 3.3333333%; float: left; border-top: 1px solid #d2d2d2; }
#secondary #crp_related h3 { margin: 1.5em 0 .5em; }
#secondary #crp_related h3 a { 
	font-size: 24px;
	font-size: 2.4rem; 
	font-weight: bold; 
	text-transform: none; 
	letter-spacing: 0;
	font-style: normal;
	text-decoration: none;
	color: #000;
	padding-top: 0;
	margin-top: 0;
	}
#secondary #crp_related h3 a:hover { background: #ffdf1f; }
#secondary h4 {
	font-weight: normal;
	font-size: 14px;
	font-size: 1.4rem;
	margin-bottom: 1em;
	line-height: 1.5em; 
	}
#secondary a.comment-count {
	text-decoration: none;
	opacity: .3;
	color: #000;
	font-size: 14px;
	font-size: 1.4rem;
	text-transform: uppercase;
	padding-left: 25px;
	background: url(images/bubble-ico.png) no-repeat left top;
	}
#secondary a.comment-count:hover { opacity: 1; }
#secondary ul.nav { overflow: hidden; margin-bottom: 1em; }
#secondary ul.nav li { float: left; margin-right: 40px; }
#secondary a {
	text-decoration: none;
	color: #000;
	font-family: "微软雅黑";
	font-size: 16px;
	text-align: left;
}
#secondary ul.nav h2 { padding-bottom: .5em; }
#secondary ul.nav h2.active { border-bottom: 1px solid black; opacity: 1; }
#secondary ul.nav h2:hover { opacity: 1; }
#secondary .projects a:hover { background: #ffdf1f; }
#secondary .projects h3 { letter-spacing: 0; clear: both; text-transform: none; font-size: 24px; font-size: 2.4rem; font-style: normal; margin: .5em 0; }
#secondary ul.projects  { overflow: hidden; }
#secondary .projects li { width: 20%; margin-right: 5%; float: left; min-height: 140px; }
#secondary .projects li img { max-width: 100%; -webkit-box-shadow: 0 1px 1px black; -moz-box-shadow: 0 1px 1px black; box-shadow: 0 1px 1px black; }
ul.projects.client, ul.projects.personal { display: none; }


/* Footer  ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
#colophon {
	background: FFFFF;
	overflow: hidden;
	font: 14px/1.8em "Times New Roman", Times, serif;
	padding-top: 0.75em;
	padding-right: 3.33333%;
	padding-bottom: 0.75em;
	padding-left: 3.33333%;
}
#colophon nav { float: left; overflow: hidden; }
#colophon nav li a { color: #e7b418; opacity: 1; }
#colophon nav li a:hover { color: #000; }
#colophon .linkout {
	float: none;
	overflow: hidden;
}
#colophon .linkout a { display: block; text-indent: -9999px; width: 40px; height: 31px; float: left; margin: 0 10px; }
#colophon a.twitter { background: url(images/twitter-ico.png) no-repeat top left; }
#colophon .linkout a.vimeo { background: url(images/vimeo-ico.png) no-repeat top left; margin-left: 14px; }
#colophon a.dribbble { background: url(images/dribble-ico.png) no-repeat top left; }
#colophon .linkout a:hover { background-position: left -43px; }
#colophon form { float: right; text-align: right; }
#colophon form label { text-align: left; display: block; text-indent: -9999px; width: 0; height: 0; }
#colophon form input[type="text"] {
	position: relative;
	top: -6px;
	margin-left: 10px;
	height: 40px;
	border-radius: 20px;
	border: none;
	opacity: .5;
	width: 120px;
	-webkit-box-shadow: inset 0 1px 0 #e7b418;
	-moz-box-shadow: inset 0 1px 0 #e7b418;
	box-shadow: inset 0 1px 0 #e7b418;
	-webkit-transition: all .25s linear;
	transition: all .25s linear;
	padding: 0 40px 0 20px;
	}
#colophon form input[type="text"]:focus {
	outline: none;
	opacity: 1;
	}
#colophon form input[type="submit"] { 
	background: url(images/search-ico.png) no-repeat; 
	width: 20px; 
	height: 20px; 
	text-indent: -9999px; 
	border: none;
	position: relative;
	left: -35px;
	cursor: pointer;
	top: -6px;
	top: 6px\9;
	*top: 4px;
	}
#footpanel {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 9999;
	padding-left: 0%;
	padding-right: 0%;
	border-bottom: none;
	width: 100%;
	color: #000;
	background-color: #FFFFFF;
	margin-top: 0;
	margin-right: 0%;
	margin-bottom: 0;
	margin-left: 0%;
}
*html #footpanel { /*--IE6 Hack - Fixed Positioning to the Bottom--*/
margin-top: -1px; /*--prevents IE6 from having an infinity scroll bar - due to 1px border on #footpanel--*/
position: absolute;
top:expression(eval(document.compatMode &&document.compatMode=='CSS1Compat') ?documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight) : document.body.scrollTop +(document.body.clientHeight-this.clientHeight));
}
ul{list-style:none;}
		
	
	
/* Media Queries for Resizing  ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
@media screen and (min-width: 1440px) {
	#single-post .entry-content, #comments #respond, .news-content, .ideas-content, .search-content, .tag-content, 
		.category #primary h2, #primary ol.post-list li h1, .toggle-comments, #comments ol.commentlist { margin-left: 235px; }
	ol.wp-paginate { padding-left: 235px; }
	#single-post .entry-content .aside { left: 955px; max-width: 200px; }
	h3.comments-toggle { max-width: 235px; }
	.category-work #primary h2 { margin-left: 0; }
	#primary p { max-width: 620px; }
	}


@media screen and (max-width: 960px) {
	#single-post .entry-content p, #single-post .entry-content ul, #single-post .entry-content ol { margin-right: 0; }
	#comments ol.commentlist li.comment .comment { padding-right: 0; }
	#primary ol.post-list li h1, .news-content, .ideas-content, .search-content, .tag-content { margin-right: 0; }
	#single-post .entry-content .aside { 
		position: static;
		float: right;
		width: 30%;
		margin: 0 0 1em 9%;
	}
	#single-post .entry-content p > .aside { margin: 1em 0 1em 9%; }
	#comments ol.commentlist li.comment footer { position: static; width: 100%; }
	#comments #respond textarea { width: 95%; }
	#comments #respond input { width: 50%; }
	.page-template-default p { text-align: left; }
	.hobbies { margin-right: 0; }
	.about-me p, .hobbies p { max-width: 100%; }
	#colophon .linkout {
	float: none;
	text-align: left;
	clear: both;
	margin: 5em auto 0;
	text-align: left;
}
	#colophon .linkout a { margin: 0 10px; display: inline-block; float: none; }
	#colophon nav { width: 65%; }
	#colophon nav li { width: 25%; text-align: center; text-align: left; }
	#colophon nav li a { padding: 0; }
	#colophon form { width: 35%; }
	#colophon form input[type="text"] {
		margin-left: 0;
		width: 72%;
		padding: 0 23% 0 5%;
	}
	#colophon form input[type="submit"] { 
		position: relative;
		left: -7%;
		top: -36px;
	}
	.category #primary .project-list h1 { font-size: 30px; font-size: 3.0rem; padding: .5em 0 0;}
	.category-work #primary h2 { margin: .75em 0; font-size: 16px; font-size: 1.6rem; }
	.project-list p { margin-top: 1em; }
	
	/* New Stuff */
	#project-list li {
	width: 48%;
	margin-right: 0;
	text-align: left;
		}
	#secondary .third {
	clear: none;
	text-align: left;
		}
	#secondary .second {
	clear: both;
	margin-right: 4%;
	text-align: left;
		}
	#facebook #description {
		width: 100%;
		float: none;
		}
	#facebook img {
		margin-right: 0;
		width: 100%;
		float: none;
		}
	#project-post .two-col, #project-post .one-col, #project-post .three-col, #project-post .right.two-col {
		width: 100%;
		margin: 0;
		}
	#project-post h1 {
		margin-top: 1em;
		}
}

@media screen and (max-width: 768px) {
  /* do all your shit for phones */
  	h1 { font-size: 60px; font-size: 6.0rem; }
  	h2 {
	font-size: 28px;
	font-size: 2.8rem;
	font-family: "微软雅黑";
}
	#single-post .entry-content, #comments #respond, #primary ol.post-list li h1, .news-content, 
	.ideas-content, .search-content, .tag-content, #comments ol.commentlist, .category #primary h2 { margin-left: 0; }
	#single-post .entry-meta, #comments ol.commentlist li.comment footer, .category #primary ol.post-list .entry-meta, 
	.archive #primary ol.post-list .entry-meta, .search-results #primary ol.post-list .entry-meta { position: static; width: 100%; }
	
	h3.comments-toggle { float: none; width: 100%; margin-top: .5em; }
	#comments h3 { float: none; width: 100%; }
	.toggle-comments { margin-left: 0; }
	
	#branding { padding-bottom: 2em; }
	#branding.navOn { margin-top: 40px; }
	h1#site-title { margin-bottom: 30px; }
	h1#site-title a { margin: 0 auto; background-position: center center; }
	#branding .menu-main-menu-container {
		float: none;
		height: 0;
		left: 0;
		overflow: hidden;
		position: absolute;
		top: 0; 
		width: 100%;
		-webkit-transition: height .25s;
		}
	#branding.navOn .menu-main-menu-container {
		height: 55px;
		}
	#menu-main-menu {
		border-bottom: 1px solid white; 
		}
	#menu-main-menu li {
		width: 25%;
		}
	#menu-main-menu li a { 
		background: #d4d4d4;
		display: block;
		text-align: center;
		padding: 15px 0 10px; 
		box-shadow: inset 0 -1px 0px #cfcfcf, inset 0 1px 0 #b6b6b6; 
		-webkit-box-shadow: inset 0 -1px 0px #cfcfcf, inset 0 1px 0 #b6b6b6; 
		-moz-box-shadow: inset 0 -1px 0px #cfcfcf, inset 0 1px 0 #b6b6b6;
		width: 100%;
		}
	#menu-main-menu li.current-menu-item a { 
		background: #d4d4d4; 
		box-shadow: inset 0 -1px 0px #cfcfcf, inset 0 1px 0 #b6b6b6; 
		-webkit-box-shadow: inset 0 -1px 0px #cfcfcf, inset 0 1px 0 #b6b6b6; 
		-moz-box-shadow: inset 0 -1px 0px #cfcfcf, inset 0 1px 0 #b6b6b6; 
		}
	#menu-toggle {
		background: url('images/menu-icn.png') no-repeat center;
		display: block;
		float: right;
		height: 24px;
		overflow: hidden;
		text-indent: -9999px;
		width: 30px;
		}
		
	.kicker { text-align: left; }
	ol.wp-paginate { padding-left: 0; overflow: hidden; }
	.post .entry-header { margin-bottom: 1.5em; }
	#single-post .date { position: static; width: 85%; }
	#single-post .entry-meta { margin-bottom: 4em; }
	.comment-count { float: left; }
	#primary .entry-meta .tags { width: 75%; float: right; overflow: hidden; margin-top: 0; }
	.tags li { float: left; margin-right: 20px; }
	.category #primary ol.post-list .date, .archive #primary ol.post-list .date, .search-results #primary ol.post-list .date { 
		position: static; margin-top: 1em; 
	}
	#primary .entry-meta { margin-bottom: 2em; }
	.category-work #primary h1 { font-size: 24px; font-size: 2.4rem; }
	.category-work #primary h2, .project-list li a { font-size: 14px; font-size: 1.4rem;}
	.about-me img { margin-left: 5%; }
	.contact p.why { width: 100%; float: none; }
	.contact p.how { width: 100%; float: none; }
	.speaking li { width: 100%; float: none; padding-right: 0; margin: 1em 0; }
	#secondary .blogroll { width: 45%; margin-right: 5%; }
	#secondary #crp_related h2.related-intro.three { display: none; }
	#secondary #crp_related li:last-child { display: none; }
	#secondary #crp_related li, #secondary #crp_related h2.related-intro { width: 45%; margin-right: 5%; }
	#secondary .projects li { width: 45%; }

}

@media screen and (max-width: 480px) {
	/* New Stuff */
	#project-list li {
	float: none;
	margin-right: 0;
	width: 100%;
	font: 14px/1.8rem "Times New Roman", Times, serif;
	color: #000;
	text-align: left;
		}
	
	#branding { padding-bottom: 1em; }
	h1 {
	font-size: 42px;
	font-size: x-large;
	color: #006600;
}
	h2 {
	font-size: 20px;
	text-align: left;
	font-family: "微软雅黑";
}
	html { font-size: 55%; }
	/* p { text-align: left; } */
	.post .entry-header { margin-bottom: 2em; }
	#primary, #secondary, #colophon {
	padding-top: 0.05em;
	padding-right: 3.3%;
	padding-bottom: 0.75em;
	padding-left: 3.3%;
}
	#comments #respond input { width: 70%; }
	#comments ol.commentlist li.comment footer { margin-top: 0; }
	.comment-count { float: none; }
	.commentmetadata time { font-size: 10px; font-size: 1.0rem; }
	#primary .entry-meta .tags { width: 100%; float: none; margin-top: .5em; }
	#portrait { width: 100%; float: none; margin-left: 0; margin-top: 1em; margin-bottom: 1em;}
	#secondary .blogroll { width: 100%; margin-right: 0; float: none; }
	#colophon nav { width: 100%; float: none; margin-bottom: 2em;  }
	#colophon nav li { text-align: center; }
	#colophon form { float: none; width: 100%; }
	#colophon .linkout { margin-top: 1em; }
	#colophon form input[type="submit"] { top: -35px; }
	#secondary #crp_related h2.related-intro.two { display: none; }
	#secondary #crp_related li { float: none; width: 100%; margin-right: 0; margin-bottom: 2em; }
	#secondary #crp_related li:last-child { display: block; }
	#primary #prev-next-nav { display: none; }
	#primary #post-nav { display: none; }
	#comments #respond textarea, #comments #respond input { opacity: 1; }
	#secondary .projects { padding: 1px; }
	#secondary .projects li { width: 100%; float: none; margin: 2em 0; }
	#secondary ul.nav { margin-bottom: 1em; }
	#secondary ul.nav li { margin-right: 0; width: 33.33333333%; text-align: center; }
	#secondary ul.nav h2 { display: inline; }
	.project-list li, .project-list li p { text-align: center; background: #E6E6E6; }
	.project-list li { 
		padding: 20px 20px 0 20px; 
		border-radius: 5px; 
		box-shadow: 0 -1px 0px silver, 0 1px 0 white; 
		-webkit-box-shadow: 0 -1px 0px silver, 0 1px 0 white; 
		-moz-box-shadow: 0 -1px 0px silver, 0 1px 0 white; 
		}
	.project-list li .ongoing-image { 
		float: none; 
		width: 100%;
		}
	.project-list li .ongoing-image img {
		box-shadow: 0 1px 1px gray; 
		-webkit-box-shadow: 0 1px 1px gray; 
		-moz-box-shadow: 0 1px 1px gray; 
		}
	.project-list h1 { border: none; padding-top: 0; float: none; width: 100%; }
	#primary .project-list h2 { margin: .5em 0;  font-size: 16px; font-size: 1.6rem; }
	.project-list .about-project { width: 100%; float: none; }
	.project-list li a { font-size: 18px; font-size: 1.8rem; }
	.project-list p { margin-top: .5em; }
	#single-post img, #single-post object, #single-post iframe { max-width: 100%; }
	.category #primary h1, .archive #primary h1, .search-results h1 {
		font-size: 30px; 
		font-size: 3.0rem;
	}
	.category #primary h2 { font-size: 16px; font-size: 1.6rem; }
	.category #primary ol.post-list .date, .archive #primary ol.post-list .date, .search-results #primary ol.post-list .date {
		margin-top: 1em;
	}
	#branding.navOn {
		margin-top: 201px;
		}
	#branding.navOn .menu-main-menu-container {
		height: 195px;
		}
	#branding .menu-main-menu-container {
		height: 0;
		}
	#menu-main-menu li {
		float: none;
		width: 100%;
		}
	#menu-main-menu li a {
		text-shadow: 0 1px 0 white;
		}
	
	.darrow {
		position: relative;
		top: -2px; 
		background: white; 
		padding: 4px 10px 5px; 
		border-radius: 80px; 
		box-shadow: 0 1px 1px gray; 
		-webkit-box-shadow: 0 1px 1px gray; 
		-moz-box-shadow: 0 1px 1px gray;
		}
	#primary .post-link a { opacity: 1; color: silver; }
	#primary #prev-next-nav { padding: 20px 0 10px; margin: 0; font-size: 18px; font-size: 1.8rem; text-align: left; }
	#primary ol.post-list li { padding: 20px 0; }
	#secondary .projects li img { width: 100%; }
	#main-content, .entry-content, .news-content {
	margin-top: 2em;
	text-align: left;
	padding-top: 1.75em;
	padding-right: 5.33%;
	padding-bottom: 1.75em;
	padding-left: 5.33%;
}
	h3.comments-toggle { margin-bottom: 0em; }
	h3.comments-toggle.out { margin-bottom: 1em; }
	.category-work #branding { margin-bottom: 2em; }
	.category #primary ol.post-list .date, 
	.archive #primary ol.post-list .date, 
	.search-results #primary ol.post-list .date {
		font-size: 12px; font-size: 1.2rem;
		}
	
}

.skip-link, .assistive-text { display: none; }
.wf-chaparralpro-n4-active.wf-chaparralpro-i4-active.wf-chaparralpro-n7-active.wf-chaparralpro-i7-active.wf-ratio-n4-active.wf-ratio-i4-active.wf-ratio-n5-active.wf-ratio-i5-active.wf-active .archive.category.category-work.category-33.single-author #colophon div table {
	text-align: center;
}
.wf-chaparralpro-n4-active.wf-chaparralpro-i4-active.wf-chaparralpro-n7-active.wf-chaparralpro-i7-active.wf-ratio-n4-active.wf-ratio-i4-active.wf-ratio-n5-active.wf-ratio-i5-active.wf-active .archive.category.category-work.category-33.single-author #colophon div table {
	text-align: center;
}
.wf-chaparralpro-n4-active.wf-chaparralpro-i4-active.wf-chaparralpro-n7-active.wf-chaparralpro-i7-active.wf-ratio-n4-active.wf-ratio-i4-active.wf-ratio-n5-active.wf-ratio-i5-active.wf-active .archive.category.category-work.category-33.single-author #colophon div .bj .bj {
	text-align: center;
}
.wf-chaparralpro-n4-active.wf-chaparralpro-i4-active.wf-chaparralpro-n7-active.wf-chaparralpro-i7-active.wf-ratio-n4-active.wf-ratio-i4-active.wf-ratio-n5-active.wf-ratio-i5-active.wf-active .archive.category.category-work.category-33.single-author #colophon div .bj {
	text-align: center;
}
.wf-chaparralpro-n4-active.wf-chaparralpro-i4-active.wf-chaparralpro-n7-active.wf-chaparralpro-i7-active.wf-ratio-n4-active.wf-ratio-i4-active.wf-ratio-n5-active.wf-ratio-i5-active.wf-active .archive.category.category-work.category-33.single-author #colophon div .bj {
	text-align: center;
}
/* index ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
*{ margin:0; padding:0; list-style:none;}
.navigation{ width:100%; height:40px; line-height:40px; margin:5px auto;}
.navigation li a{ color:#fff; text-decoration:none; display:block; float:left; height:30px; line-height:30px; padding:0px 15px; font-family: 微软雅黑; font-size:15px;background:#636871;}
.navigation li a:hover{ background:#4b505a;}
.navigation li{
	float: left;
	position: relative;
	width: 120px;
	height: 30px;
	line-height: 30px;
	font-family: "微软雅黑";
    font-size:16px; color:#096;"
}
.navigation li .second{position:absolute;left:0;display:none;}