/*************************************************
 * Responsive
 *************************************************/

@media (max-width: 480px)
{
  div#contents
  {
    display:table;
	table-layout:fixed;
	width:100%;
  }
  div#menubar
  {
    display:table-footer-group;
    width:100%;
    border-width:0px 0px 1px 0px;
    border-color:#AAAAAA;
    border-style:solid;
  }
  div#body
  {
    display:table-row-group;
	width:100%;
  }
  div.img_margin
  {
    width:100%;
    float:none;
  }
  div#body>p>a>img,
  div.img_margin>a>img,
  div.img_margin>img
  {
    max-width:100%;
    height:auto;
  }

  select[name="template_page"]
  {
    width:100%;
  }
}

@media (min-width: 481px)
{
  div#contents
  {
    display:table;
    table-layout:fixed;
    width:100%;
  }
  div#menubar
  {
    display:table-cell;
    vertical-align:top;
    width:10em;
    border-width:0px 1px 0px 0px;
    border-color:#AAAAAA;
    border-style:dotted;
  }
  div#body
  {
    display:table-cell;
  }
  div.img_margin
  {
  }
  div#body>p>a>img,
  div.img_margin>a>img,
  div.img_margin>img
  {
    max-width:100%;
    height:auto;
  }
}

@media (min-width: 800px)
{
  body
  {
    max-width: 800px;
  }
}

/*************************************************
 * Basic
 *************************************************/
body
{
  margin-top: 1px;
  margin-left:2%;
  margin-right:2%;
  font-size:90%;
  line-height:120%;
  font-family:"verdana", "arial", "helvetica", "Sans-Serif";
  color:#111111;
  background-color: #FFFFFF;
}

a:link
{
  color:#0099CC;
  text-decoration: underline;
}

a:active {}

a:visited
{
  color:#E64444;
  text-decoration: underline;
}

a:hover
{
  color:#000000;
  background-color:#22BBEE;
}

h1 a:link, h1 a:visited,
h2 a:link, h2 a:visited,
h3 a:link, h3 a:visited,
h4 a:link, h4 a:visited
{
  color:#0099CC;
  text-decoration: none;
}
/*h1 a:hover,*/
/*h2 a:hover,*/
/*h3 a:hover,*/
/*h4 a:hover*/
/*{*/
/*  color:white;*/
/*  background-color:#0099CC;*/
/*  text-decoration: none;*/
/*}*/

h1 {font-size:240%;}
h2 {font-size:210%;}
h3 {font-size:190%;}
h4 {font-size:160%;}
h5 {font-size:130%;}
h6 {font-size:100%;}

h1, h2, h3, h4, h5, h6
{
  font-family:"verdana", "arial", "helvetica", "Sans-Serif";
  font-weight:bold;
  padding:0.8em 0.1em 0em 0.1em;
  line-height:100%;
  color:#222222;
  border-color:#DDDDDD;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  margin:10px 0px 5px 0px;
}

table { }

tr { }

td
{
  word-break : break-all;
}

img
{
	border:none;
}


/*************************************************
 * Block
 *************************************************/
pre, dl, ol, p, blockquote
{
    line-height:150%;
}

blockquote
{
	padding: 0px 0px 0px 5px;
	border-width: 0px 0px 0px 10px;
	border-style: none none none solid;
	border-color: #666655;
}

pre
{
  overflow: auto;
  /* padding:.5em; */
  /* margin-left:1em; */
  /* margin-right:2em; */
  white-space: pre;
  color:black;
  background-color:#DDDDDD;
  border: 1px solid #999999;
}

/*************************************************
 * Text Decoration
 *************************************************/
h1.title
{
  font-size: 30px;
  font-weight:bold;
  padding: 2px 0px 0px;
  border: 0px;
  margin: 2px 0px 0px;
}

ul
{
  margin-top:.5em;
  margin-bottom:.5em;
  line-height:150%;
}

em
{
  font-style:italic;
}

strong
{
  font-weight:bold;
  color:black;
}

thead td.style_td,
tfoot td.style_td
{
  color:inherit;
  background-color:#DDDDDD;
}

thead th.style_th,
tfoot th.style_th
{
  color:inherit;
  background-color:#DDEEEE;
}

/*************************************************
 * Text Style
 *************************************************/
