/* 猫目埠頭サイト共通定義 */

/* 基本要素定義 */
body {
  color: black;
  background-color: white;
}

h1 {
  font-size:2.5em;
  font-width: bold;
  text-align: right;
  background-color: #ffdead; 
  border-width: 0 0 2px 0.3em;
  border-color: black;
  border-style: solid;
}

h1:first-letter {
  color: red;
}

address {
  background-color: #ffdead; 
  display: block;
  text-align: left;
  padding-top: 3px;
  border-style: solid solid none none;
  border-right-width: 15px;
  border-top-width: 2px;
}


/* ヘッダー */
span.header {
  display: block;
  font-size: 30%;
  border-width: 0 0 1px;
  border-color: black;
  border-style: solid;
}

span.header:first-letter {
  color: red;
}


/* フッター */
span.footer {
  display: block;
  font-size: 50%;
  border-width: 1px 0 0;
  border-color: black;
  border-style: solid;
}

span.footer:first-letter {
  color: red;
}


/* 短かいコメント */
p.comment {
  font-size: 0.8em;
  font-family: fantasy, cursive;
}


/* 作品紹介 */
div.work {
  padding: 0;
  margin: 2em 10% 2em 10%;
  border-width: 1px 0.2em 0.2em 1px;
  border-style: solid;
  border-color: #888;
}
  
div.work h2 {
  text-align: right;
  margin: 0;
  border-width: 0 0 1px 0;
  border-style: solid;
  font-size: 1.7em;
  font-style: oblique;
  font-family: cursive;
}

div.work h3 {
  text-align: right;
  margin: 1em 0.5em 1em 1em;
  border-width: 0 0 1px 0.3em;
  border-style: solid;
  font-size: 1.2em;
}

div.work h2 a {
  color: black;
  text-decoration: none;
}

div.work h2 a:hover {
  color: white;
}

div.work p {
  text-indent: 0.5em;
  line-height: 1.3em;
  margin: 0.5em 1em 0.5em 2em;
  font-family: sans-serif;
}


/* サイトナビゲーター */
ul.navigator {
  margin: 1em;
  padding: 0;
  font-size: 0.8em;
}

ul.navigator li {
  display :inline;
  margin: 0 1em;
}

ul.navigator li a {
  text-decoration: none;
  color: #888;
  background-image: url(/img/libar.png);
  background-repeat: no-repeat;
}

ul.navigator li a:hover {
  color: #000;
  background-image: url(/img/libar_active.png);
  background-repeat: no-repeat;
}
 
ul.navigator#top {
  text-align: right;
}

ul.navigator#bottom {
  text-align: bottom;
}