@charset "UTF-8";

/* Tags Definition */
* {
    margin: 0;
    padding: 0;
}

body {
    text-align: center;
    background-color: #EEF;
    line-height: 1.2;
    font-size: 0.9em;
    color: #333;
}

h1 {
    font-size: 2em;
}

ul {
    list-style: none;
}

img {
    border: none;
}

a {
    color: #33C;
}

a:hover {
    color: #F66;
}

label {
    cursor: pointer;
}

form {
    margin-bottom: 20px;
}

textarea {
    width: 350px;
}

strong {
    font-weight: bold;
}



/* General Classes */
.supplement {
    margin-bottom: 1em;
    color: #666;
    font-size: smaller;
}

.supplement ul {
    margin-left: 20px;
    list-style: disc;
}

.message {
    position: absolute;
    top: 10px;
    left: 300px;
    padding: 5px;
    border: 1px solid #F93;
    background-color: #FFF9F3;
    font-weight: bold;
    color: #F93;
}

ul.inline-nav {
    margin-bottom: 0.5em;
    text-align: center;
}

ul.inline-nav li {
    display: inline;
    padding: 0 5px;
}

.option {
    text-align: right;
    font-size: 0.8em;
}

.submit {
    margin-bottom: 1em;
}

.page-nav {
    text-align: right;
}

.page-nav .prev {
    float: left;
}

.page-nav .next {
    float: right;
}



/* Basic Layout */
#container {
    position: relative;
    margin: 0 auto;
    width: 808px;
    text-align: left;    
}

#header {
}

#body {
}

#content {
    margin-bottom: 15px;
    width: 588px;
    float: left;
}

#sidebar {
    margin-bottom: 15px;
    width: 208px;
    float: right;
}

#footer {
}



/* Header */
#header h1 {
    padding: 10px 0;
    float: left;
}

#header h1 a {
    display: block;
    width: 287px;
    height: 44px;
    background: url(../img/logo.png) no-repeat;
    text-indent: -999em;
    overflow: hidden;
    outline: none;
}

#usermenu {
    float: right;    
	margin: 5px 0 0 0;
    padding: 0 0 10px 0;
}

#usermenu li {
    display: inline;
    margin-right: 5px;
    font-size: 0.8em;
    padding: 2px 0 5px 0 ;
}

#usermenu li a {
    padding: 0 0 0 18px ;
}



/* Body */
#body {
}


/* Content */
#content {
    overflow: hidden;
    background: url(../img/bg-middle.png) left repeat-y;
}

#content h2 {
    padding: 15px 23px 20px 15px;
    background: url(../img/bg-top.png) left top no-repeat;
    font-size: 2em;
}

#content h2 a {
    text-decoration: none;
    color: #333;
}

#content-body {
    padding: 0 23px 30px 15px;
    background: url(../img/bg-bottom.png) left bottom no-repeat;
}

#flashMessage {
    display: none;
}    



/* Names */
.names {
    list-style: none;
    overflow: hidden;
}

.names li {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #999;
}

.names .jacket {
    display: block;
    float: left;
    width: 162px;
    text-align: center;
}

.names .jacket img {
    border: 1px solid #999;
}

.names a {
    color: #999;
}

.names a:hover {
    color: #F66;
}

.names h3 {
    margin-bottom: 10px;
    padding: 0 20px 0 177px;
    font-size: 1.6em;
    font-weight: bold;
}

.names h3 a {
    color: #333;
    text-decoration: none;
}

.names h3 a:hover {
    color: #F66;
}

.names ul {
    padding: 0 20px 0 197px;
}

.names li li {
    margin: 0 0 0 10px;
    padding: 0 0 5px 20px;
    border: none;
    font-size: 0.8em;
    color: #999;
}

/*
.names li li a,
.names li li span.anonymous {
    padding: 0 0 0 20px;
}
*/

.names li li.named_by {
    margin: 0;
    font-weight: bold;
}

.names li li.named_by a {
    color: #88D;
}

.names li li.named_by a:hover {
    color: #F66;
}

.named_by {
    background: url(../img/user.gif) 0 0 no-repeat;
}

.see_others {
    background: url(../img/book_open.gif) 0 0 no-repeat;
}

.name_this {
    background: url(../img/vcard_edit.gif) 0 0 no-repeat;
}

.see_original {
    background: url(../img/amazon.gif) 0 0 no-repeat;
}

.favorites {
    background: url(../img/heart.gif) 0 0 no-repeat;
}

.settings {
    background: url(../img/cog.gif) 0 0 no-repeat;
}

.login {
    background: url(../img/door_in.gif) 0 0 no-repeat;
}

.logout {
    background: url(../img/door_out.gif) 0 0 no-repeat;
}

.register {
    background: url(../img/vcard_add.gif) 0 0 no-repeat;
}

.names li li.favorites_by_users a {
    font-weight: bold;
    color: #88D;
}

