/*
Theme Name:Piano Black
Theme URI:
Description:This theme supports widget, threaded-comments, theme-options,and translation is ready. Also including page-navigation and multi level dropdown menu.You can see live demo including more information here http://www.mono-lab.net/demo3/
Author:mono-lab
Author URI:http://www.mono-lab.net
Version:1.3
Tags: black, two-columns, fixed-width, theme-options, threaded-comments, translation-ready

------ basic -------------------*/
BODY
{
	margin: 0;
	padding: 0;
	background: url(img/back1.gif);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #B8BABB;
	text-align: center;
}
A IMG
{
	border: none;
}
A, A:visited
{
	color: #7F8E91;
	text-decoration: none;
	outline: none;
}
A:hover
{
	color: #81C8D5;
	text-decoration: underline;
}
P
{
	margin: 0 0 1em;
	padding: 0;
	line-height: 160%;
}
UL
{
	list-style-type: none;
	margin: 0 0 1em;
	padding: 0;
	line-height: 0%;
}
UL LI
{
	margin: 0;
	padding: 0;
	line-height: normal;
}
OL
{
	margin: 0 0 1em 19px;
	padding: 0;
}
* HTML OL
{
	margin: 0 0 1em 23px;
	padding: 0;
}
OL LI
{
	padding: 0 0 5px;
}
FORM, TABLE, INPUT, TEXTAREA, DL, DT, DD
{
	margin: 0;
	padding: 0;
}
TABLE
{
	border-collapse: collapse;
	border: 0;
	width: 100%;
}
BLOCKQUOTE
{
	margin: 0 0 1em;
	padding: 15px 20px 0;
	border: 1px solid #333;
	background: #222;
}
BLOCKQUOTE A, BLOCKQUOTE A:visited
{
	text-decoration: underline;
}
PRE
{
	border: 1px solid #333;
	background: #222;
	padding: 10px 20px;
	margin: 0 0 1em;
	overflow: auto;
}
OBJECT
{
	display: block;
	margin: 0 auto;
}
.wp-caption-text
{
	text-align: center;
}
.alignright
{
	float: right;
}
.alignleft
{
	float: left;
}
.aligncenter
{
	margin-left: auto;
	margin-right: auto;
}
.centered
{
	margin-left: auto;
	margin-right: auto;
}
.clear
{
	clear: both;
}
/*------ layout ------------------------*/
#wrapper
{
	background: url(img/back2.png) no-repeat center top;
}
#contents
{
	width: 959px;
	margin: 0 auto;
	text-align: left;
}
#header
{
	background: url(img/top.png) no-repeat bottom;
	height: 160px;
	margin-bottom: -50px;
	margin-top: 0;
}
#middle-contents
{
	background: url(img/side.png) repeat-y;
	padding-bottom: 50px;
}
#left-col
{
	float: left;
	display: inline;
	width: 584px;
	margin: 0 0 0 5px;
}
#right-col
{
	float: right;
	display: inline;
	width: 330px;
	margin: 70px 5px 0 0;
}
#footer
{
	background: url(img/bottom.png) no-repeat top;
	height: 114px;
	margin-bottom: 50px;
}
/*------ header ----------------------
Change the number of margin if you are using original logo image*/
#logo_image
{
	margin: 69px 0 0 30px;
	float: left;
	display: inline;
}
#logo_image H1
{
	margin: 0;
	padding: 0;
}
/*blog title*/
#logo
{
	float: left;
	display: inline;
	margin: 64px 0 0 40px;
}
#logo A, #logo A:visited
{
	color: #CCC;
	font-size: 22px;
}
#logo A:hover
{
	text-decoration: none;
	color: #83BAC4;
}
#logo H1
{
	font-weight: normal;
	line-height: 100%;
	margin: 0;
	padding: 6px 0;
	color: #666;
	font-size: 11px;
}
#rss-feed
{
	font-size: 11px;
	float: right;
	margin: 62px 10px 0 0;
	display: inline;
	color: #777;
	background: url(img/rss.gif) no-repeat left top;
	height: 25px;
	width: 80px;
	padding: 18px 0 0 60px;
}
#rss-feed:hover
{
	background: url(img/rss.gif) no-repeat left bottom;
	color: #83BAC4;
	text-decoration: none;
}
#search-area
{
	float: right;
	display: inline;
	width: 183px;
	height: 29px;
	margin: 70px 47px 0 0;
	background: url(img/search-area.gif) no-repeat;
}
#search-input
{
	float: left;
	margin: 8px 0 0 24px;
	border: 0px solid #020202;
	height: 17px;
	display: inline;
	width: 125px;
	font-size: 12px;
	color: #7E7E7E;
	background: transparent;
}
#search-button
{
	float: right;
}
/*------ left-col -------------*/
.post
{
	margin: 0px 0 5px 35px;
}
.post H2
{
	margin: 0 0 4px;
	padding: 0;
	line-height: 100%;
}
.post H2 A, .post H2 A:visited, #single H2
{
	color: #CCC;
	font-size: 16px;
	line-height: 120%;
	font-weight: normal;
}
.post H2 A:hover
{
	text-decoration: none;
	color: #83BAC4;
}
.post-info
{
	margin: 0;
}
.post-info LI
{
	display: inline;
	font-size: 11px;
	color: #797F80;
	margin: 0 10px 0 0;
}
.write-comment
{
	background: url(img/arrow1.gif) no-repeat left center;
	padding: 0 0 0 11px;
}
.post-info A, .post-info A:visited
{
	color: #777;
}
.post-info A:hover
{
	color: #83BAC4;
}
.post-content
{
	clear: both;
	padding: 15px 0 40px;
	line-height: 160%;
}
.post-content P
{
	margin: 0 0 1em;
	line-height: 160%;
}
.post-content A, .post-content A:visited
{
	text-decoration: underline;
}
.post-content A.more-link, .post-content A.more-link:visited
{
	display: block;
	clear: both;
	margin: 15px 0 5px;
	height: 23px;
	padding: 6px 0 0 35px;
	background: url(img/arrow3.gif) no-repeat left top;
	text-decoration: none;
}
.post-content A.more-link:hover
{
	background: url(img/arrow3.gif) no-repeat left bottom;
	text-decoration: none;
}
.post IMG, .post A IMG
{
	padding: 0px;
	margin: 0;
}
.post A:hover IMG
{
	border: 1px solid #FFFFFF;
	background: #59847D;
}
.post IMG.centered, DIV.centered
{
	display: block;
	margin: 0 auto;
}
.post IMG.aligncenter, DIV.aligncenter
{
	display: block;
	margin: 0 auto;
}
.post IMG.alignright, DIV.alignright
{
	margin: 4px 0 10px 10px;
	display: inline;
}
.post IMG.alignleft, DIV.alignleft
{
	margin: 4px 10px 10px 0;
	display: inline;
}
.post IMG.wp-smiley
{
	border: 0px solid #000000;
	padding: 0px;
	margin: 0px;
	background: none;
}
.post TABLE
{
	margin: 0 0 1em;
}
.post TD, .post TH
{
	border: 1px solid #333;
	padding: 15px;
}
.post TH
{
	background-color: #000;
	font-weight: normal;
}
.post-content UL LI
{
	margin: 0;
	line-height: 160%;
	background: url(img/bullet1.gif) no-repeat left 9px;
	padding: 0 0 0 12px;
}
.post-content INPUT
{
	margin: 5px 0;
}
.post-meta
{
	background: url(img/meta-top.gif) no-repeat right top;
	padding: 13px 0 0;
	width: 585px;
}
.post-meta UL
{
	background: url(img/meta-bottom.gif) no-repeat right bottom;
	padding: 0 10px 10px 30px;
	line-height: 0%;
}
.post-meta LI
{
	display: inline;
	font-size: 11px;
	line-height: 140%;
}
.post-category
{
	float: left;
	width: 345px;
	background: url(img/category-icon.gif) no-repeat 2px 2px;
	padding: 0 0 1px 20px;
}
.post-tag
{
	float: left;
	width: 345px;
	background: url(img/tag-icon.gif) no-repeat 2px 2px;
	padding: 0 0 1px 29px;
}
.post-comment
{
	float: right;
	width: 80px;
	background: url(img/write-comment.gif) no-repeat left top;
	padding: 0 10px 2px 22px;
}
#back-top
{
	padding: 10px 5px 0 15px;
	font-size: 11px;
	background: url(img/arrow5.gif) no-repeat left 16px;
	float: right;
	color: #777;
}
#back-top:hover
{
	text-decoration: none;
	color: #83BAC4;
}
/*------ right-col -------------*/
#information-title
{
	background: url(img/info-box-top.gif) no-repeat left top;
	padding: 25px 20px 5px;
	width: 232px;
	margin: 0 0 0 30px;
}
.information-contents
{
	line-height: 160%;
	font-size: 11px;
	color: #868A8D;
	background: url(img/info-box-bottom.gif) no-repeat left bottom;
	padding: 12px 20px 20px;
	margin: 0 0 50px 30px;
	width: 232px;
}
.side-title
{
	margin: 0 0 20px;
	font-size: 11px;
	text-transform: uppercase;
	color: #FFF;
	font-weight: normal;
	line-height: 100%;
}
.side-box
{
	color: #FFF;
	margin: -20px 50px 32px;
	font-size: 11px;
	width: 270px;
}
#right-col UL
{
}
#right-col LI
{
	margin: 0 0 1em;
	line-height: 140%;
}
#right-col LI LI
{
	padding: 0 0 0 10px;
	margin: 3px 0;
	background: url(img/bullet1.gif) no-repeat 1px 7px;
}
#side-left
{
	float: left;
	width: 128px;
	padding: 0 0 0 32px;
}
#side-right
{
	float: right;
	width: 120px;
	padding: 0 30px 0 10px;
}
.side-box-short
{
	margin: 0 0 50px;
	width: 130px;
	font-size: 11px;
	color: #AAA;
}
#side-bottom
{
	clear: both;
}
/*this is just for default mode*/
#side-left-ex
{
	float: left;
	width: 128px;
	padding: 0 0 0 32px;
}
#side-right-ex
{
	float: right;
	width: 120px;
	padding: 0 30px 0 10px;
}
#side-bottom-ex
{
	clear: both;
}
/*calendar*/
#wp-calendar
{
	margin: 0 auto;
	width: 100%;
	color: #777;
}
#wp-calendar TH, #wp-calendar TD
{
	border: 1px solid #333;
	padding: 0;
	width: 14%;
	line-height: 220%;
	text-align: center;
}
#wp-calendar TH
{
	line-height: 100%;
	padding: 4px 0 2px;
	font-weight: normal;
	background: #000;
}
#wp-calendar TD A, #wp-calendar TD A:visited
{
	display: block;
	text-decoration: underline;
}
#wp-calendar TD A:hover
{
}
#wp-calendar CAPTION
{
	padding: 8px 0;
}
#wp-calendar TFOOT TD
{
	border: none;
	padding: 5px 0;
}
#wp-calendar #prev A, #wp-calendar #prev A:visited, #wp-calendar #next A, #wp-calendar #next A:visited
{
	text-decoration: none;
	background: none;
}
#wp-calendar #prev A:hover, #wp-calendar #next A:hover
{
	text-decoration: underline;
}
#wp-calendar TD#today
{
	background: #111;
	text-decoration: underline;
	color: #81C8D5;
}
#copyrights
{
	color: #777;
	border-left: 3px solid #444;
	padding: 1px 0 0 8px;
	clear: both;
}
#copyrights LI
{
	margin: 0;
	padding: 0;
	line-height: 160%;
}
#copyrights A, #copyrights A:visited
{
	color: #777;
}
#copyrights A:hover
{
	color: #849CA0;
}
#copyrights #wp A
{
	text-decoration: underline;
}
#return_top A
{
	position: absolute;
	position: fixed;
	right: 0;
	bottom: 15px;
	display: block;
	height: 138px;
	width: 38px;
	background: url(img/return-top.png) no-repeat left top;
}
#return_top A:hover
{
	background: url(img/return-top.png) no-repeat right top;
	text-decoration: none;
}
/*------ archive -------------*/
.archive, .search-page
{
	margin: 25px 0 25px 30px;
	border-left: 3px solid #555;
	padding-left: 10px;
}
.archive H2, .search-page H2
{
	font-size: 14px;
	color: #FFF;
	margin: 0 0 3px;
	display: block;
	line-height: 120%;
	font-weight: normal;
	padding: 0;
}
.archive P, .search-page P
{
	font-size: 12px;
}
.read-more
{
	padding: 0;
}
/*------ page navi --------------*/
.page-navi, .next-previous-navi
{
	margin: 50px 0 25px 30px;
}
#comment-pager
{
	margin: 20px 0 0;
}
.page-navi LI
{
	line-height: 0%;
	display: block;
	float: left;
}
.page-navi A, .page-navi A:visited, .page-navi A:hover, .page-navi SPAN.pages, .page-navi SPAN.extend, .page-navi SPAN.current, .page-navi SPAN.dots
{
	font-size: 11px;
	line-height: 100%;
	margin: 0 -1px 25px 0;
	padding: 2px 14px;
	display: block;
	float: left;
	border-right: 1px solid #555;
	border-left: 1px solid #555;
}
.page-navi SPAN.current
{
	color: #81C8D5;
	background: url(img/arrow8.gif) no-repeat center bottom;
	padding-bottom: 10px;
	border: none;
}
.page-navi A.prev, .page-navi A:hover.prev, .page-navi A:visited.prev
{
	border-left: none;
}
.page-navi A.next, .page-navi A:hover.next, .page-navi A:visited.next
{
	border-right: none;
}
#previous-page A, #previous-page A:visited
{
	float: left;
	display: inline;
	margin: 5px 0 10px 5px;
	height: 22px;
	padding: 7px 0 0 40px;
	background: url(img/arrow2.gif) no-repeat left top;
}
#previous-page A:hover
{
	background: url(img/arrow2.gif) no-repeat left bottom;
	text-decoration: none;
}
#next-page A, #next-page A:visited
{
	float: right;
	display: inline;
	margin: 5px 0 10px;
	height: 22px;
	padding: 7px 40px 0 0;
	background: url(img/arrow3.gif) no-repeat right top;
}
#next-page A:hover
{
	background: url(img/arrow3.gif) no-repeat right bottom;
	text-decoration: none;
}
/*------ header for category/archive/search/...etc  -------------*/
.common-navi-wrapper
{
	background: url(img/archive-top.gif) no-repeat right top;
	padding: 13px 0 0;
	width: 585px;
	margin: 70px 0 0;
}
.common-navi-wrapper P
{
	background: url(img/archive-bottom.gif) no-repeat right bottom;
	padding: 0 10px 10px 32px;
	margin: 0;
	line-height: 140%;
}
#archve-title
{
	margin: 0 0 0 13px;
}
#search-hit
{
}
/*------ page widthout side ------------------------*/
#no-side
{
	background: url(img/side-noside.png) repeat-y;
	padding: 60px 0;
}
#no-side .post
{
	margin: 0 40px 20px;
}
#footer-noside
{
	background: url(img/bottom-noside.png) no-repeat top;
	height: 114px;
	margin-bottom: 50px;
}
/*------ header-menu ------------------------*/
.header-menu-wrapper
{
}
#pngfix-right
{
	background: url(img/menu_right.png) no-repeat right top;
	display: block;
	width: 10px;
	height: 60px;
	float: right;
}
#pngfix-left
{
	background: url(img/menu_left.png) no-repeat left top;
	display: block;
	width: 10px;
	height: 60px;
	float: right;
}
UL.menu
{
	float: right;
	background: url(img/menu_middle.png) repeat-x left top;
	font-size: 11px;
	height: 61px;
	margin: 0;
}
UL.menu, UL.menu UL
{
	line-height: 1;
	margin: 0;
	padding: 0;
}
UL.menu LI
{
	position: relative;
	float: left;
	border-left: 1px solid #222;
	height: 55px;
	padding: 0 18px;
	z-index: 100;
}
UL.menu UL LI
{
	height: auto;
	border-left: none;
	padding: 0;
	left: auto;
}
UL.menu #header-menu-home
{
	border: none;
}
UL.menu A, UL.menu A:visited
{
	color: #888;
	display: block;
	padding: 0 15px;
	line-height: 49px;
	position: relative;
	top: 5px;
}
UL.menu A:hover
{
	color: #83BAC4;
	border-bottom: 2px solid #83BAC4;
	text-decoration: none;
}
UL.menu UL
{
	position: absolute;
	top: 52px;
	left: 0;
	display: none;
	opacity: 0;
	width: 200px;
}
UL.menu UL A, UL.menu UL A:visited
{
	background: #000;
	line-height: 140%;
	padding: 9px 30px 8px;
	border: 1px solid #222;
	width: 128px;
	margin: -1px 0 0;
}
UL.menu UL A:hover
{
	background: #222;
	border-bottom: 1px solid #222;
}
UL.menu UL UL
{
	margin: -34px 0 0 189px;
	top: 34px;
}
UL.menu .current_page_item A, UL.menu .current_page_item A:visited
{
	color: #869497;
	border-bottom: 2px solid #627376;
}
UL.menu .current_page_item A:hover
{
	color: #83BAC4;
	border-bottom: 2px solid #83BAC4;
	text-decoration: none;
}
UL.menu .current_page_item UL A, UL.menu .current_page_item UL A:visited, UL.menu .current_page_item UL A:hover
{
	border-bottom: 1px solid #373737;
}
/*---------- clearfix hack ----------*/
.clearfix:after
{
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix
{
	display: inline-block;
}
/*exlude MacIE5 \*/
* HTML .clearfix
{
	height: 1%;
}
.clearfix
{
	display: block;
}
/*end MacIE5*/
