/*
Theme Name: UJ Blog
Theme URI: http://www.uniquejapan.com
Description: Explain the mysteries that surround Japan, shed light on the unique aspects of everyday Japanese life, and introduce current trends that bridge modern life and tradition. Brought to you by Unique Japan.
Version: 1
Author: MarchForth International Ltd.  http://www.marchforth.com

*/

@import url("css/reset.css");

/* ---------- General ---------- */

body { font: 12px "Helvetica", Arial, Tahoma; color: #000000; background: #FFFFFF; }

a { text-decoration: none; color: #c41230; }
a:visited { text-decoration: none; color: #c41230; }
a:hover { text-decoration: underline; color: #c41230; }

p { margin: 0 0 15px 0; }

h1 { position: relative; width: 91px; height: 34px; }
h1 span { background: url(images/uj-logo.gif) no-repeat; position: absolute; width: 100%; height: 100%; }
h2 { font-size: 18px; margin: 0 0 5px 0; }

form {}

#page { margin: 0px auto; width: 950px; }

/* ---------- Header ---------- */

#header { position: relative; }

#headerimg { position: relative; padding: 15px 0 15px 0; }

#headerimg .description { position: relative; margin: 15px 0 0 0; width: 950px; height: 145px; }
#headerimg .description span { background: url(images/top-description.jpg) no-repeat; position: absolute; width: 100%; height: 100%; }

#nav { float: left; display: inline; list-style: none; }
#nav li { float: left; display: inline; border-left: 1px solid #b4b4b4; }
#nav a { float: left; display: inline; padding: 5px 15px 5px 15px; font-size: 12px; font-weight: bold; text-decoration: none; text-transform: uppercase; }
#nav a:visited {}
#nav a:hover { background: #b4b4b4; color: #ffffff; text-decoration: none; }

/* ---------- Post ---------- */

#content-wrapper { float: left; display: inline; width: 620px; }

#content { float: left; display: inline; width: 620px; }

.post { clear:both; padding-top: 10px; }
.post-date { float: left; margin: 1px 10px 0 0; font-size: 11px; color: #999999; }
.post-time { font-size: 11px; color: #999999; }
.post-author { margin: 0 10px 0 0; font-size: 11px; color: #999999; }
.post-cat { padding: 0 5px 0 5px;  font-size: 11px; color: #999999; border-right: 1px solid #b4b4b4; }
.post-comments { padding: 0 5px 0 5px;  font-size: 11px; color: #999999; border-right: 1px solid #b4b4b4; }
.post-calendar { font-size: 11px; color: #999999; }

.post-title { float: left; display: inline; width: 620px; }
.post-title h2 { color: #c41230; }
.post-title-divider { clear: both; position: relative; margin: 0 0 8px 0; background: url(images/post-title-divider.gif) repeat-x; height: 1px; width: 620px; }

.post-content { clear: both; }

.entry { clear: both; padding:15px 0 0 0; }

.navigation { clear: both; padding: 10px 0px; }
.navigation a, .navigation a:visited {}
.previous-entries { float: left; padding-left: 12px; background: url(images/prev-arrow.gif) no-repeat 0.2em left; }
.next-entries { float: right; padding-right: 12px; background: url(images/next-arrow.gif) no-repeat 0.2em right; }

/* ---------- Comments ---------- */

#comments, #respond { font-weight: bold; color: #c41230; padding-bottom: 5px; }

.commentlist {
	margin: 10px 0px;
	padding-left: 20px;
	line-height: 130%;
}
.commentlist li{
	padding: 5px 10px;
	position: relative;
}
.commentlist .avatar {
	position: absolute;
	top: 5px;
	right: 5px;
	border: solid 1px #ededed;
	padding: 1px;
	background: #fff;
}
.commentlist .alt {
	background: #f5f5f5;
}
.commentlist cite, .commentlist cite a, .commentlist cite a:visited {
	font-weight: bold;
	font-style: normal;
	font-size: 120%;
	color: #c41230;
}
.commentlist small {
	margin-bottom: 5px;
	display: block;
	font-size: 87%;
}
#commentform {
	margin-top: 10px;
	font: 110% Arial, Helvetica, sans-serif;
}
#commentform p {
	padding: 6px 0px;
	margin: 0px;
}
#commentform label{
	font-weight: bold;
	color: #666666;
	font-size: 100%;
}
#commentform input{
	width: 153px;
	background:#ebebeb;
	border: 1px solid #cccccc;
	padding: 3px;
	margin-top: 3px;
}
#commentform textarea{
	width: 478px;
	height: 115px;
	background:#ebebeb;
	border: 1px solid #cccccc;
	padding: 2px;
	margin-top: 3px;
}
#commentform textarea:focus, #commentform input[type="text"]:focus {
	background: #ffffff;
}
#commentform #submit{
	background: #bdbdbd;
	font: bold 12px Arial, Helvetica, sans-serif;
	color: #ffffff;
	border: none;
	float:left;
	width: 144px;
	height: 29px;
}

/* ---------- Aside ---------- */

#aside { float: right; display: inline; margin: 0 0 20px 0; width: 300px; }
#sidebar { float: right; display: inline; width: 300px; }

/* ---------- Search form ---------- */

#searchform { float: right; display: inline; background: #e2e2e2; width: 290px; padding: 10px 0 10px 10px; }
#searchform #s { width: 140px; height: 17px; padding: 2px 5px 0px 5px; margin: 0 5px 0 5px; border: 1px solid #bdbdbd; background: #ffffff; vertical-align: middle; }
#searchform #searchsubmit {
	background: #bdbdbd url(images/go-button.gif) no-repeat;
	padding: 1px 0 0 5px;
	border: none;
	width: 50px;
	height: 21px;
	font: bold 12px "Helvetica", Arial, Tahoma;
	color: #FFFFFF;
	vertical-align: middle;
	cursor: hand;
	}
#searchform label { font-weight: bold; color: #999999; }

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

#sidebar h3 { margin: 15px 0 10px 0; font-weight: bold; text-transform: uppercase; color: #999999; }
.sidebar-divider { clear: both; position: relative; background: url(images/post-title-divider.gif) repeat-x; height: 1px; width: 300px; }

.recent-posts { list-style: none; line-height: 110%; }
.recent-posts li { padding: 0px 0px 10px 0; }
.recent-posts a {}

.ul-cat {
	list-style: none;
	margin:0px 0px 15px;
	padding:0px;
	border-bottom: 1px solid #dceeb7;
}
.ul-cat li{
	margin: 0px;
	padding: 2px 0px 2px 20px;
	border-top: 1px solid #dceeb7;
	background: url(images/mini-category.gif) no-repeat left center;
}
.ul-cat li a, .ul-cat li a:visited{
	color: #495233;
	text-decoration: none;
}
.ul-cat li a:hover{
	color: #FF6600;
	text-decoration: none;
}
.ul-archives {
	list-style: none;
	margin:0px 0px 15px;
	padding:0px;
	border-bottom: 1px solid #dceeb7;
}
.ul-archives li{
	margin: 0px;
	padding: 2px 0px 2px 20px;
	border-top: 1px solid #dceeb7;
	background: url(images/mini-monthly-archive.gif) no-repeat left center;
}
.ul-archives li a, .ul-archives li a:visited{
	color: #495233;
	text-decoration: none;
}
.ul-archives li a:hover{
	color: #FF6600;
	text-decoration: none;
}

#related-links { float: left; width: 300px; }
.align-left { float: left; }
.align-right { float: right; }.banner { clear: both; margin-top:15px ; }

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

#footer { float: left; display: inline; padding: 10px 0 0 0; width: 950px; height: 40px; border-top: 1px solid #cccccc; }
#footer p { font-weight: 11px; color: #999999; }
#footer a { font-weight: 11px; color: #999999; }

.rss-group { margin: 0 0 0 20px; }
.rss {}

/* ---------- Misc ---------- */

.clear {
	clear:both;
}
hr.clear {
	clear:both;
	visibility: hidden;
	margin: 0px;
	padding: 0px;
}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}
/* End Images */


/* ---------- Tagcloud ---------- */

.tagcloudwrapper { width: 300px; margin: 0 0 10px 0; line-height: 2em; }

.tagcloudwrapper a {}

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

#wp-calendar { width: 280px; margin: 0 auto 15px auto; color: #999999; }

#wp-calendar table { margin: 0 auto; width:280px;}

#wp-calendar #prev {
  text-align:left;
  padding: 0 0 0 10px;
}

#wp-calendar #next {
  text-align:right;
  padding: 0 10px 0 0; 
}

