﻿/*  
Theme Name: Harapecco 2007021900
Theme URI: http://harapecco.com
Description: Theme for harapecco.
Version: 1.0
Author: Susumukatachi
Author URI: http://susumukatachi.jp
*/

/*-----------------------------------------------------------------------------------------------
  Global Styles
-----------------------------------------------------------------------------------------------*/
html {
	margin:0;
	padding:0;
	list-style-type:none;
}


*{
	margin:0;
	padding:0;
	list-style-type:none;
}

a{
/*color:#600; */
color:#993333;
text-decoration:underline;
}

a:hover{
color:#CC3333;
 text-decoration:none;
}

.hide{
visibility:hidden;
}

fieldset{
 padding:0 10px;
 display:block;
 border:1px solid #CCCCCC;
}

legend{
 font-weight:bold;
 padding:0 4px;
 color:#407fac;
}

.adminlinks-background{
background-color:#eee;
font-size:x-small;
float:right;
}

.adsense_big{
text-align:center;
margin:5px auto 5px auto;
width:900px;
}

.lineheight-l{
line-height:140%;
margin-bottom:10px;
padding-left:10px;
}

.decimal{
list-style-type:decimal;
}

.latin{
list-style-type:upper-alpha;
}

.ol{
padding-left:50px;
line-height:140%;
margin-bottom:10px;
}

/*-----------------------------------------------------------------------------------------------
  Layout / Base Page Styling
-----------------------------------------------------------------------------------------------*/
body{
	min-width: 920px;
	max-width:1280px;
	width:100%;
 	margin:0 auto;
	font-family: "Lucida Grande", Verdana, Arial, sans-serif;

	font-size:small;
 	color:#4C4C4C;
/*	background:#fff url(../images/header-bg2.jpg) repeat-x left top;*/
/*	background:#fff url(../images/headimage5.png) repeat-x left top;
background:#fff url(../images/back-spring-1.gif) repeat left top;*/
background:#fff url(../images/dot.png) repeat left top;
}



#wrapper {
  	margin-right: auto;
  	margin-left: auto;
	width:900px;
/*	background:transparent url(../images/alpha.png) left top repeat-x; */
	padding-right:20px;
	padding-left:20px;
	padding-bottom:25px;
 	background:#fff url(../images/h2background5.png) repeat-x left top;
	border-top:10px solid #e24389;
/*	border-right:1px dotted #e24389;
	border-left:1px dotted #e24389;
	border-bottom:1px dotted #e24389;		*/
}


/*-----------------------------------------------------------------------------------------------
  +Header
-----------------------------------------------------------------------------------------------*/
#header{
	height:130px;
	width:250px;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

.topbanner{
width:590px;
height:60px;
float:right;	
padding:10px 10px 10px 10px;
margin:25px 0px 10px 10px;
text-align:right;
}

.topcomment{
width:590px;
background:transparent url(../images/h2background2.png) repeat-x;
border:1px #ddd solid;
float:right;	
padding:10px 10px 10px 10px;
margin:25px 0px 10px 10px;
}

.topcomment h1,.topcomment h1 a{
font-weight:bold;
margin-bottom:10px;
font-size:medium;
color:#600;
text-decoration:none;
}

/* ::logoﾊ
-----------------------------------------------------------------------------------------------*/

#header #logo{
 display:none; /* hide, this is for accessibiliy only */
}

/* ::navﾊ
-----------------------------------------------------------------------------------------------*/

#header ul#nav li{
 	width:auto;
 	float:left;
} 


#header ul#nav li a.main,
#header ul#nav li#navhome a.main{
	width:250px;
	height:89px;
	background:transparent url(../images/logokana.png) no-repeat left top; 
    margin-top:30px;
    display:block;
    text-indent:-9999px;
    text-decoration:none;
}

.logomessage{
float:left;
margin-top:2px;
margin-left:5px;
margin-bottom:1px;
}

.logomessage h2{

font-size:small;
font-weight:normal;
font-family:'ヒラギノ丸ゴ Pro W4', HiraMaruPro-W4, sans-serif;	
}

/*-----------------------------------------------------------------------------------------------
  +BreadCrumb
-----------------------------------------------------------------------------------------------*/
#breadcrumb{
 font-size:10px;
 color:#666666;
 width:100%;
 margin:0px 0px 10px 6px;
 padding:10px 0 10px 0;
}



