/*  
Theme Name: Resident Japan
Theme URI: http://residentjapan.com
Description: News-Blog Theme
Version: 1.0
Compatability: Firefox, Safari, IE 6,7,8,  
Author: David Burden
Author URI:thatfresh.com
*/

/* Color scheme
#999 - dark Grey
#CCC - light grey
#000 -  Black
#666 - medium grey
#EFEFEF -  very light grey
*/


/* Table of Contents

1. Global Setting
- html elements
-- global classes

2. Typography
- Fonts
-- Styles
--- Links

3. Structure
- base.
-- header.
--- page.
---- footer.

4. Other

*/


/*-----------------------------------------*/
/*--------------- Gloal Setting -----------*/
/*-----------------------------------------*/


/*-------------------- Html  --------------*/

body{
margin: 0;
padding: 0 ;
background: #CCC url(images/pagebg.jpg) repeat;

}

* {margin: 0; padding: 0;}

img {border:0;}

p{}

small{}

strong{font-weight: bolder;}

a, a:link, a:visited{ color: #c3014d;}

a:hover, a:active{color: black;}

blockquote {
font-family: Georgia, "Times New Roman", Times, serif;
margin:15px 0; padding:10px 20px;
font-size:2.5em;
font-style: italic;
line-height: 1em;
color: #999;
}

object{
clear:both;
}

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

.left{float:left;}
.right{float:right;}

.clear{clear:both;}

.alignleft{float:left;}
.alignright{float:right; padding: 0 0 0 10px;}



/*-----------------------------------------*/
/*------------- 2. Typography -------------*/
/*-----------------------------------------*/


/*------------- Headings-------------------*/

h1 { }
	

h2 {}
	#comments h2{font-family: Helvetica, Verdana, Arial, sans-serif; margin: 10px 0 0 5px; font-size: 1.2em; line-height: 1.6em; color:#999;}	
	
h3{}
	#sidebar h3 { font-family: Helvetica, Verdana, Arial, sans-serif; margin: 10px 0 0 15px; font-size: 0.8em; color:#333; text-transform: uppercase;}

h4{}
h5{}
h6{}

/* wordpress image captions */

.wp-caption {
	border: 1px solid #ddd;
	text-align: center;
	padding-top: 4px;
	padding-bottom: 2px;
	margin: 15px 0 0 0px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	background: #efefef;
	border-radius: 3px;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption p.wp-caption-text {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 12px;
	color:#666;
	line-height: 25px;
	padding: 0 4px 5px;
	margin: 0;
}

/*---------------- Styles -----------------*/

.bold{font-weight: bolder;}
.light{font-weight: lighter;}

.xsmall{ font-size: 0.6em}
.small{ font-size: 0.70em}
.medium{font-size: 0.75em;}
.large{font-size: 0.8em;}

.color1{color: #000;}
.color2{color: #ccc;}
.color3{color: #ddd;}

.uppercase{text-transform: uppercase;}

.font1{	font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", "Luxi Sans", Arial, sans-serif;}
.font2{font-family: Palatino Linotype, Book Antiqua, Palatino, serif;}
.font3{font-family: Verdana, Helvetica, Arial, sans-serif;}

.rounded{border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

.bg_pink{color: #c3014d;}

.leftpad{padding: 10px 0 0 10px;}

/*--------------- Links ---------------------*/




/*-------------------------------------------*/
/*------------- 3. Structure ----------------*/
/*-------------------------------------------*/


/*------------------- base ----------------*/

#body_container{
float:left;
width: 100%;
position: absolute;
}

/*------------------- Header ----------------*/
 
#header_container{
width:100%;
float:left;
margin: 0 0 0 0;
padding: 0 0 0 0;
}

#header{
width:100%;
float:left;
background: #c3014d;
height:80px;
}

#tweet{float:left; width:200px; margin: 0 0 0 15px; padding: 5px 10px 5px 10px; color:#666; list-style: none; background: #FFF; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;}

#tweet li{max-width: 200px;}

/* Navigation */

#navigation{}

#navigation ul{}

#navigation ul li{}

#post-nav-container{width:141px; float:left; clear:both; height:66px; margin: 10px 0 0 55px;
background:url(images/pagenavbg.png) no-repeat;
}

.post_nav{float:left; width: 141px;
    height:66px;
    position: relative;
   
}

.arrowleft{
height:66px;
background:url(images/prev.png) no-repeat;
width:70px;
  border:none;
  position:absolute;
  left:0;
  top:0;
  outline:0;
  cursor: pointer;
}



.arrowleft:active{background-position:0 -66px;}


.arrowright{ 
height:66px;
background:url(images/next.png) no-repeat;
width:70px;
  border:none;
  position:absolute;
  right:0;
  top:0;
  outline:0;
  cursor: pointer;
}

.arrowright:active{background-position:0 -66px;}

 
/*------------------- Page ---------------------*/

#sidebar{
float:left;
width:250px;
/*background: #efefef;*/
background: url(images/sidebar_transp.png) repeat-y;
height:100%;
position: fixed;
z-index: 100;
}


.top3{float: left; list-style: none; width:220px; margin: 0px 0px 10px 15px; }
.top3 a{float:left; margin: 5px 0 0 5px; list-style: none;background: #CCC; color:#FFF; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding:3px 8px 3px 8px; text-decoration: none;}

.top3 a:hover{background: #666; color:#FFF;}


.name_logo{
float:left;
height:90px;
margin: 20px 0 20px 20px;
}

.logo{float:left;}


#pages{float:left; width: 250px; height: 25px; margin: 50px 0 20px 0px; clear: both;}
#pages ul {list-style: none;}
#pages ul li {float:left; margin:5px; display: inline-block; }
#pages ul li a, #pages ul li a:visited{text-decoration: none; padding:5px 0px 5px 10px; color:#999; display: block;}
#pages ul li a:hover {color: #d61577;}
#pages ul li a:active{color:#333;}

#middle_container{
float:left;
width: 100%;
}
/*#post_container{
float:left;
width:650px;
padding: 20px 0 150px 20px;
position: relative;
}*/


/* The Grid CSS */
/*
#grid-content {
	margin-left: 250px;
overflow: hidden;
	height: 0;
	width: 100%;
	}
	
 
}
#grid-content .post {
	margin: 5px 5px 5px 5px;
	padding: 3px;
	float:left;
	width: 342px;
}
#grid-content .post.smalldiv {
	width: 342px;
	background: #FFF;

}

#grid-content .post.largediv {
	width: 700px;
	background: #FFF;
}

#grid-content div h3 {
	margin: 0;
	padding: 0;
}
#grid-content div p {
	margin: 0;
	padding: 0;
}

*/

.smalldiv, largediv {	border-left: solid 1px #ddd; border-right: solid 1px #ddd; border-top: solid 1px #ddd;
border-bottom: 3px solid #eee;}
.post{float:left;}
.post_thumb{padding: 0 0 10px 5px;}
.post img {}
.post_content{float:left; min-width: 235px; line-height: 1.5em; clear:both; padding: 10px 4px 10px 4px;}
.post_content p {clear:both;  word-spacing: 0.14em; line-height: 1.5em;}
.post_fullwidth{width:300px; float:left; clear:left;}
.post_title {float:left; min-width:342px; margin: 5px 0 5px 0;}
.post_title a {float:left; color: #444; font-size: 1.2em; text-transform: capitalize; font-weight: bolder; text-decoration: none; line-height: 1.5em; margin: 0 0 0 4px }
.post_footer{ width: 100%; float:left; margin: 15px 0 15px 0; }
.the_post_thumb{float:right; clear:both;}
.tags{float:right; clear:both; margin: 8px 0 0 0;}
.tags a{background: #CCC; color:#FFF; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding:3px 8px 3px 8px; text-decoration: none; }

.tags a:hover{background: #666; color:#FFF;}

.date{}

.comment_bubble{float:left;  margin: 0 0 0 10px; width:28px; height: 26px; background: url(images/bubble.png) no-repeat 0 0;}

.comment_bubble a{width:28px; margin: 0 0 0 0; text-align:center; padding-top: 1px;}

.postnavigation{width:175px; background: url(images/buttons.png) no-repeat; top:0; left:0; height:70px; }
/*.postnavigation a{ padding: 10px 15px 10px 15px; background: #c3014d; color:#FFF; text-decoration: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

.postnavigation a:hover{background: #333;}*/

.read_more a{float:left; margin: 15px 0 0 0;}



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

#footer_container{
width:100%;
float:left;
background: #CCC;
height:100px;
margin: 0 0 0 0;
padding: 0 0 0 0;
}

#copyright{}

#p{}

.bookmark{}

/*-------------------------------------------*/
/*------------- 4. other --------------------*/
/*-------------------------------------------*/

/* lists */

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


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


#fp:first-letter {
 font-size : 300%;
 font-weight : bold;
 float : left;
 margin-right: 3px;
 }
 
 /* Search Form */
 
 form{margin:0;padding:0}
 
 .search_container{
 width:230px;
 float:left;
 margin: 0 0 0 20px;
 }
 
.search-box{ /*outer background*/
background:url(images/searchbox.gif) no-repeat 0 0;
  width:210px;
  display:block;
  position:relative;
  height:42px;
  left:0;
  top:0;
  margin: 15px 0 15px 0;
}
 
input.search-field{ /*input field */
 border:none;
  background:none;
  font-size:19px;
  padding:4px 4px 4px 12px;
  width:140px;
  margin-top:6px;
  display:inline;
  outline:0;
}
 
input.search-go { /*search icon */

width:46px;
  height:42px;
  background:url(images/searchbutton.png) no-repeat;
  border:none;
  position:absolute;
  right:0;
  top:0;
  outline:0;
  cursor: pointer;
}
 

input.search-go:active {background-position:0 -42px;}

/* Comments */

#comments{float:left;
width:100%;
list-style: none;
}

#comments-header{line-height: 1.8em}

/* Retweet */
.retweet{float: left; margin: 10px 0 0 10px; }

.odd{ float:left; 
background: #efefef;
width:100%;
margin:0px 0 5px 0;
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}

.even{float:left; 
background: #efefef;
width:100%;
margin:0px 0 5px 0;
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}  

.comment-text{border: none;
float:left;
margin: 5px 0 10px 15px;
}

.comment_container{
float:left;
width:100%;
}

comment-meta{
}

.comment-date{
margin: 5px 0 0px 15px;
color:#666;
}
 
.comment-author {
float:left;
margin: 5px 15px 0px 15px;
}

.by_author{
background: #efd4de;
width:100%;
margin:0px 0 5px 0;
border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
float:left;
}


#comments-form{
}

.no_comment{
float:left;
clear:both;
margin: 10px 5px 10px 5px;
}

.forminput{
padding:3px;
background: #efefef;
color:#666;
border: solid 1px #ccc;
margin: 5px 0 1px 0;
border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
}

.forminput:focus{
background: #ccc;
}

.formlabel{
font-size: 0.8em;
color:#999;
}

.formbutton{
background: #999;
padding: 5px 8px 5px 8px;
color:#FFF;
font-size:1em;
border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
margin: 5px 0 10px 0;
border:none;
}

.formbutton:active{
background: #333;
}