/*
   CSS for Ikeda-ya web
   by studio katati.
*/



/* =======================================
   BASIC
   ======================================= */

a:link, a:visited {color: #A95D00; text-decoration: none;}
a:hover, a:active {color: black;}
img {border: none;}
.hidden {display: none;}
.centerize {text-align: center;}

body {
   color: #4C4C4C;
   font-size: 11px;
   font-family: "Trebuchet MS","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
   background: #F6F6F6 url(images/iroha.jpg) repeat;
   padding: 20px 0 20px 0;
   text-align: center;
   }

#header {
   position: relative;
   width: 740px;
   height: 312px;
   margin: auto;
   border-left:#CCC 1px solid;
   border-right:#CCC 1px solid;
   border-top:#CCC 1px solid;
   }

#wrapper {
   width: 740px;
   margin: auto;
   text-align: left;
   background: #FFF;
   border-left:#CCC 1px solid;
   border-right:#CCC 1px solid;
   border-bottom:#CCC 1px solid;
   }

#container {
   width: 490px;
   float: left;
   }

#content {
   padding: 25px 0;
   }

#sidebar{
   width: 230px;
   float: right;
   padding: 25px 0;
   text-align: left;
   }

#footer {
   width: 740px;
   margin: auto;
   padding: 20px 0 0 0;
   }

#credits {
   margin-top:10px;
   font-size: 10px;
   text-align: center;
   font-size: 11px;
   color: #222020;
   }

#credits a:link, #credits a:visited {
   color: #23598C;
   }

#credits a:hover, #credits a:active {
   color: #333030;
   }

img {border:0;}

.clearing {
   height: 0;
   clear: both;
   }

/* =======================================
   HEADER MENU
   ======================================= */

/*THE MAIN TITLE - YOUR BLOG NAME ON TOP OF THE HEADER*/
#header h1{
   position: absolute;
   top: 18px;
   left: 24px;
   font-size: 20px;
   line-height: 20px;
   margin: 0;
   }

/* =======================================
   MAIN MENU
   ======================================= */

#mainmenu {
   position: absolute;
   top: 22px;
   left: 24px;
/*   left: 170px; */
   }

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

#mainmenu li{
   margin:0 6px 0 0;
   float:left;
   }

/*THE NAVIGATION - More detailed stuff in 01_navigation.css*/
#navigation{
   font-size: 11px;
   width: 720px;
   height: 22px;
   position: absolute;
   top: 290px;
   left: 3px;
   }

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

#navigation li{
   background: none;
   }

/* =======================================
   THIS PART IS FOR THE NAVIGATION LINKS
   ======================================= */

.nav1 a:link, .nav1 a:visited, .nav2 a:link, .nav2 a:visited, .nav3 a:link, .nav3 a:visited{
   color: #4E4E4E;
   width: 80px;
   height: 20px;
   line-height: 20px;
   background: url(images/01_linkbg2.gif) top repeat-y;
   padding: 0;
   }

.nav1 a:link, .nav1 a:visited{
   position: absolute;
   top: 2px;
   left: 14px;
   }

.nav2 a:link, .nav2 a:visited{
   position: absolute;
   top: 2px;
   left: 96px;
   }

.nav3 a:link, .nav3 a:visited{
   position: absolute;
   top: 2px;
   left: 178px;
   }

/*HOVER EFFECTS*/
.nav1 a:hover, .nav1 a:active, .nav2 a:hover, .nav2 a:active, .nav3 a:hover, .nav3 a:active{
   background: url(images/01_linkbg1.gif) top repeat-y;
   margin: 1px 0 0 0;
   }

/*USE A DIFFERENT COLOR WHEN USER IS ON THAT PAGE*/
#home .nav1 a:link, #home .nav1 a:visited, #itempage .nav1 a:link, #itempage .nav1 a:visited, #archives .nav2 a:link, #archives .nav2 a:visited {
   background: url(images/01_linkbg1.gif) top repeat-y;
   }

/*THE FOLLOWING PART IS FOR THE FONT CONTROL*/
#fontcontrol{
   background: none;
   width: 66px;
   height: 18px;
   position: absolute;
   top: 22px;
   left: 655px;
   }

#fontcontrol ul{
   background: none;
   list-style: none;
   padding: 0;
   margin: 0;
   }

#fontcontrol li{
   background: none;
   }

#fontcontrol i {
   display: block;
   visibility: hidden;
   }