/*-----------------------------------------------------------------------------------------------
  +Content
-----------------------------------------------------------------------------------------------*/
#content{
 width:100%;
margin:0 0 0 0;
padding:0 0 0 0;
clear:both;
}




/***** tabbed navigation *****/

.tabs {
	background: url(../images/navline.gif) bottom repeat-x;
	float: left;
	width: 100%;
	margin-bottom: 1.5em;
	font-size: 125%;
	font-weight: normal;	
} /*IE6*/


.tabs br{
	clear: both;
}

.tabs h2, .tabs h3 {
	background: none;
	min-height: 15px;
	margin-bottom: 0;
}


.tabs ul {
	margin: 0.5em 0 0 0;
	padding: 0 0 0 1em;
	list-style: none;
	font-size: 85%;
}


.tabs li {
	margin: 0 1px 0 0;
	padding: 0 5px 0 0;
	background: url(../images/navback.png) 100% -100px;
	float: right;
	border-bottom: 1px solid #bbb;
    text-align: center;
}



#user li{
	float:left;
}


.tabs li.active {
	border-bottom: 1px solid #fff;
	background: url(../images/navback.png) 100% 0;
}

.tabs li a, .tabs li a:visited {
	display: block;
	float: left;
	text-align: center;
	white-space: nowrap;
	background: url(../images/navback.png) 0 -100px;
	text-decoration: none;
	min-height: 17px; 
	color: #666;
	padding:0;
}

.tabs li span{
	padding: 5px 21px 5px 26px;
	display: block;
	float: left;
	text-align: center;
	white-space: nowrap;
	text-decoration: none;
	min-height: 17px; 
	color: #666;	
	cursor:pointer;
}

.tabs li.active a,.tabs li.active span {
	background: url(../images/navback.png) 0 0; 
}


.tabs li:hover {
	background-position: 100% -200px;
}

.tabs li:hover a {
	background-position: 0 -200px;
}

.tabs li.active:hover {
	background-position: 100% 0;
}

.tabs li.active:hover a {
	background-position: 0 0;
	text-decoration: underline;
}





.subtabs li {
  float:left;
  list-style-type:none;
}

.subtabs li a {
  display:block;
  margin:7px 0 10px 0;
  padding:2px 10px 2px;
  text-align: center;
  font-size:small;
  border-right:1px solid #aaa;
}

.active a{
 	color:#cc6600;
 	text-decoration:none;
}

.active a:hover{
 background-color:#fff;
}

/*-----------------------------------------------------------------------------------------------
  +Main
-----------------------------------------------------------------------------------------------*/
#main{
width:100%;
}

#main h2{
font-size:medium;
font-weight:bold;
padding-top:1px;
margin:1px 0 10px 2px;

}

#main .shakeit{
margin-bottom:-24px;
 	color:#4C4C4C;
}

.subcon-ul{
width:100%;
border-bottom:1px solid #ddd;
padding-bottom:7px;

}

#contents{
float:left;
width:75%;
}



/*form
-------------------------------------------------------------------------------------------------*/
.error{
color:#bb2520;
font-size:medium;
margin-left:10px;
}
#thisform{
float:left;
margin:10px 10px 10px 0px;
}

#thisform2{
float:right;
margin:10px 0px 10px 10px;
}

#thisform,#thisform2{
background:transparent url(../images/h2background2.png) repeat-x;
width:438px;
height:200px;
border:1px #ddd solid;
padding-top:10px;
}

#thisform h2,#thisform2 h2{
padding-bottom:5px;
border-bottom:1px solid #ddd;
}

#loginname,#loginpassword{
background-color:#FFFFEE;
}

#thisform3{
background:transparent url(../images/h2background2.png) repeat-x;
width:898px;
float:left;
border:1px solid #ddd;
}

#submitform,#submitform2,.fold{
background:transparent url(../images/h2background2.png) repeat-x;
border:1px #ddd solid;
float:left;	
padding:10px 10px 10px 10px;
margin:10px 10px 10px 10px;
}

#submitform,.fold{
width:620px;
}



.fold2{
background:transparent url(../images/h2background2.png) repeat-x;
border:1px #ddd solid;
padding:10px 10px 10px 10px;
margin:10px 10px 10px 10px;
width:300px;
text-align:center;
}