span.size1, span.size2, span.size3,
span.size4, span.size5, span.size6,
span.size7
{
  line-height:150%;
  text-indent:0px;
  display:inline;
}
span.size1 { font-size:xx-small; }
span.size2 { font-size:x-small; }
span.size3 { font-size:small; }
span.size4 { font-size:medium; }
span.size5 { font-size:large; }
span.size6 { font-size:x-large; }
span.size7 { font-size:xx-large; }

/* html.php/catbody() */
strong.word0
{
  background-color:#FFFF66;
  color:black;
}
strong.word1
{
  background-color:#A0FFFF;
  color:black;
}
strong.word2
{
  background-color:#99FF99;
  color:black;
}
strong.word3
{
  background-color:#FF9999;
  color:black;
}
strong.word4
{
  background-color:#FF66FF;
  color:black;
}
strong.word5
{
  background-color:#880000;
  color:white;
}
strong.word6
{
  background-color:#00AA00;
  color:white;
}
strong.word7
{
  background-color:#886800;
  color:white;
}
strong.word8
{
  background-color:#004699;
  color:white;
}
strong.word9
{
  background-color:#990099;
  color:white;
}

.small
{
  font-size:80%;
}

.super_index
{
  color:#DD3333;
  background-color:inherit;
  font-weight:bold;
  font-size:60%;
  vertical-align:super;
}

a.note_super
{
  color:#EA7D7D;
  background-color:inherit;
  font-weight:bold;
  font-size:60%;
  vertical-align:super;
}

/*************************************************
 * Table Class
 *************************************************/
.style_table
{
  border:2px;
  border-style:solid;
  border-collapse:collapse;
  padding:0px;
  margin:auto auto auto 0px;
  text-align:left;
}

.style_th
{
  border:1px;
  border-style:solid;
  padding:5px;
  margin:0px;
  text-align:center;
  font-weight:bold;
}

.style_td
{
  border:1px;
  border-style:solid;
  padding:5px;
  margin:0px;
}

/*************************************************
 * List Class
 *************************************************/
ul.list1 { list-style-type:disc; }
ul.list2 { list-style-type:circle; }
ul.list3 { list-style-type:square; }
ol.list1 { list-style-type:decimal; }
ol.list2 { list-style-type:lower-roman; }
ol.list3 { list-style-type:lower-alpha; }

/*************************************************
 * Unknown ?
 *************************************************/
/* skin/tdialiy.css.php */
span.noexists
{
  color:#00CC33;
  font-weight: bold;
}

div.jumpmenu
{
  font-size:60%; 
  text-align:right;
}

/*************************************************
 * Horizontal line Class
 *************************************************/
hr.full_hr
{
  border-style:solid;
  border-color:#DDDDDD;
  border-width:1px;
}

hr.note_hr
{
  width:90%;
  border-style:solid;
  border-color:#DDDDDD;
  border-width:1px;
  text-align:center;
  margin:1em auto 0em auto;
}


/*************************************************
 * Menu bar Layout
 *************************************************/
div#menubar
{
  /* padding:10px; */
  /* margin:10px; */
  /* margin:0px 0px 0px 0px; */
  word-break:break-all;
  font-size:90%;
  overflow:hidden;
  background-color:#FFFFFF;
  line-height:150%;
}

div#menubar ul
{
  margin:0px 0px 0px .5em;
  padding:0px 0px 0px .5em;
}

div#menubar ul li
{
}

div#menubar div ul,
div#menubar ul li
{
  color:#333333;
}

div#menubar h1,
div#menubar h2,
div#menubar h3,
div#menubar h4,
div#menubar h5
{
  font-size:110%;
  color:#222222;
  background-color:#EEEEEE;
/*  border-color:#CCCCCC;*/
/*  border-style: solid;*/
  border-width: 0px 0px 0px 0px;
  padding:0.0em 0.1em 0.1em 0.1em;
  margin:0px 0px 0.4em 0px;
}

div#menubar a:link
{
  color:#0077CC;
  text-decoration: none;
}

div#menubar a:active {}

div#menubar a:visited {
  color:#0099CC;
  text-decoration: none;
}
div#menubar a:hover
{
  color:#000000;
  background-color:#22BBEE;
  text-decoration: underline;
}

div#menubar strong
{
  font-weight: normal;
}

/*************************************************
 * Elements ID (Plugins etc)
 *************************************************/
/* pukiwiki.skin.*.php */
div#header
{
  padding:0px;
  margin:0px;
}

div#navigator
{
  clear:both;
  padding:4px 0px 0px 0px;
  margin:0px;
}