.names li li.favorites_by_users a:hover {
    color: #F66;
}


.name-item .twitter-share-button {
    margin-bottom: 1px;
}
	

.names li li.hatena_star {
	margin-left: 7px;
    padding: 0;
}

.names li li.fb_like {
    padding: 5px 0 0 0;
}

.names li li.edit_this {
    margin: 0;
}

.edit_this {
    background: url(../img/pencil.png) 0 0 no-repeat;
}

.hatena-star-comment-container {
    display: none;
}



/* Jackets */
.jackets a {
    float: left;
    margin: 0 9px 20px 9px;
    width: 162px;
    height: 162px;
    text-align: center;
    outline: none;
}
    
.jackets img {
     border: 1px solid #999;
}

#search_more {
    clear: left;
    float: right;
    width: auto;
    margin: -20px 9px 0 9px;
    height: auto;
}

.jackets .ajax_msg {
    clear: left;
    float: right;
    margin-top: -20px;
}    

/* Sidebar */
#sidebar {
}

#sidebar li {
    margin-bottom: 10px;
    background: url(../img/sidebar-middle.png) right repeat-y;
}

#sidebar h3 {
    padding: 15px 20px 3px 12px;
    background: url(../img/sidebar-top.png) right top no-repeat;
    text-align: center;
    font-size: 0.8em;
}

#sidebar .sidebar-body {
    padding: 12px 20px 20px 12px;
    background: url(../img/sidebar-bottom.png) right bottom no-repeat;
    font-size: 0.8em;
}

#sidebar .sidebar-body ul {
    margin-bottom: 0.5em;
}

#sidebar .sidebar-body li {
    margin: 0 0 0 0;
    padding: 0 0 5px 20px;
    overflow: hidden;
    background: none;
}

#sidebar li.fb-likeBox {
	background: #FFF;
	width: 200px;
	box-shadow: 5px 5px 5px #BBB;
	-moz-box-shadow: 5px 5px 5px #BBB;
	-webkit-box-shadow: 5px 5px 5px #BBB;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	margin-bottom: 15px;
	padding: 0 0 10px;
}

#sidebar li.fb-likeBox h3 {
	background: #3B5998;
	border-radius: 8px 8px 0 0;
	-moz-border-radius: 8px 8px 0 0;
	-webkit-border-radius: 8px 8px 0 0;
	color: #FFF;
	padding: 7px;
}

#social-plugins {
    margin-top: 10px;
	text-align: center;
	overflow: hidden;
}

#social-plugins div {
	float: left;
	margin: 0 3px;
	height: 62px;
}

#sidebar .menu li {
    background: url(../img/control_play_blue.png) 0 0 no-repeat;
}

#sidebar li.named_by {
    background: url(../img/user.png) 0 0 no-repeat;
}

#sidebar li.their_website {
    background: url(../img/house.png) 0 0 no-repeat;
}

#sidebar li.their_comment {
    background: url(../img/comment.png) 0 0 no-repeat;
}

#sidebar li.favorites {
    background: url(../img/heart.png) 0 0 no-repeat;
}

.sidebar-jackets img {
    margin: 3px;
}

#sidebar li.sidebar-200 {
    padding: 0 8px 8px 0;
    background: url(../img/sidebar-200.png) right top no-repeat;
    overflow: hidden;    
}

.sidebar-more {
    margin: 0;
    text-align: right;
}

/* Footer */
#footer {
    text-align: center;
    font-size: 0.8em;
}



/* Item Search */
#searchresult img {
    margin: 10px;
    border: 1px solid #999;
}



/* User Info */
table.userinfo {
    margin-bottom: 20px;
}

table.userinfo th {
    padding-bottom: 10px;
    vertical-align: top;
    text-align: right;
    font-weight: normal;
}

table.userinfo td {
    padding-bottom: 10px;
    vertical-align: top;
    padding-left: 10px;
}



/* Document */
.document {
    line-height: 1.4;
    font-size: 0.9em;
}

.document ul {
    padding-left: 20px;
}

.document ul  {
    list-style: disc;
}
.document ul ul {
    list-style: circle;
}

.document li {
    margin-bottom: 1em;
}

.document li li {
    margin-bottom: 0.3em;
}


/* Clearfix */
#header:after,
#body:after,
.jackets:after,
.name-item:after,
.page-nav:after,
.clearfix:after {
    content: "";
    display: block;
    height: 0.01px;
    clear: both;
}

#header,
#body,
.jackets,
.name-item,
.page-nav,
.clearfix { display: inline-block; }

/* Hide from IE-mac \*/
* html #header,
* html #body,
* html .jackets,
* html .name-item,
* html .page-nav,
* html .clearfix { height: 1%; }

#header,
#body,
.jackets,
.name-item,
.page-nav,
.clearfix { display: block; }
/* End hide from IE-mac */