.font1 a:link, .font1 a:visited {
   width: 18px;
   height: 18px;
   position: absolute;
   top: 0;
   left: 0;
   background: url(images/01_font1.gif) no-repeat;
   }

.font2 a:link, .font2 a:visited{
   width: 18px;
   height: 18px;
   position: absolute;
   top: 0;
   left: 22px;
   background: url(images/01_font2.gif) no-repeat;
   }

.font3 a:link, .font3 a:visited {
   width: 18px;
   height: 18px;
   position: absolute;
   top: 0;
   left: 44px;
   background: url(images/01_font3.gif) no-repeat;
   }

.font1 a:hover, .font1 a:active {
   background-position: 0 -18px;
   }

.font2 a:hover, .font2 a:active {
   background-position: 0 -18px;
   }

.font3 a:hover, .font3 a:active {
   background-position: 0 -18px;
   }

/*THE HEADERS (h2: Main titles, h3: Blog and Sidebar titles, h4: Comment names/userlinks)*/
h2 {
   color: #3E565F;
   margin: 0 0 3px 0;
   font-size: 16px;
   }

h3 {
   color: #3E565F;
   margin: 0 0 8px 0;
   font-size: 16px;
   font-weight: normal;
   }

h4 {font-size: 11px;}

/*Sub structure - To create the margins of the body (where text will be placed)*/
.contentdiv {
   margin: 0 15px 0 22px;
   }

.sidebardiv {
   margin: 0 22px 0 15px;
   line-height: 170%;
   }

/* =======================================
   COMMENT DESIGN
   ======================================= */

.c_commentbody {
   clear:both;
   padding: 0 0 5px 0;
   background: url(images/01_hdot.gif) bottom repeat-x;
   }

.c_userlink{
   margin: 0 0 5px 0;
   }

.c_commentinfo{
   font-size: 10px;
   margin: 3px 0 0 0;
   padding: 0 0 0 13px;
   background: url(images/01_item1.gif) 0 1px no-repeat;
   }

/* =======================================
   TRACKBACK DESIGN
   ======================================= */

.trackbackurl{
   background: url(images/01_quote3.gif) 0 3px no-repeat;
   font-size: 11px;
   font-weight: bold;
   margin: 0;
   padding: 5px 0 30px 43px;
   }

.t_commentbody {
   clear:both;
   padding: 0 0 5px 0;
   background: url(images/01_hdot.gif) bottom repeat-x;
   }

.t_userlink{
   margin: 0 0 5px 0;
   }

.t_commentinfo{
   font-size: 11px;
   margin: 3px 0 0 0;
   background: url(images/01_item1.gif) 0 1px no-repeat;
   font-weight: bold;
   text-align: right;
   }

/* =======================================
   CONTENT BODY
   ======================================= */

/*THE STYLING OF THE BODY OF CONTENTS AND SIDEBAR*/
.contentbody {
   font-size: 11px;
   margin: 0;
   padding: 0 0 30px 43px;
   line-height: 170%;
   text-align: justify;
   }

.contentbody ul {
   list-style: none;
   padding: 0;
   margin: 0 0 10px 0;
   }

.contentbody li {
   padding: 0 0 0 15px;
   margin: 0;
   background: url(images/arrow.gif) no-repeat center left;
   }