div#contents
{
  padding:0;
  margin-top:4px;
}

div#body
{
  padding:0 4px;
}

div#note
{
  clear:both;
  padding:0px;
  margin:0px;
}

div#attach
{
  clear:both;
  padding:0px;
  margin:0px;
}

div#toolbar
{
  clear:both;
  padding:0px;
  margin:0px;
  text-align:right;
}

div#lastmodified
{
  clear:both;
  font-size:80%;
  padding:0px;
  margin:0px;
  text-align:right;
}

div#related
{
  font-size:80%;
  padding:0px;
  margin:16px 0px 0px 0px;
}

div#footer
{
  clear:both;
  font-size:70%;
  padding:0px;
  margin:16px 0px 0px 0px;
}

div#preview
{
}

img#logo
{
  float:left;
  margin-right:20px;
}

/*************************************************
 * Plugin Styles
 *************************************************/

/* html.php/edit_form() */
.edit_form
{
  clear:both;
}

/* aname.inc.php */
.anchor
{
}
.anchor_super
{
  font-size:xx-small;
  vertical-align:super;
}

/* br.inc.php */
br.spacer
{
}

/* calendar*.inc.php */
.style_calendar
{
  padding:0px;
  border:0px;
  margin:3px;
  color:inherit;
  background-color:#CCD5DD;
  text-align:center;
}

.style_td_caltop
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#EEF5FF;
  font-size:80%;
  text-align:center;
}

.style_td_today
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#FFFFDD;
  text-align:center;
}

.style_td_sat
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#DDE5FF;
  text-align:center;
}

.style_td_sun
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#FFEEEE;
  text-align:center;
}

.style_td_blank
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#EEF5FF;
  text-align:center;
}

.style_td_day
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#EEF5FF;
  text-align:center;
}

.style_td_week
{
  padding:5px;
  margin:1px;
  color:inherit;
  background-color:#DDE5EE;
  font-size:80%;
  font-weight:bold;
  text-align:center;
}

/* clear.inc.php */
.clear
{
  clear:both;
  margin:0px;
}

/* counter.inc.php */
div.counter
{
  font-size:70%;
}

/* diff.inc.php */
span.diff_added
{
  color:blue;
  background-color:inherit;
}

span.diff_removed
{
  color:red;
  background-color:inherit;
}

/* hr.inc.php */
hr.short_line
{
  text-align:center;
  width:80%;
  border-style:solid;
  border-color:#333333;
  border-width:1px 0px;
}

/* include.inc.php */
h5.side_label
{
  text-align:center;
}

/* navi.inc.php */
ul.navi
{
  margin:0px;
  padding:0px;
  text-align:center;
}

li.navi_none
{
  display:inline;
  float:none;
}

li.navi_left
{
  display:inline;
  float:left;
  text-align:left;
}

li.navi_right
{
  display:inline;
  float:right;
  text-align:right;
}

/* new.inc.php */
span.comment_date
{
  font-size:x-small;
}
span.new1
{
  color:#FF5500;
  font-weight: bolder;
  background-color:transparent;
  font-size:small;
}
span.new5
{
  color:#CC9900;
  background-color:transparent;
 font-size:xx-small;
}

/* popular.inc.php */
span.counter
{
  font-size:70%;
}
ul.popular_list
{
  padding:0px;
  border:0px;
  margin:0px 0px 0px 1em;
  word-wrap:break-word;
  word-break:break-all;
}

/* recent.inc.php,showrss.inc.php */
ul.recent_list
{
  padding:0px;
  border:0px;
  margin:0px 0px 0px 1em;
  word-wrap:break-word;
  word-break:break-all;
}

/* ref.inc.php */
div.img_margin
{
  margin:3px;
}

/* vote.inc.php */
td.vote_label
{
  color:#000000;
  background-color:#66CCCC;
}
td.vote_td1
{
  color:#000000;
  background-color:#DDE5FF;
}
td.vote_td2
{
  color:#000000;
  background-color:#EEF5FF;
}

/* comment.inc.php */
input#_p_comment_name_0,
input#_p_comment_name_1,
input#_p_comment_name_2,
input#_p_comment_name_3,
input#_p_comment_name_4,
input#_p_comment_name_5
{
}
input#_p_comment_comment_0,
input#_p_comment_comment_1,
input#_p_comment_comment_2,
input#_p_comment_comment_3,
input#_p_comment_comment_4,
input#_p_comment_comment_5
{
width:50%;
}
