/*
Theme Name: Guopeng Liang Design
Theme URI: http://www.guopengliang.com
Description: Guopeng Liang Design official theme
Version: 0.66
Author: Guopeng Liang
Author URI: http://www.guopengliang.com
Tags: portfolio, pictures, images, simple, clean
*/



/* Global
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

* { margin:0; padding:0; }

body {
	background:#efefef url(images/background.jpg) center top no-repeat;
	font:62.5%/1.8em "Lucida Grande", Tahoma, "Trebuchet MS";
	color:#272727;
}

a:link, a:visited { color:#272727; text-decoration:none; }
a:hover, a:active { color:#272727; text-decoration:underline; }

ul, ol { list-style:none; }

img { border:none; }

.clearer { clear:both; }
.clearer.line { margin:0 auto; width:920px; border-top:1px solid #ccc; }
.clearer.line2 { margin:0 auto; width:920px; border-top:1px dashed #ccc; }

.aligncenter { display:block; margin-left:auto; margin-right:auto; }
.alignleft { float:left; }
.alignright { float:right; }



/* Page & Header #
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#page { margin:30px auto 10px; width:1000px; }

#header { height:50px; }

#sitelogo {
	float:left;
	width:420px;
	height:50px;
	font-size:3em;
	font-weight:normal;
	text-transform:uppercase;
}
#sitelogo a:hover { color:#369; }

#searchbox {
	float:right;
	position:relative;
	right:40px;
	bottom:20px;
}
#searchbox input {
	padding:2px 5px;
	width:180px;
	height:16px;
	font-size:1.2em;
	color:#c3c3c3;
	border:1px solid #c3c3c3;
	background:transparent;
}
#searchbox input:hover, #searchbox input:focus {
	color:#888;
	border:1px solid #ccc;
	background:#f6f6f6;
}

#sitenav {
	clear:right;
	float:right;
	margin-right:40px;
	font-size:1.2em;
	text-transform:uppercase;
	color:#888;
}
#sitenav li {
	display:inline;
	float:left;
	padding-left:15px;
}
#sitenav li a { color:#888; }
#sitenav li a:hover { color:#369; }
#sitenav .current_page_item a {
	color:#369;
	font-weight:bold;
	text-decoration:none;
	border-bottom:2px solid #369;
}



/* Coda Slider
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* These 2 lines specify style applied while slider is loading */
.csw { overflow:hidden; width:100%; height:600px; }
.csw .loading { margin:0; text-align:center; }

.stripViewer2 {
	overflow:hidden;
	position:relative;
	width:920px;
	height:600px;
}
.panelContainer { position:relative; }

.stripNavL { float:left; }
.stripNavR { float:right; }
.stripNavL a { display:block; width:40px; background:url(images/arrow_left.png) -40px 50% no-repeat; }
.stripNavL a:hover { background:url(images/arrow_left.png) 0 50% no-repeat; }
.stripNavR a { display:block; width:40px; background:url(images/arrow_right.png) 0 50% no-repeat; }
.stripNavR a:hover { background:url(images/arrow_right.png) -40px 50% no-repeat; }
.index .stripNavL a, .index .stripNavR a { height:600px; }
.single .stripNavL a, .single .stripNavR a { height:300px; }