#submitform2{
width:93%;
}

.submitform-message{
width:620px;
float:left;	
padding:10px 10px 10px 10px;
margin:10px 10px 10px 10px;
}

#submiturl,
#submittitle,
#submittags{
font-size:large;
padding:5px 0 5px 5px;
}

.profilesubmit{
font-size:small;
padding:5px;
margin:5px auto 5px auto;
}

.form-center{
margin-top:20px;
margin-bottom:20px;
}

.form-contents fieldset{
padding:5px 0px 5px 30px;
margin:0 0 10px 0;
border:none;
}

.form-contents legend{
color:#000;
font-size:medium;
margin-left:-25px;
}

.form-contents input{
padding:2px 0px 2px 0px;
margin:15px 5px 0px 5px;
}

.loginsubmit{
text-align:right;
margin-right:40px;
}

/*.forgottenpw{
margin-left:70px;
}*/

.reg-center{
float:left;
width:900px;
border:1px #eee solid;
background:transparent url(../images/h2background2.png) repeat-x;
}

.reg-step{
float:left;
 width:280px;
 margin:10px 0 0 10px;
 padding:0 0 0 0;
}

#reg-form{
width:540px;
float:right;
padding:20px 0 10px 20px;
margin:10px 10px 10px 0px;
background:transparent;
}

#reg-step2{
width:auto;
padding:20px 20px 10px 20px;
border:1px #eee solid;
background:transparent url(../images/h2background2.png) repeat-x;
margin-top:40px;
font-size:medium;
text-align:center;
}

#reg-form input{
margin:1px 1px 10px 10px;
}

#usernamecheckitvalue{
clear:both;
float:left;
}

label{
font-size:small;
}

.kiyaku{
width:300px;
height:160px;
font-size:small;
}

/*  +Entry
-----------------------------------------------------------------------------------------------*/
.entry{
 margin-top:1px;
 margin-bottom:10px;
 clear:both;
}

.entry .vote a{
 display:block;
 float:left;
 width:67px;
 height:85px;
 text-align:center;
 text-decoration:none;
 background:transparent url(../images/clipboard.png) no-repeat left top;
  color:#993333;
font-weight:normal;
font-size:x-small;
}

.entry .vote a:hover{
 background:transparent url(../images/clipboard.png) no-repeat right bottom;
 color:#fff;
 
}

.entry .vote a .nv{
 font-family:Arial Black, Arial, Helvetica, sans-serif;
 font-size:24px;
 font-weight:normal;
 color:#993333;
 display:block;
 margin-top:0px;
}

.entry .vote a:hover .nv{
 color:#fff;
}

.entry .voted{
 display:block;
 float:left;
 width:67px;
 height:85px;
 text-align:center;
 text-decoration:none;
 background:transparent url(../images/clipboard.png) no-repeat left bottom;
 cursor:pointer;
  color:#333;
 font-size:x-small;
 font-family:'ヒラギノ丸ゴ Pro W4', HiraMaruPro-W4, sans-serif;	

}


.entry .voted .vtd{
 font-family:Arial Black, Arial, Helvetica, sans-serif;
 font-size:24px;
 font-weight:normal;
 color:#333;
 display:block;
 margin-top:0;
}

.entry .voted a:hover .nv{
 color:#333;
}

.vtd{
color:#111;
}

 /* +Info
-----------------------------------------------------------------------------------------------*/
.info{
/*border-top:1px dotted #eee;*/
margin:0;
padding:0;
font-size:small;
background:transparent url(../images/h2background4.png) 0px 0px repeat-x;
font-family:'ヒラギノ丸ゴ Pro W4', HiraMaruPro-W4, sans-serif;	
border-top:1px dashed #e24389;
}

.info h4{
 font-size:medium;
 padding:27px 0 5px 0;
 font-weight:normal;
}

.info h4 a{

}

.entry .info h4 a:hover{
 color: #CC6600;
 background:none;
}
	
	
.profile-url{
font-size:x-small;
margin:0px 0 0 10px;
}

.profile-gazou{
float:left;
padding:2px 0 2px 0;
margin:0 0 0 0;
}

.profile-link{
font-size:x-small;
float:left;
margin:0px 0 0 10px;
}
.profile-tagscategory{
	font-size:x-small;
	float:left;
	background:#fff;
	margin:2px 0 0 10px;
}