.categ a:link, .categ a:visited {color: #777; text-decoration: none;}
.categ a:hover, .categ a:active {color: black;}

.hide {
   margin: 0;
   padding: 15px 0 0 0;
   }

.read {
   margin: 0;
   padding:15px 0 0 0;
   }

.more {
   height: 20px;
   }

/* =======================================
   TOP INDEX
   ======================================= */

.infobody {
   background:url(images/top_info.gif) no-repeat;
   font-size: 11px;
   margin: 0;
   padding: 0 0 30px 0;
   line-height: 170%;
   text-align: justify;
   }

.diarybody {
   background:url(images/top_diary.gif) no-repeat;
   font-size: 11px;
   margin: 0;
   padding: 0 0 30px 0;
   line-height: 170%;
   text-align: justify;
   }

.memobody {
   background:url(images/top_marunism.gif) no-repeat;
   font-size: 11px;
   margin: 0;
   padding: 0 0 30px 0;
   line-height: 170%;
   text-align: justify;
   }

.topicbody {
   background:url(images/top_topic.gif) no-repeat 120px top;
   margin: 0;
   padding: 30px 0 0 0;
   line-height: 170%;
   text-align: justify;
   }

.dicobody {
   background:url(images/top_dico.gif) no-repeat;
   font-size: 11px;
   margin: 0;
   padding: 0 0 30px 0;
   line-height: 170%;
   text-align: justify;
   }

.etcbody {
   background:url(images/top_etc.gif) no-repeat;
   font-size: 11px;
   margin: 0;
   padding: 0 0 30px 0;
   line-height: 170%;
   text-align: justify;
   }

.infobody ul, .diarybody ul, .memobody ul, .dicobody ul, .etcbody ul {
   list-style: none;
   padding: 10px 0 0 20px;
   margin: 0 0 10px 0;
   }

.infobody li, .diarybody li, .memobody li, .dicobody li, .etcbody li {
   padding: 0 0 0 15px;
   margin: 0;
   background: url(images/arrow.gif) no-repeat center left;
   }

.pickup {
   margin: 0 22px 0 15px;
   padding: 10px 12px 10px 12px;
   font: 14px/173% "Hiragino Mincho Pro","ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝",Georgia,serif;
   background: #F5EEEE url(images/pickup_top.gif) no-repeat top left;
   text-align: center;
   }

.pickup ul {
   list-style: none;
   padding: 0;
   margin: 0 0 10px 0;
   }

.pickup li {
   padding: 0;
   margin: 0 0 10px 0;
   }

.pickup img {
   background: #FFF;
   margin: 0;
   padding: 5px;
   width: 220px;
   border: #CCC solid 1px;
   }

/* =======================================
   LINKS PAGE
   ======================================= */

.linkbody {
   background:url(images/top_link.gif) no-repeat;
   font-size: 11px;
   margin: 0;
   padding: 30px 0 30px 20px;
   line-height: 170%;
   text-align: justify;
   }

.sidebardl dt {
   color: #111;
   margin: 0;
   }

.sidebardl dd {
   padding: 0 0 0 15px;
   margin: 0;
   background: url(images/arrow.gif) no-repeat center left;
   }

/* =======================================
   ABOUT PAGE
   ======================================= */

.aboutbody {
   background:url(images/top_about.gif) no-repeat;
   margin: 0;
   padding: 30px 0 30px 20px;
   line-height: 170%;
   }

.historybody {
   background:url(images/top_history.gif) no-repeat;
   margin: 0;
   padding: 30px 0 30px 20px;
   line-height: 170%;
   }

.aboutbody table, .historybody table {
   border: 0;
   width: 100%;
   }

.aboutbody td, .historybody td {
   font-size: 11px;
   }

.aboutbody tr, .historybody tr {
   vertical-align: top;
   }

.articl {
   width: 70px;
   color: #A95D00;
   }

.accessbody {
   background:url(images/map_ikedaya.png) no-repeat;
   width:340px;
   height:223px;
   margin: 0;
   }

.accessgoogle {
   background:url(images/top_access2.gif) no-repeat;
   margin: 0;
   padding: 30px 0 30px 20px;
   }

/* =======================================
   SIDEBAR
   ======================================= */

.sidebarbody {
   margin: 0 0 20px 0;
   padding: 0;
   }

.sidebarin{
   padding: 0 0 0 3px;
   margin: 0;
   }

/*THIS PART IS TO STYLE THE BACKGROUND IMAGES (THE QUOTE ON THE LEFT)*/

/*You can create different image on your on, but only if you know what you're doing should you edit this part*/
.divweblog .contentbody, .divarchives .contentbody, .divarchivelist .contentbody, .diverror .contentbody, .divmemberinfo .contentbody,
.divsendmessage .contentbody, .divcommentitem .contentbody, .divsearch .contentbody{
   background: url(images/sense.png) 0 0 no-repeat;
   }

/*A different background for comments made*/
.divcommentsmade .contentbody{
   background: url(images/01_quote1.gif) 0 3px no-repeat;
   }

/*A different background for the admin (in the comments made area)*/
.divcommentsmade .id1, .divcommentsmade .id2, .divcommentsmade .id3 {
   background: url(images/01_quote4.gif) 0 3px no-repeat;
   }

/*Add comment form's background*/
.divaddcomment .contentbody{
   background: url(images/01_quote3.gif) 0 3px no-repeat;
   }

/*MORE DETAILED STUFF - Item details of your blog items*/

.itemdetails{
   text-align: right;
   margin: 15px 0 0 0;
   padding: 0 0 10px 0;
   background: url(images/01_hdot.gif) bottom repeat-x;
   clear:both;
   }

/*Date*/
.item0{
   padding: 3px 0 3px 18px;
   margin: 0;
   background: url(images/time.png) 0 1px no-repeat;
   }

/*Posted by*/
.item1{
   padding: 3px 0 3px 18px;
   margin: 0 0 0 5px;
   background: url(images/page_white_edit.png) 0 1px no-repeat;
   }

/*Category*/
.item2{
   padding: 3px 0 3px 18px;
   margin: 0 0 0 7px;
   background: url(images/folder.png) 0 1px no-repeat;
   }

/*Comments*/
.item3{
   padding: 3px 0 3px 18px;
   margin: 0 0 0 10px;
   background: url(images/comments.png) 0 1px no-repeat;
   }

/*For GoTo Header*/
.item5{
   padding: 3px 0 3px 18px;
   margin: 0 0 0 5px;
   background: url(images/control_eject.png) 0 1px no-repeat;
   }

/*Editer*/
.item4{
   padding: 3px 0 3px 18px;
   margin: 0 0 0 5px;
   background: url(images/cog.png) 0 1px no-repeat;
   }

/*STYLING OF SIDE TITLES*/
/*You can remove all parts here if you do not wish to use images as your side titles*/

.ad h3{
   height: 22px;
   text-indent: -9999px;
   margin: 0 0 3px 0;
   background: url(images/side_ad.png) no-repeat;
   }

.login h3{
   height: 22px;
   text-indent: -9999px;
   margin: 0 0 3px 0;
   background: url(images/01_s_login.gif) no-repeat;
   }

.categories h3{
   height: 22px;
   text-indent: -9999px;
   margin: 0 0 3px 0;
   background: url(images/side_category.png) no-repeat;
   }

.latestcomment h3{
   height: 22px;
   text-indent: -9999px;
   margin: 0 0 3px 0;
   background: url(images/side_comment.png) no-repeat;
   }

.search h3{
   height: 22px;
   text-indent: -9999px;
   margin: 0 0 3px 0;
   background: url(images/side_search2.png) no-repeat;
   }

.other h3{
   height: 22px;
   text-indent: -9999px;
   margin: 0 0 3px 0;
   background: url(images/side_other.png) no-repeat;
   }

/*MAIN TITLES*/
/*You can remove all parts here if you do not wish to use images as your main titles*/

h2.information, h2.kimonoday, h2.maruni, h2.dictionary, h2.comments, h2.commentsmade, h2.addcomment, h2.monthlys, h2.archives, h2.error, h2.member, h2.sendmessage, h2.searchpage, h2.tblist, h2.tburl {
   height: 26px;
   text-indent: -9999px;
   margin: 0 0 15px 0;
   }

h2.information {
   background: url(images/top_info.gif) no-repeat;
   }

h2.kimonoday {
   background: url(images/top_diary.gif) no-repeat;
   }

h2.maruni {
   background: url(images/top_marunism.gif) no-repeat;
   }

h2.dictionary {
   background: url(images/top_dico.gif) no-repeat;
   }

h2.comments {
   background: url(images/01_m_comments.gif) no-repeat;
   }

h2.commentsmade {
   background: url(images/top_comment.gif) no-repeat;
   }

h2.addcomment {
   background: url(images/top_comment2.gif) no-repeat;
   }

h2.tblist {
   background: url(images/top_trackback.gif) no-repeat;
   }

h2.tburl {
   background: url(images/top_tburl.gif) no-repeat;
   }

h2.monthlys {
   background: url(images/top_monthly.gif) no-repeat;
   }

h2.archives {
   background: url(images/top_archives.gif) no-repeat;
   }

h2.error {
   background: url(images/01_m_error.gif) no-repeat;
   }

h2.member {
   background: url(images/top_profile.gif) no-repeat;
   }

h2.sendmessage {
   background: url(images/01_m_sendmessage.gif) no-repeat;
   }

h2.searchpage {
   background: url(images/top_search.gif) no-repeat;
   }

/*FORM STYLING*/
form {
   margin: 0;
   text-align: left;
   }

/*Styling for all form fields*/
.formfield {
   width: 130px;
   font-size: 11px;
   font-family: Trebuchet MS, "Lucida Sans Unicode", Arial, Lucida Sans, Tahoma, Sans-Serif;
   margin: 0 0 2px 0;
   color: #494949;
   border-top: 1px solid #868686;
   border-left: 1px solid #868686;
   border-bottom: 1px solid #D4D2CF;
   border-right: 1px solid #D4D2CF;
   }

/*Form fields on focus effect (when user click on that input field)*/
.formfield:focus {
   border: 1px solid black;
   }

/*Form's buttons*/
.formbutton{
   font-size: 11px;
   font-family: Trebuchet MS, "Lucida Sans Unicode", Arial, Lucida Sans, Tahoma, Sans-Serif;
   margin: 1px 0 0 0;
   padding: 1px 10px;
   color: #494949;
   background: white;
   border-top: 1px solid #D4D2CF;
   border-left: 1px solid #D4D2CF;
   border-bottom: 1px solid #868686;
   border-right: 1px solid #868686;
   }

/*Don't show textarea scrollbar on IE*/
textarea {
   overflow: hidden;
   }

/*Wider formfields for comment and mailform*/
.commentform .formfield, .mailform .formfield{
   width: 340px;
   }

/*Add background to comment textarea*/
.commentform textarea{
   background: white;
   }

/*STYLING OF THE FORMS BACKGROUND, AND THE LITTLE ROUNDED TOPS*/

/*Add comment form and mailform (same size)*/
.divaddcomment form, .divsendmessage form{
   width: 390px;
   background: #F5EEEE url(images/01_mountaintop.gif) top no-repeat;
   }

.commentform, .mailform{
   padding: 10px 20px;
   }

/*Login form and search form (same size)*/
.login form, .search form{
   width: 184px;
   background: #F5EEEE url(images/01_mountaintop2.gif) top no-repeat;
   }

.loginform, .searchform {
   padding: 10px;
   }

/*THE LIST STYLES*/
.sidebardiv ul {
   list-style: none;
   padding: 0;
   margin: 0 0 10px 0;
   }

.sidebardiv li {
   padding: 0 0 0 15px;
   margin: 0;
   background: url(images/arrow.gif) no-repeat left 3px;
   }

/*THE SEARCH HIGHLIGHT*/
.highlight{
   font-weight: bold;
   text-decoration: underline;
   }

/*Comment error - For Nucleus v3.2*/
div.error {
   color: red;
   font-weight: bold;
   }

/* =====================================
   Decoration
   ===================================== */

.contentbody p {
   font-size: 11px;
   padding:0 0 5px 0;
   margin:0;
   text-indent: 1em;
   }

/* P With Under Line */
.contentbody p.underline {
   margin: 0 0 10px 0;
   padding: 0 0 10px 0;
   background: url(images/01_hdot.gif) bottom repeat-x;
   text-indent: 0em;
   }

.contentbody blockquote {
   color: #930;
   margin: 0 0 15px 0;
   padding: 10px;
   background: #F8F8F8;
   border: #DDD 1px solid;
   }

.leftbox {
   margin: 5px 10px 10px 0;
   float: left;
   }

.rightbox {
   margin: 5px 0 10px 10px;
   float: right;
   }

.pict {
   margin: 0 15px 10px 0;
   padding: 5px;
   border: #DDD solid 1px;
   }

.pictl {
   margin: 0 10px 10px 0;
   padding: 5px;
   border: #DDD solid 1px;
   float: left;
   }

.pictr {
   margin: 0 0 10px 10px;
   padding: 5px;
   border: #DDD solid 1px;
   float: right;
   }

.caption_g {
   font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","MS UI Gothic",osaka,sans-serif;
   font-weight: normal;
   font-size:14px;
   color: #23598C;
   margin: 10px 0 5px 0;
   }

.caption_m {

   font-family:"Hiragino Mincho Pro W6","ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝",Georgia,serif;
   margin: 10px 0 5px 0;
   color: #23598C;
   font-size:17px;
   }

.caption_xl {
   font-family:"Hiragino Mincho Pro W6","ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝",Georgia,serif;
   margin: 10px 0 5px 0;
   font-weight: bold;
   color: #23598C;
   font-size:20px;
   }

/* =======================================
   TrimImage
   ======================================= */

#trimimage {
   position: absolute;
   top: 75px;
   left: 12px;
   width: 720px;
   height: 211px;
   }

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

#trimimage li {
   padding: 3px 3px 1px 3px;
   margin: 0 4px 4px 0;
   border: #CCC 1px solid;
   background:#FFF;
   float:left;
   }