/* Mid
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#mid {
	width:1000px;
	margin:10px auto;
	padding:10px 0;
	background:transparent url(images/indexbg.png) no-repeat 50% 0;
}
#mid.single { background-image:url(images/singlebg.png); }

.panel {
	float:left;
	position:relative; 
	width:920px;
	height:600px;
	color:#efefef;
}
.panel-single {
	position:relative; 
	margin:0 auto;
	width:920px;
	height:300px;
}

.project-thumb {
	float:left;
	margin:0 10px 10px;
	padding:10px;
	width:200px;
	height:230px;
	background:transparent url(images/thumbbg.png) no-repeat 0 0;
}
.project-thumb .image { width:200px; height:200px; }
.project-thumb .metadata {
	padding-top:5px;
	width:200px;
	height:25px;
	color:#666;
	line-height:1.5em;
	font-weight:bold;
}
.project-thumb a { color:#666; }
.project-thumb span { float:right; font-weight:normal; }

.post-title, .entry {
	padding:8px 15px;
	width:880px;
	position:absolute;
	bottom:5px;
	left:5px;
	z-index:100;
	background:transparent url(images/titlebg.png) repeat 0 0;
	font-size:2em;
}
.post-title p {
	margin-top:5px;
	font-size:12px;
	line-height:15px;
}
.post-title span {
	float:right;
	padding-left:10px;
	font-size:0.55em;
	color:#888;
}
.post-title span a { color:#888; }
.post-title span a:hover { color:#ccc; }

.post-title a, .entry a {
	color:#efefef;
	text-decoration:none;
}

.entry ul {
	margin:5px 0 10px 0;
	font-size:0.6em;
}
.entry li {
	padding:5px 0 7px 0;
	border-bottom:1px solid #3b3b3b;
}
.entry a:hover { color:#c6c6c6; }
.entry .rss-big {
	padding-right:24px;
	background:transparent url(images/rss.png) no-repeat 100% 60%;
}



/* Content
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#content {
	margin:0 auto;
	width:920px;
	font-size:1.2em;
}
#content.portfolio, #content.archive, #content.search { width:960px; }

#content em, #content label {
	font-size:0.8em;
	font-weight:bold;
	font-style:normal;
	text-transform:uppercase;
	color:#888;
}
#content label { font-weight:normal; }
#content label em { font-size:1em; }

#content input, #content textarea, #content select {
	padding:5px;
	font-family:"Lucida Grande", Tahoma, "Trebuchet MS";
	font-size:1em;
	background-color:#f6f6f6;
	border:1px solid #c6c6c6;
}
#content select { padding:4px; }
#content option { margin:7px; }
#content #submit {
	font-size:0.8em;
	font-weight:bold;
	text-transform:uppercase;
	color:#888;
}
#content #submit:hover {
	color:#efefef;
	background-color:#888;
	border:1px solid #888;
}

h2 {
	padding:10px 0;
	font-size:1.5em;
	font-weight:normal;
	text-transform:uppercase;
	color:#bbb;
}
h2 a { color:#bbb !important; }
.portfolio h2, .archive h2, .search h2 {
	margin:25px 20px 10px;
	padding:0;
}
.portfolio h2 span, .archive h2 span, .search h2 span {
	display:block;
	font-size:0.667em;
	text-transform:none;
}



/* Subnav
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#subnav {
	margin:30px 0 10px;
	text-align:center;
	text-transform:uppercase;
	color:#888;
}
#subnav li { display:inline; }
#subnav li a {
	padding:10px 20px;
	color:#888;
	text-decoration:none;
}
#subnav li a:hover {
	color:#369;
	background-color:#e8e8e8;
}
#subnav .current_page_item a, #subnav a.current {
	color:#369;
	font-weight:bold;
	background-color:#e3e3e3;
}



/* Narrow Column, The Post, Post Meta & Sociable
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#narrow-column { float:left; width:660px; }
#narrow-column h3 { padding-bottom:10px; }
#narrow-column p { padding-bottom:10px; }

#thepost { padding:20px; }
#thepost a { color:#369; }
#thepost p { padding-bottom:10px; }
#thepost img { margin:5px 0; }

.postmetadata, .sociable { margin-top:10px; }
.sociable ul li { display:inline; margin-right:5px; }
.sociable img { width:16px; height:16px; }
.sociable-hovers {
	opacity:.6;
	-moz-opacity:.6;
	filter:alpha(opacity=60);
}
.sociable-hovers:hover {
	opacity:1;
	-moz-opacity:1;
	filter:alpha(opacity=100);
}



/* Comment
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#thecomments { padding:20px; border-top:1px solid #ccc; }
#thecomments p a { color:#369; }

#commentlist { margin-bottom:10px; }
#commentlist li { padding:15px 0 10px; border-bottom:1px dashed #ccc; }

#commentlist .children { margin:10px 0 0 43px; }
#commentlist .children li { padding-bottom:5px; border-top:1px dashed #ccc; border-bottom:none; }

#commentlist .comment-author .fn { font-weight:bold; font-style:normal; }
#commentlist .avatar { float:left; margin-right:7px; padding:3px; }

#commentlist .comment-meta { padding:0 0 0 45px; font-size:0.9em; color:#888; }
#commentlist .comment-meta a { color:#888; }
#commentlist a:hover, #commentlist a:hover em { color:#369; }

#commentlist p, #commentlist .reply { padding:10px 0 0 45px; }

#respond p { padding:0 0 10px; }
#respond .author { width:160px; }
#respond .email, #respond .url { width:220px; margin-left:10px; }
#respond #author { width:150px; }
#respond #email, #respond #url { width:210px; }
#respond #comment { width:610px; }

#commentlist #respond { margin:10px 0 0 45px; }
#commentlist #respond .author { width:145px; }
#commentlist #respond .email, #commentlist #respond .url { width:205px; margin-left:10px; }
#commentlist #respond #author { width:135px; }
#commentlist #respond #email, #commentlist #respond #url { width:195px; }
#commentlist #respond #comment { width:565px; }



/* Sidebar #
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#sidebar {
	float:right;
	padding:20px 0;
	width:240px;
	color:#888;
}
#sidebar a { color:#888; }
#sidebar a:hover { color:#369; }

.widget { margin-bottom:20px; }

#projectinfo { padding:0 0 20px 0; border-bottom:1px solid #ccc; }
#projectinfo li { margin:0 0 10px 0; line-height:1.25em; }



/* Footer #
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#footer {
	margin:0 auto;
	padding:10px 0;
	width:920px;
	text-align:right;
	line-height:1.2em;
	color:#9e9e9e;
	border-top:1px solid #ccc;
}
#footer a { color:#9e9e9e; }
#footer a.valid { padding-left:16px; background:transparent url(images/tick.png) 0 0 no-repeat; }
#footer a.valid:hover { background:transparent url(images/tick.png) 0 -12px no-repeat; }



/* Resume #
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.resume strong {
	float:right;
	margin-bottom:5px;
	width:730px;
	font-size:1.2em;
}
.resume ul { margin:10px 0 15px; list-style:disc; }
.resume ul li { margin-left:170px; }
.resume ul li:first-child { margin-left:0; list-style:none; }
.resume span { color:#369; }



/* Contact #
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.contact .author { width:240px; }
.contact .email, .contact .url { width:310px; }
.contact .purpose { width:140px; }
.contact .subject { width:730px; }
.contact .email, .contact .url, .contact .subject { margin-left:10px; }
.contact #author { width:230px; }
.contact #email, .contact #url { width:300px; }
.contact #purpose { width:140px; }
.contact #subject { width:720px; }
.contact #message { width:870px; height:250px; }



/* Calendar
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#wp-calendar {
	width:100%;
	background:#ebebeb;
	border:1px solid #ccc;
	margin:0;
	font-size:12px;
	text-align:center;
}
#wp-calendar caption {
	text-align:left;
	margin:10px 0;
	padding-top:10px;
	border-top:1px solid #c6c6c6;
	font-size:18px;
	font-weight:normal;
	text-transform:uppercase;
	color:#ccc;
}
#wp-calendar #today { background:#ccc; }
#wp-calendar a {
	display:block;
	width:100%;
	height:100%;
	border:none;
	padding:0;
}
#wp-calendar a:hover { background:#ccc; }