.ec3_eventday a {
 color:#c41230 !IMPORTANT;
}

#wp-calendar table td,
#wp-calendar table th {
  text-align:center;
}

#wp-calendar table td,
#wp-calendar table td.pad:hover,
#wp-calendar table.nav tr td {
 padding:1px;
 border:none;
}

#wp-calendar table td:hover,
#wp-calendar table #today {
 padding:0px;
 border:solid 1px #999;
}

#ec3_publish { display: none; } /* RSS */
#wp-calendar table caption { text-align: center; font-weight: bold; padding: 0px 0 10px 0; }

/* The EC graphic. */
.ec3_ec {
 display:block;
 float:right;
 border:none;
 width:13px;
 height:9px;
}
.ec3_ec span { display:none }


/* ---------- Popup ---------- */

.ec3_popup {
 margin:0 !IMPORTANT;
 padding:0 !IMPORTANT;
 border:none;
 position:absolute;
 border-collapse:collapse;
 filter:alpha(opacity=87);
 -moz-opacity:.87;
 opacity:.87;
 z-index:30000;
}

.ec3_popup td {
 padding:0;
}

.ec3_popup table {
 border:solid #999 1px;        /* popup border */
 background-color:#eeb;        /* popup background colour */
 font-size:x-small;            /* popup font size */
 color:black;
 text-align:left;
}

.ec3_popup table td {
 padding:1.5px 3px 1.5px 3px;
}

#ec3_shadow0 div { width:8px; height:32px; }
#ec3_shadow0 {
 margin:0;
 padding:0;
 border:none;
 width:8px;
 background-repeat:no-repeat;
 background-position:bottom right;
 vertical-align:bottom;
}

#ec3_shadow1 {
 margin:0;
 padding:0;
 border:none;
 height:16px;
 background-repeat:repeat-x;
}

#ec3_shadow2 div { width:8px; height:32px; }

#ec3_shadow2 {
 margin:0;
 padding:0;
 border:none;
 width:8px;
 background-repeat:no-repeat;
 background-position:bottom left;
 vertical-align:bottom;
}

/* ---------- Event List ---------- */

.ec3_list {
 margin-left:-12px;
 word-spacing:-1px;
 letter-spacing:-0.2px;
 color:#800;
}

.ec3_list li {
 font-size:1em !IMPORTANT;
}

.ec3_list li:before {
 content:"" !IMPORTANT;
}

/* ---------- Schedule ---------- */

table.ec3_schedule {
 border-collapse:collapse;
 margin:0.5ex 1ex 0.5ex 0;
 border:solid 1px #800;
 float:left;
}

table.ec3_schedule td {
 padding:0 0.5ex 0 0.5ex;
 color:#800;
}

td.ec3_start { text-align:right; }

td.ec3_to    { text-align:center; }