#personal_info,#stats,#bookmarklet{
	clear:left;
	margin-top:20px;
}

.bookmarklet{
width:auto;
padding:20px 20px 20px 20px;
background:#eee;
}

.friendsp{
	clear:left;
	margin-top:10px;
	padding-right:20px;
	padding-left:0px;
}

.friendsp h3{
border-bottom:1px solid #ddd;
padding:0 0 2px 0;
margin-bottom:5px;
	width:665px;
}

dl {
	background-color: #ececec;
	margin: 0 0 0 0;
	border: 1px solid #cccccc;
	border-top: none;
	width:665px;
}

dt {
	font-weight: normal;
	color: black;
	margin: 0;
	padding: 0.5em 0 0.5em 1em;
	border-top: 1px solid #cccccc;
	width: 13em;
	float: left;
}
	
dd {
	background-color: white;
	margin: 0 0 0 13em;
	padding: 0.5em 1em 0.5em 1em;
	border-top: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
}

#bookmarklet p,.friendsp p{
	background-color: white;
	margin: 0 0 0 0;
	padding:10px 10px 10px 10px;
	border: 1px solid #cccccc;
	width:645px;
}

 /* +Entry content
-----------------------------------------------------------------------------------------------*/
.content{
clear:left;
font-size:small;
line-height:120%;
/*width:460px;*/
margin:0px 0 0px 95px;
padding:0 90px 0px 10px;
}

#comments{
float:right;
width:610px;
}

#comments h3{
background:transparent url(../images/h2background3.png) left bottom repeat-x;
border-bottom:1px solid #ccc;
margin-bottom:10px;
}

#storyvoted{
float:right;
width:610px;
}

#storyvoted h3{
background:transparent url(../images/h2background3.png) left bottom repeat-x;
border-bottom:1px solid #ccc;
margin-bottom:10px;
}



.tools{
/*border-bottom:1px dotted #aaa;*/
float:right;
margin:0px 0 10px 0;
padding:0 0 0 0;
}

.screencapture{
float:right;
}

#comments-list{
margin:0 0 0 0;
padding:5px 0px 5px 0px;
background:#fff;

}


.comments-list2{
margin:0 0 10px 30px;
padding:0;
}

.comments-list2 li {
margin:-1px 0 0 0;
padding:0;
}

.comment-wrap{
margin:-1px 0 0 0;
padding:5px 5px 5px 5px;
border:1px solid #ddd;
}

.comment-head{
border-bottom:1px dotted #ddd;
padding:5px 0 5px 5px;
background:transparent url(../images/comment.png) left top repeat;
}


.comment-body{
padding:0 0 0 40px;
font-size:small;
}

.comment-info{
margin:0;
padding:5px 10px 5px 40px;
background:transparent;
}


#commentform{
margin:0;
padding:5px;
border:1px solid #ddd;
background:transparent url(../images/comment.png) left top repeat;
}

#commentform h3{
background:transparent;
font-size:medium;
border:none;
margin:0;
padding:10px;
}

#commentform textarea,.commentform textarea{
margin-bottom:10px;
font-size:small;
}


.comment-subhead{
clear:both;
float:right;
font-size:x-small;
margin-top:5px;
}

.indent{
padding-left:50px;
margin-bottom:10px;
}

#writecomments{
padding:10px;
background:#ffdddd url(../images/comment.png) left top repeat;
}

.harapecco-merit{
font-size:small;
padding:10px 5px 10px 50px;
margin-bottom:20px;
line-height:140%;
background:transparent url(../images/comment.png) left top repeat;
}

.harapecco-merit li{
list-style:lower-latin;
margin-bottom:5px;
}

.fontsmall{
font-size:small;
line-height:140%;
}

.fontmedium{
font-size:medium;
line-height:140%;
}


/*-----------------------------------------------------------------------------------------------
  +Who voted
-----------------------------------------------------------------------------------------------*/

  /* allow room for 3 columns */
  div#idwhovotedwrapper ol,.friendsp ol
  {
    list-style-type: none;
  }

  /* float & allow room for the widest item */
  div#idwhovotedwrapper ol li,.friendsp li
  {
    float: left;
    width: 47px;
	text-align:center;
	padding:3px 0 15px 0;
	margin:10px;
/*    background:transparent url(../images/user_bg.png) no-repeat; */
  }
  
    div#idwhovotedwrapper ol li img,.friendsp ol li img{
    border:none;
    }

  /* stop the float */
  div#idwhovotedwrapper br
  {
    clear: left;
  }

  /* separate the list from subsequent markup */
  div#idwhovotedwrapper div.whovotedwrapper
  {
    margin-bottom: 1em;
  }

/*-----------------------------------------------------------------------------------------------
  +Sidebar
-----------------------------------------------------------------------------------------------*/
#sidebar{
float:right;
 width:200px;
 margin:1px 0 0 10px;
 padding:25px 0 0 0;
}

#sidebar .box{
 padding:10px;
 margin-bottom:10px;
 /*background:#f6dcdb;*/
}



#sidebar .box h3{
 font-family:"Lucida Sans Unicode", Arial, Helvetica, sans-serif;
 font-size:small;
 font-weight:normal;
 text-transform:uppercase;
 text-align:right;
 color:#600;
 margin-bottom:8px;
  cursor:pointer;
/* background:#fff url(../images/logo-small2.png) no-repeat left bottom; */
border-bottom:1px dotted #bb2520;
}

#sidebar .box h3 a{
 color:#600;
 background:none;
 text-decoration:none;
}

#sidebar .box h3 a:hover{
 background:none;
 color:#CC6666;
}

#sidelist{
margin-top:0px;
}

.login-input{
margin:10px 10px 10px 10px;
}

.login-submit{
text-align:right;
margin:10px 1px 10px 0;
}

#loggedinbox{
border-top:4px solid #e24389;
border-bottom:4px solid #ffe3dd;
background:#ffeeee;
}

#loginbox{
border-top:4px solid #e24389;
border-bottom:4px solid #ffe3dd;
background:#ffeeee;
}

.loggedinmenu{
padding-left:5px;
}
.loggedinmenu li{
margin:5px 0 0 0;
}

.welcome-avatar{
float:right;
}

#sidenavbox li,#categorybox li,#tagbox li,#rssbox li{
margin:5px 0 0 0;
}

.modifyprofile input,.modifyprofile select{
font-size:medium;
font-family:MSP Gothic;
padding:2px;
}

.dlsmall{
width:480px;
}

/*-----------------------------------------------------------------------------------------------
  +Page Nation
-----------------------------------------------------------------------------------------------*/
.pagination{
clear:both;
 background:transparent url(../images/div-h.gif) repeat-x left top;
 padding:10px 0;
 margin:40px 0 0;
 text-align:right;
}

.pagination a{
 padding:1px 4px;
 text-decoration:none;
 background:transparent url(../images/pagination.gif) repeat-x left bottom;
 border:1px solid #ccc;
 margin:0 2px;
 color:#666666;
}

.pagination a:hover{
 background: #fff;
 color:#666666; 
 border:1px solid #aaa; 
}

.pagination span, .pagination span.nextprev{
 background:#FFFFFF;
 border:1px solid #CCCCCC;
 color:#CCCCCC;
 padding:1px 4px; 
 margin:0 2px; 
}

.pagination span.current{
 background:#c8161d;
 border:1px solid #aaa;
 color:#FFFFFF;
 margin:0 2px; 
 font-weight:bold;
}

 .pagination h4 {
 margin-top:-1.45em;padding:0;border:none
 } /* In html1.php, pages links:EITHER span OR a */

/*-----------------------------------------------------------------------------------------------
  +Footer f6dcdb
-----------------------------------------------------------------------------------------------*/
#footer{
/*background:#961E23 url(../images/footimage2.png) repeat; */
background:#fff url(../images/dot.png) repeat left top;
width:100%;
/*border-top:#8F1E23 10px solid; */
border-top:#ffe3dd 10px solid;
margin-top:50px;
}

#footmain{
	width:900px;
	height:150px;
  	margin: 10px auto 0 auto;
  	padding:10px 0 10px 0;
  	text-align:center;
}

#footmain a,#footmain a:hover,#footmain a:visited{
color:#bb2520;
}
	
/*-----------------------------------------------------------------------------------------------
  +harapecco news
-----------------------------------------------------------------------------------------------*/	
	

.rss-item{
margin-bottom:5px;
 	background:#fff url(../images/h2background5.png) repeat-x left top;

}	